html.wp-toolbar:has(body.yooadmin-desktop-surface.yoo-focus),
html:has(body.yooadmin-desktop-surface.yoo-focus) {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus.admin-bar {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus.desktop-mode-active #wpadminbar {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus #wpwrap,
body.yooadmin-desktop-surface.yoo-focus #wpcontent,
body.yooadmin-desktop-surface.yoo-focus #wpbody,
body.yooadmin-desktop-surface.yoo-focus #wpbody-content {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.yooadmin-desktop-surface.yoo-focus .yoo-shell-content {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-header-wrapper {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: var(--yooadmin-desktop-breadcrumbs-z, 100001) !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-header {
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-header-left,
body.yooadmin-desktop-surface.yoo-focus .yp-header-center,
body.yooadmin-desktop-surface.yoo-focus .yp-header-right {
  display: none !important;
}

/*
 * Desktop surface colors follow YOOAdmin / Studio Hub tokens (light + dark engine).
 * Override only these aliases — not every menu node.
 */
body.yooadmin-desktop-surface.yoo-focus {
  --yooadmin-desktop-surface-bg: var(--yp-header-bg, var(--yooadmin-header-bg, #4b4b4b));
  --yooadmin-desktop-surface-fg: var(--ysh-header-fg, var(--yp-text-contrast, #fff));
  --yooadmin-desktop-surface-border: color-mix(in srgb, var(--yooadmin-desktop-surface-fg) 12%, transparent);
  --yooadmin-desktop-surface-hover: color-mix(in srgb, var(--yooadmin-desktop-surface-fg) 10%, transparent);
  --yooadmin-desktop-surface-shadow: var(--ysh-breadcrumbs-elev, 0 12px 32px rgba(0, 0, 0, 0.35));
  --yooadmin-desktop-popover-bg: var(--yooadmin-desktop-surface-bg);
  --yooadmin-desktop-popover-fg: var(--yooadmin-desktop-surface-fg);
  --yooadmin-desktop-popover-border: var(--yooadmin-desktop-surface-border);
  --yooadmin-desktop-popover-hover: var(--yooadmin-desktop-surface-hover);
  --yooadmin-desktop-popover-shadow: var(--yooadmin-desktop-surface-shadow);
  /* Dropdown menus (lang / appearance / width) — same strip as header, desktop mode only. */
  --yooadmin-desktop-menu-bg: var(--yooadmin-desktop-surface-bg);
  --yooadmin-desktop-menu-fg: var(--yooadmin-desktop-surface-fg);
  --yooadmin-desktop-menu-border: var(--yooadmin-desktop-surface-border);
  --yooadmin-desktop-menu-hover: var(--yooadmin-desktop-surface-hover);
  --yooadmin-desktop-menu-shadow: var(--yooadmin-desktop-surface-shadow);
}

html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus,
html.yooadmin-studio-hub-html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus {
  --yooadmin-desktop-surface-bg: var(--yp-header-bg, var(--ysh-surface, #121418));
  --yooadmin-desktop-surface-fg: var(--ysh-breadcrumb-fg, var(--ysh-text, #cfd6e0));
  --yooadmin-desktop-surface-border: var(--ysh-border, rgba(255, 255, 255, 0.1));
  --yooadmin-desktop-surface-hover: rgba(255, 255, 255, 0.08);
  --yooadmin-desktop-surface-shadow: var(--ysh-breadcrumbs-elev, 0 12px 32px rgba(0, 0, 0, 0.45));
  --yooadmin-desktop-menu-bg: var(--yooadmin-desktop-surface-bg);
  --yooadmin-desktop-menu-fg: var(--yooadmin-desktop-surface-fg);
  --yooadmin-desktop-menu-border: var(--yooadmin-desktop-surface-border);
  --yooadmin-desktop-menu-hover: var(--yooadmin-desktop-surface-hover);
  --yooadmin-desktop-menu-shadow: var(--yooadmin-desktop-surface-shadow);
  --desktop-mode-bg: var(--ysh-surface, #121418);
  --desktop-mode-fg: var(--ysh-text, #d0d7df);
  --desktop-mode-text: var(--ysh-text, #d0d7df);
  --desktop-mode-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-border: var(--ysh-border, rgba(255, 255, 255, 0.08));
  --desktop-mode-dock-bg: color-mix(in srgb, var(--ysh-card, #1a1d23) 70%, transparent);
}

html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus.desktop-mode-active,
html.yooadmin-studio-hub-html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus.desktop-mode-active {
  background: var(--ysh-surface, #121418) !important;
}

/*
 * YOOAdmin dark engine → Desktop Mode wallpaper / dock / widgets (simple bridge).
 * Canvas wallpapers ignore --desktop-mode-bg; filter + overlay darkens the surface.
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active,
#desktop-mode-shell.yooadmin-desktop-dark-surface {
  --desktop-mode-bg: var(--ysh-surface, #121418);
  --desktop-mode-fg: var(--ysh-text, #d0d7df);
  --desktop-mode-text: var(--ysh-text, #d0d7df);
  --desktop-mode-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-border: var(--ysh-border, rgba(255, 255, 255, 0.08));
  --desktop-mode-dock-bg: color-mix(in srgb, var(--ysh-card, #1a1d23) 72%, transparent);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-wallpaper,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-wallpaper,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-wallpaper {
  filter: brightness(0.32) saturate(0.5) contrast(1.1) !important;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-wallpaper::after,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-wallpaper::after,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-wallpaper::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ysh-surface, #121418) 28%, transparent) 0%,
    color-mix(in srgb, var(--ysh-surface, #121418) 72%, transparent) 100%
  );
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-dock,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-dock,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-dock {
  background: var(--desktop-mode-dock-bg, rgba(0, 0, 0, 0.45)) !important;
  color: var(--desktop-mode-fg, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-icon__label,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-icon__label,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-icon__label {
  color: var(--desktop-mode-fg, #d0d7df);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-widgets__card,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-widgets__card,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-widgets__card {
  background: color-mix(in srgb, var(--ysh-card, #1a1d23) 88%, transparent) !important;
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1)) !important;
  color: var(--ysh-text, #d0d7df) !important;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-area,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-area,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-area {
  color: var(--desktop-mode-fg, #d0d7df);
}

/*
 * Desktop windows (iframe shells) follow YOOAdmin dark tokens.
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window {
  --desktop-mode-window-bg: var(--ysh-card, #1a1d23);
  --desktop-mode-window-border: var(--ysh-border, rgba(255, 255, 255, 0.1));
  --desktop-mode-border: var(--ysh-border, rgba(255, 255, 255, 0.1));
  --desktop-mode-fg: var(--ysh-text, #d0d7df);
  --desktop-mode-text: var(--ysh-text, #d0d7df);
  --desktop-mode-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-muted-fg: var(--ysh-muted, #9eb0bd);
  --desktop-mode-tabs-bg: color-mix(in srgb, var(--ysh-card, #1a1d23) 90%, #000);
  --desktop-mode-tabs-color: var(--ysh-muted, #9eb0bd);
}

/*
 * In-window tab strip (Settings → General / Writing / Reading / …).
 * Desktop Mode defaults to light strip tokens (#f6f7f7 + dark text).
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tabs,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tabs,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__tabs {
  background: var(--desktop-mode-tabs-bg, color-mix(in srgb, var(--ysh-card, #1a1d23) 90%, #000)) !important;
  border-bottom-color: var(--ysh-border, rgba(255, 255, 255, 0.1)) !important;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tab,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tab,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__tab {
  color: var(--desktop-mode-tabs-color, var(--ysh-muted, #9eb0bd));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tab:hover,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tab:hover,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__tab:hover {
  color: var(--ysh-text, #d0d7df);
  background: rgba(255, 255, 255, 0.06);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tab--active,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__tab--active,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__tab--active {
  color: var(--_yp-primary, var(--yooadmin-primary, #eda934));
  border-bottom-color: var(--_yp-primary, var(--yooadmin-primary, #eda934));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__titlebar,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__titlebar,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__titlebar {
  background: color-mix(in srgb, var(--ysh-card, #1a1d23) 92%, #000) !important;
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1)) !important;
  color: var(--ysh-text, #d0d7df) !important;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__body,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__body,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__body {
  background: var(--ysh-surface, #121418) !important;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__body--native,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-window__body--native,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-window__body--native {
  color: var(--ysh-text, #d0d7df);
  background: var(--ysh-surface, #121418);
}

/*
 * Desktop Mode native windows (Plugins, Posts, Users, …) use the WPD
 * design-system tokens (--wpd-surface, --wpd-table-*, wpd-table shadow DOM).
 * Bridge YOOAdmin dark tokens onto the shell so inner content darkens too.
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell,
#desktop-mode-shell.yooadmin-desktop-dark-surface {
  color-scheme: dark;
  --desktop-mode-titlebar-bg: color-mix(in srgb, var(--ysh-card, #1a1d23) 88%, #000);
  --desktop-mode-titlebar-color: var(--ysh-text, #d0d7df);
  --wpd-surface: var(--ysh-card, #1a1d23);
  --wpd-surface-elevated: #22262e;
  --wpd-card-bg: var(--ysh-card, #1a1d23);
  --wpd-card-fg: var(--ysh-text, #d0d7df);
  --wpd-card-border: var(--ysh-border, rgba(255, 255, 255, 0.1));
  --wpd-card-border-hover: rgba(255, 255, 255, 0.16);
  --wpd-card-shadow-hover: 0 4px 16px rgba(0, 0, 0, 0.35);
  --wpd-bg: var(--ysh-surface, #121418);
  --wpd-bg-muted: rgba(255, 255, 255, 0.06);
  --wpd-border: var(--ysh-border, rgba(255, 255, 255, 0.1));
  --wpd-border-strong: rgba(255, 255, 255, 0.16);
  --wpd-fg: var(--ysh-text, #d0d7df);
  --wpd-fg-muted: var(--ysh-muted, #9eb0bd);
  --wpd-text: var(--ysh-text, #d0d7df);
  --wpd-text-muted: var(--ysh-muted, #9eb0bd);
  --wpd-table-row-hover: rgba(255, 255, 255, 0.06);
  --wpd-table-stripe: rgba(255, 255, 255, 0.03);
  --wpd-table-skeleton-color: rgba(255, 255, 255, 0.08);
  --wpd-accent-soft: color-mix(in srgb, var(--_yp-primary, var(--yooadmin-primary, #eda934)) 22%, transparent);
  /* Light-context window surfaces (My WordPress, folder windows) bind dark
   * foreground tokens for white backgrounds — rebind for YOOAdmin dark. */
  --desktop-mode-fg-on-light: var(--ysh-text, #d0d7df);
  --desktop-mode-my-wordpress-fg: var(--ysh-text, #d0d7df);
  --desktop-mode-my-wordpress-bg: var(--ysh-surface, #121418);
  --desktop-mode-folder-window-bg: var(--ysh-surface, #121418);
  --desktop-mode-hover: rgba(255, 255, 255, 0.08);
  --desktop-mode-input-bg: #22262e;
  --desktop-mode-input-fg: var(--ysh-text, #d0d7df);
  --desktop-mode-input-border: rgba(255, 255, 255, 0.12);
  --desktop-mode-input-placeholder: var(--ysh-muted, #9eb0bd);
  --wpd-surface: var(--desktop-mode-input-bg, #22262e);
  --wpd-surface-2: #2a2f38;
}

/*
 * Form fields — search boxes, native inputs/textareas, and WPD shadow-DOM controls.
 * Desktop Mode hardcodes #fff on several surfaces (bug report, list toolbars).
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell wpd-text-field,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell wpd-textarea,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell wpd-search-field,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell wpd-text-field,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell wpd-textarea,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell wpd-search-field,
#desktop-mode-shell.yooadmin-desktop-dark-surface wpd-text-field,
#desktop-mode-shell.yooadmin-desktop-dark-surface wpd-textarea,
#desktop-mode-shell.yooadmin-desktop-dark-surface wpd-search-field {
  --desktop-mode-window-bg: var(--desktop-mode-input-bg, #22262e);
  --desktop-mode-text: var(--desktop-mode-input-fg, #d0d7df);
  --desktop-mode-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-border: var(--desktop-mode-input-border, rgba(255, 255, 255, 0.12));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell :is(
    .desktop-mode-my-wordpress__list-toolbar-search-input,
    .desktop-mode-bug-report__input,
    .desktop-mode-bug-report__textarea,
    .desktop-mode-content-graph__search-input,
    .desktop-mode-os-settings__library-search,
    .desktop-mode-create-folder-dialog__input,
    .desktop-mode-ai__input,
    .wpd-mindmap__search-input,
    .wpd-tagcloud__search-input
  ),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell :is(
    .desktop-mode-my-wordpress__list-toolbar-search-input,
    .desktop-mode-bug-report__input,
    .desktop-mode-bug-report__textarea,
    .desktop-mode-content-graph__search-input,
    .desktop-mode-os-settings__library-search,
    .desktop-mode-create-folder-dialog__input,
    .desktop-mode-ai__input,
    .wpd-mindmap__search-input,
    .wpd-tagcloud__search-input
  ),
#desktop-mode-shell.yooadmin-desktop-dark-surface :is(
    .desktop-mode-my-wordpress__list-toolbar-search-input,
    .desktop-mode-bug-report__input,
    .desktop-mode-bug-report__textarea,
    .desktop-mode-content-graph__search-input,
    .desktop-mode-os-settings__library-search,
    .desktop-mode-create-folder-dialog__input,
    .desktop-mode-ai__input,
    .wpd-mindmap__search-input,
    .wpd-tagcloud__search-input
  ) {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--desktop-mode-input-bg, #22262e) !important;
  color: var(--desktop-mode-input-fg, #d0d7df);
  border-color: var(--desktop-mode-input-border, rgba(255, 255, 255, 0.12));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell :is(
    .desktop-mode-my-wordpress__list-toolbar-search-input,
    .desktop-mode-bug-report__input,
    .desktop-mode-bug-report__textarea,
    .desktop-mode-content-graph__search-input,
    .desktop-mode-os-settings__library-search,
    .desktop-mode-create-folder-dialog__input,
    .desktop-mode-ai__input,
    .wpd-mindmap__search-input,
    .wpd-tagcloud__search-input
  )::placeholder,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell :is(
    .desktop-mode-my-wordpress__list-toolbar-search-input,
    .desktop-mode-bug-report__input,
    .desktop-mode-bug-report__textarea,
    .desktop-mode-content-graph__search-input,
    .desktop-mode-os-settings__library-search,
    .desktop-mode-create-folder-dialog__input,
    .desktop-mode-ai__input,
    .wpd-mindmap__search-input,
    .wpd-tagcloud__search-input
  )::placeholder,
#desktop-mode-shell.yooadmin-desktop-dark-surface :is(
    .desktop-mode-my-wordpress__list-toolbar-search-input,
    .desktop-mode-bug-report__input,
    .desktop-mode-bug-report__textarea,
    .desktop-mode-content-graph__search-input,
    .desktop-mode-os-settings__library-search,
    .desktop-mode-create-folder-dialog__input,
    .desktop-mode-ai__input,
    .wpd-mindmap__search-input,
    .wpd-tagcloud__search-input
  )::placeholder {
  color: var(--desktop-mode-input-placeholder, #9eb0bd);
  opacity: 1;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell .desktop-mode-bug-report__metadata,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active #desktop-mode-shell .desktop-mode-bug-report__metadata,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-bug-report__metadata {
  background: rgba(255, 255, 255, 0.04);
  border-color: var(--desktop-mode-input-border, rgba(255, 255, 255, 0.12));
  color: var(--ysh-muted, #9eb0bd);
}

/*
 * My WordPress + folder windows: retint tile labels/icons for dark surfaces.
 * Desktop Mode sets light-context --desktop-mode-tile-* locally; override here.
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-my-wordpress,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-folder-window {
  color: var(--ysh-text, #d0d7df);
  --desktop-mode-tile-fg: var(--ysh-text, #d0d7df);
  --desktop-mode-tile-fg-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-tile-hover-bg: rgba(255, 255, 255, 0.08);
  --desktop-mode-tile-label-color: var(--ysh-text, #d0d7df);
  --desktop-mode-tile-label-shadow: none;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress > .desktop-mode-folder-status-bar,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window .desktop-mode-folder-status-bar,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress > .desktop-mode-folder-status-bar,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window .desktop-mode-folder-status-bar,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-my-wordpress > .desktop-mode-folder-status-bar,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-folder-window .desktop-mode-folder-status-bar {
  color: var(--ysh-muted, #9eb0bd);
  border-top-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress .desktop-mode-file-tile__icon,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress .desktop-mode-file-tile__visual,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window .desktop-mode-file-tile__icon,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window .desktop-mode-file-tile__visual,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress .desktop-mode-file-tile__icon,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-my-wordpress .desktop-mode-file-tile__visual,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window .desktop-mode-file-tile__icon,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-folder-window .desktop-mode-file-tile__visual,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-my-wordpress .desktop-mode-file-tile__icon,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-my-wordpress .desktop-mode-file-tile__visual,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-folder-window .desktop-mode-file-tile__icon,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-folder-window .desktop-mode-file-tile__visual {
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-plugins,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-plugins,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-plugins,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-plugins__installed,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-plugins__browse,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-plugins__installed,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-plugins__browse {
  background: var(--ysh-surface, #121418);
  color: var(--ysh-text, #d0d7df);
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar {
  background: var(--yooadmin-desktop-popover-bg) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--yooadmin-desktop-popover-border) !important;
  box-shadow: none !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-inner {
  gap: 10px !important;
  padding-block: 7px !important;
  padding-inline: 12px !important;
  min-height: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-brand-cluster {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  min-width: 0;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-tools .yp-breadcrumbs-maintenance .yooadmin-maintenance-pill--shell {
  margin: 0;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yooadmin-maintenance-pill.is-off,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yooadmin-maintenance-pill.is-off :is(
  .yooadmin-maintenance-pill__settings-link,
  .yooadmin-maintenance-pill__icon,
  .yooadmin-maintenance-pill__label,
  .yooadmin-maintenance-pill__toggle-btn
) {
  color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
  -webkit-text-fill-color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-brand {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  line-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 8px;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-brand:focus-visible {
  outline: 2px solid var(--_yp-primary, var(--yooadmin-primary, #eda934));
  outline-offset: 2px;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-brand__icon {
  display: block;
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  object-fit: contain;
  border-radius: 6px;
}

/*
 * Desktop wallpaper icons: keep Desktop Mode defaults (48px).
 * Do NOT enlarge YOOAdmin on the wallpaper — only .yp-breadcrumbs-brand__icon above.
 */
body.yooadmin-desktop-surface.yoo-focus .desktop-mode-icon__image,
body.yooadmin-desktop-surface.yoo-focus .desktop-mode-icon__image img {
  width: 48px;
  height: 48px;
  max-width: 48px;
  max-height: 48px;
}

body.yooadmin-desktop-surface.yoo-focus .desktop-mode-icon[data-icon-id="yooadmin-panel"] .desktop-mode-icon__image,
body.yooadmin-desktop-surface.yoo-focus .desktop-mode-icon[data-icon-id="yooadmin-panel"] .desktop-mode-icon__image img {
  width: 48px !important;
  height: 48px !important;
  max-width: 48px !important;
  max-height: 48px !important;
  font-size: 32px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs a,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs .yp-bc-current,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs .yp-bc-link {
  font-size: 12px !important;
  line-height: 1.2 !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-bc-home-icon,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs .dashicons {
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-bc-item + .yp-bc-item::before {
  margin-inline: 6px !important;
  font-size: 12px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools {
  gap: 8px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts {
  gap: 6px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger {
  min-width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-icon .dashicons,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-icon svg,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-icon img {
  width: 18px;
  height: 18px;
  max-width: 18px;
  max-height: 18px;
  font-size: 18px;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-label {
  font-size: 11px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .ysh-appearance .ysh-appearance__toggle,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-breadcrumbs-lang .yp-breadcrumbs-lang__toggle,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-command-palette-trigger {
  min-height: 32px !important;
  min-width: 32px !important;
  padding: 2px 5px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .ysh-appearance .ysh-appearance__svg,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .ysh-appearance .ysh-appearance__dash {
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-command-palette-trigger__icon {
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-command-palette-trigger__kbd {
  font-size: 10px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-link,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-text {
  font-size: 12px !important;
  line-height: 1.25 !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-link {
  padding: 6px 10px !important;
  border-radius: 6px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-link .dashicons,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-link .ab-icon,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-icon {
  font-size: 17px !important;
  width: 17px !important;
  height: 17px !important;
  margin-inline-end: 8px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu {
  padding: 4px !important;
  gap: 1px !important;
  border-radius: 10px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu--overflow {
  padding: 6px 8px !important;
  gap: 6px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu--overflow > .yp-toolbar-item > .yp-toolbar-trigger,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu .yp-toolbar-trigger {
  min-width: 32px !important;
  height: 32px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-badge {
  font-size: 10px !important;
  padding: 0 5px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-network-admin-badge .dashicons {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-network-admin-badge__label {
  font-size: 11px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-breadcrumbs-lang .yp-breadcrumbs-lang__toggle .yp-breadcrumbs-lang__icon,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-breadcrumbs-lang .yp-breadcrumbs-lang__toggle .dashicons {
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-lang__menu {
  padding: 4px !important;
  border-radius: 10px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-lang__option {
  font-size: 12px !important;
  padding: 6px 10px !important;
  border-radius: 6px !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs a,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs .yp-bc-current,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs .yp-bc-link,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-label,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .ysh-appearance,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-breadcrumbs-lang,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-command-palette-trigger,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-network-admin-badge {
  color: var(--yooadmin-desktop-surface-fg) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-surface-fg) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-icon,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .yp-toolbar-icon .dashicons {
  color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > .yp-toolbar-shortcuts > .yp-toolbar-item > .yp-toolbar-trigger .dashicons {
  color: inherit !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(
  .yp-toolbar-menu,
  .yp-toolbar-submenu,
  .yp-breadcrumbs-lang__menu,
  .ysh-appearance__menu,
  .ysh-width__menu
) {
  background: var(--yooadmin-desktop-menu-bg, var(--yooadmin-desktop-surface-bg)) !important;
  border: 1px solid var(--yooadmin-desktop-menu-border, var(--yooadmin-desktop-surface-border)) !important;
  box-shadow: var(--yooadmin-desktop-menu-shadow, var(--yooadmin-desktop-surface-shadow)) !important;
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(
  .yp-toolbar-menu-link,
  .yp-toolbar-menu-text,
  .yp-breadcrumbs-lang__option,
  .ysh-appearance__option,
  .ysh-width__option
) {
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(
  .yp-toolbar-menu-link,
  .yp-toolbar-submenu
) :is(.dashicons, .ab-icon, .yp-toolbar-menu-icon),
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-link .yp-toolbar-menu-icon-inline svg,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .ysh-appearance__option :is(.ysh-appearance__svg, .ysh-appearance__dash) {
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(
  .yp-toolbar-menu-link,
  .yp-breadcrumbs-lang__option,
  .ysh-appearance__option,
  .ysh-width__option
):is(:hover, :focus) {
  background: var(--yooadmin-desktop-menu-hover, var(--yooadmin-desktop-surface-hover)) !important;
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu-link:is(:hover, :focus) :is(.dashicons, .ab-icon) {
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(
  .ysh-appearance__option.is-active,
  .ysh-width__option.is-active
) {
  border-color: color-mix(in srgb, var(--_yp-primary, var(--yooadmin-primary, #eda934)) 55%, transparent) !important;
  background: color-mix(in srgb, var(--_yp-primary, var(--yooadmin-primary, #eda934)) 18%, transparent) !important;
  color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
  -webkit-text-fill-color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-lang__option.is-active {
  border-color: transparent !important;
  background: color-mix(in srgb, var(--_yp-primary, var(--yooadmin-primary, #eda934)) 14%, transparent) !important;
  color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
  -webkit-text-fill-color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .ysh-appearance__option.is-active :is(.ysh-appearance__svg, .ysh-appearance__dash) {
  color: var(--yooadmin-desktop-popover-fg) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-popover-fg) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu > .yp-toolbar-menu-link:not(:last-child)::after,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu > .yp-toolbar-menu-item:not(:last-child) > .yp-toolbar-menu-link::after,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-submenu .yp-toolbar-menu-link:not(:last-child)::after {
  background: linear-gradient(
    to right,
    transparent,
    color-mix(in srgb, var(--yooadmin-desktop-popover-fg) 12%, transparent) 10%,
    color-mix(in srgb, var(--yooadmin-desktop-popover-fg) 12%, transparent) 90%,
    transparent
  ) !important;
  box-shadow: none !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu .yp-toolbar-trigger,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu .yp-toolbar-label,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu .yp-toolbar-trigger .yp-toolbar-icon,
body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-toolbar-menu .yp-toolbar-trigger .yp-toolbar-icon .dashicons {
  color: var(--_yp-primary, var(--yooadmin-primary, #eda934)) !important;
  -webkit-text-fill-color: currentColor !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs .yp-bc-item.is-home {
  display: none !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-dashboard-footer {
  display: none !important;
}

body.yooadmin-desktop-surface.yoo-focus:has(.desktop-mode-window--maximized),
body.yooadmin-desktop-surface.yoo-focus:has(.desktop-mode-window--fullscreen),
body.yooadmin-desktop-surface.yoo-focus.desktop-mode-has-fullscreen-window {
  --yooadmin-desktop-breadcrumbs-z: 100;
}

body.yooadmin-desktop-surface.yoo-focus:has(.desktop-mode-window--maximized) #desktop-mode-shell,
body.yooadmin-desktop-surface.yoo-focus:has(.desktop-mode-window--fullscreen) #desktop-mode-shell,
body.yooadmin-desktop-surface.yoo-focus.desktop-mode-has-fullscreen-window #desktop-mode-shell {
  z-index: 100002 !important;
  inset-block-start: 0 !important;
}

body.yooadmin-desktop-surface.yoo-focus:has(.desktop-mode-window--maximized) .desktop-mode-window--maximized,
body.yooadmin-desktop-surface.yoo-focus:has(.desktop-mode-window--fullscreen) .desktop-mode-window--fullscreen {
  z-index: 100003 !important;
}

/* Pin dropdown menus to header strip tokens in desktop mode (beats Studio Hub card overrides). */
html[data-yooadmin-studio-color-mode-effective="light"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu, .yp-toolbar-submenu, .yp-breadcrumbs-lang__menu, .ysh-appearance__menu, .ysh-width__menu),
html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu, .yp-toolbar-submenu, .yp-breadcrumbs-lang__menu, .ysh-appearance__menu, .ysh-width__menu),
html.yooadmin-studio-hub-html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu, .yp-toolbar-submenu, .yp-breadcrumbs-lang__menu, .ysh-appearance__menu, .ysh-width__menu) {
  background: var(--yooadmin-desktop-menu-bg, var(--yooadmin-desktop-surface-bg)) !important;
  border-color: var(--yooadmin-desktop-menu-border, var(--yooadmin-desktop-surface-border)) !important;
  box-shadow: var(--yooadmin-desktop-menu-shadow, var(--yooadmin-desktop-surface-shadow)) !important;
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

html[data-yooadmin-studio-color-mode-effective="light"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu-link, .yp-toolbar-menu-text, .yp-breadcrumbs-lang__option, .ysh-appearance__option, .ysh-width__option),
html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu-link, .yp-toolbar-menu-text, .yp-breadcrumbs-lang__option, .ysh-appearance__option, .ysh-width__option),
html.yooadmin-studio-hub-html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu-link, .yp-toolbar-menu-text, .yp-breadcrumbs-lang__option, .ysh-appearance__option, .ysh-width__option),
html[data-yooadmin-studio-color-mode-effective="light"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu-link, .yp-toolbar-submenu) :is(.dashicons, .ab-icon, .yp-toolbar-menu-icon),
html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu-link, .yp-toolbar-submenu) :is(.dashicons, .ab-icon, .yp-toolbar-menu-icon),
html.yooadmin-studio-hub-html[data-yooadmin-studio-color-mode-effective="dark"] body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(.yp-toolbar-menu-link, .yp-toolbar-submenu) :is(.dashicons, .ab-icon, .yp-toolbar-menu-icon) {
  color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
  -webkit-text-fill-color: var(--yooadmin-desktop-menu-fg, var(--yooadmin-desktop-surface-fg)) !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar .yp-breadcrumbs-tools > :is(
  .ysh-appearance,
  .yp-breadcrumbs-lang,
  .ysh-width,
  .yp-command-palette-trigger
):not(:last-child)::after {
  background: linear-gradient(
    to bottom,
    transparent,
    color-mix(in srgb, var(--yooadmin-desktop-surface-fg) 14%, transparent) 20%,
    color-mix(in srgb, var(--yooadmin-desktop-surface-fg) 14%, transparent) 80%,
    transparent
  ) !important;
  box-shadow: none !important;
}

body.yooadmin-desktop-surface.yoo-focus .yp-breadcrumbs-bar :is(
  .ysh-appearance__toggle,
  .yp-breadcrumbs-lang__toggle,
  .ysh-width__toggle
) {
  background: transparent !important;
  box-shadow: none !important;
}

/*
 * Desktop window loading spinner — YOOAdmin logo in the center instead of the WP mark.
 * Rings only: center disc hidden in JS; logo sits on transparent window background.
 */
#desktop-mode-shell .desktop-mode-window__loading.yooadmin-desktop-loading-overlay {
  position: absolute;
  background: transparent;
}

#desktop-mode-shell .desktop-mode-window__loading.yooadmin-desktop-loading-overlay wpd-spinner {
  --wpd-spinner-color: var(--_yp-primary, var(--yooadmin-primary, #eda934));
  --wpd-spinner-accent: transparent;
}

#desktop-mode-shell .yooadmin-desktop-loading-brand {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: clamp(52px, 15vw, 108px);
  height: clamp(52px, 15vw, 108px);
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  background: transparent;
}

#desktop-mode-shell .yooadmin-desktop-loading-brand img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  background: transparent;
  filter: none;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) #desktop-mode-shell .yooadmin-desktop-loading-brand img,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) #desktop-mode-shell .yooadmin-desktop-loading-brand img,
#desktop-mode-shell.yooadmin-desktop-dark-surface .yooadmin-desktop-loading-brand img {
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4));
}

/*
 * Desktop Mode AI Assistant (Ctrl+K / palette-cycle) — YOOAdmin dark tokens.
 * The overlay ships light by default; retint when Studio Hub / shell dark is active.
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__panel,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__panel,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__panel {
  background: color-mix(in srgb, var(--ysh-card, #1a1d23) 94%, #000);
  color: var(--ysh-text, #d0d7df);
  box-shadow:
    0 0 0 1px var(--ysh-border, rgba(255, 255, 255, 0.1)),
    0 4px 16px rgba(0, 0, 0, 0.35),
    0 24px 64px rgba(0, 0, 0, 0.55);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__header,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__header,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__header {
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--yooadmin-primary, #eda934) 14%, var(--ysh-card, #1a1d23)),
    var(--ysh-card, #1a1d23)
  );
  border-bottom-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__header-icon,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__header-label,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input-icon,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__header-icon,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__header-label,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input-icon,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__header-icon,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__header-label,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input-icon {
  color: var(--yooadmin-primary, #eda934);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input-wrap,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input-wrap,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input-wrap {
  background: color-mix(in srgb, var(--ysh-card, #1a1d23) 94%, #000);
  border-bottom-color: var(--ysh-border, rgba(255, 255, 255, 0.08));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input-wrap:has(.desktop-mode-ai__input:focus),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input-wrap:has(.desktop-mode-ai__input:focus),
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input-wrap:has(.desktop-mode-ai__input:focus) {
  border-bottom-color: color-mix(in srgb, var(--yooadmin-primary, #eda934) 35%, rgba(255, 255, 255, 0.12));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input {
  -webkit-appearance: none;
  appearance: none;
  min-height: 0;
  padding: 0;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input:focus,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input:focus-visible,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input:focus,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input:focus-visible,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input:focus,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input:focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input::placeholder,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__input::placeholder,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__input::placeholder {
  color: var(--ysh-muted, #9eb0bd);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__submit,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__submit,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__submit {
  background: var(--yooadmin-primary, #eda934);
  color: #fff;
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__footer,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__footer,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__footer {
  background: color-mix(in srgb, var(--ysh-card, #1a1d23) 88%, #000);
  border-top-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__footer-hint,
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__suggestions-label,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__footer-hint,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__suggestions-label,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__footer-hint,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__suggestions-label {
  color: var(--ysh-muted, #9eb0bd);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__suggestion,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__suggestion,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__suggestion {
  background: rgba(255, 255, 255, 0.04);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.12));
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__suggestion:hover,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__suggestion:hover,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__suggestion:hover {
  background: color-mix(in srgb, var(--yooadmin-primary, #eda934) 12%, rgba(255, 255, 255, 0.06));
  border-color: color-mix(in srgb, var(--yooadmin-primary, #eda934) 35%, rgba(255, 255, 255, 0.12));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__close,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__close,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__close {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.12));
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__close:hover,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__close:hover,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__close:hover {
  background: rgba(255, 255, 255, 0.1);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__footer-keys kbd,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__footer-keys kbd,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__footer-keys kbd {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.12));
  color: var(--ysh-muted, #9eb0bd);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__backdrop,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-ai__backdrop,
body.desktop-mode-active:has(#desktop-mode-shell.yooadmin-desktop-dark-surface) .desktop-mode-ai__backdrop {
  background: rgba(0, 0, 0, 0.55);
}

/*
 * OS Settings — Desktop Mode hardcodes light section cards (#f6f7f7) while
 * YOOAdmin dark tokens set light foreground colours, yielding unreadable
 * grey-on-grey inside AI Settings, Appearance, Extended Options, etc.
 */
html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings {
  --desktop-mode-window-bg: var(--desktop-mode-input-bg, #22262e);
  --desktop-mode-text: var(--ysh-text, #d0d7df);
  --desktop-mode-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-border: var(--desktop-mode-input-border, rgba(255, 255, 255, 0.12));
  --wpd-segmented-bg: rgba(255, 255, 255, 0.06);
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings wpd-section,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings wpd-section,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings wpd-section {
  background: var(--ysh-card, #1a1d23);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    wpd-select,
    wpd-text-field,
    wpd-number-field,
    wpd-textarea,
    wpd-range-field,
    wpd-color-field,
    wpd-checkbox,
    wpd-checkbox-label,
    wpd-segmented
  ),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    wpd-select,
    wpd-text-field,
    wpd-number-field,
    wpd-textarea,
    wpd-range-field,
    wpd-color-field,
    wpd-checkbox,
    wpd-checkbox-label,
    wpd-segmented
  ),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings :is(
    wpd-select,
    wpd-text-field,
    wpd-number-field,
    wpd-textarea,
    wpd-range-field,
    wpd-color-field,
    wpd-checkbox,
    wpd-checkbox-label,
    wpd-segmented
  ) {
  --desktop-mode-window-bg: var(--desktop-mode-input-bg, #22262e);
  --desktop-mode-text: var(--ysh-text, #d0d7df);
  --desktop-mode-muted: var(--ysh-muted, #9eb0bd);
  --desktop-mode-border: var(--desktop-mode-input-border, rgba(255, 255, 255, 0.12));
  --wpd-segmented-bg: rgba(255, 255, 255, 0.06);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__intro,
    .desktop-mode-os-settings__uploader-heading,
    .desktop-mode-os-settings__upload-hint,
    .desktop-mode-os-settings__upload-status,
    .desktop-mode-os-settings__library-empty,
    .desktop-mode-os-settings__library-meta,
    .desktop-mode-ai-settings__saving,
    .desktop-mode-ext__hint,
    .desktop-mode-ext__saving,
    .desktop-mode-os-settings__help-count,
    .desktop-mode-os-settings__help-code,
    .desktop-mode-os-settings__help-since,
    .desktop-mode-os-settings__help-nav-tag,
    .desktop-mode-features__hint
  ),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__intro,
    .desktop-mode-os-settings__uploader-heading,
    .desktop-mode-os-settings__upload-hint,
    .desktop-mode-os-settings__upload-status,
    .desktop-mode-os-settings__library-empty,
    .desktop-mode-os-settings__library-meta,
    .desktop-mode-ai-settings__saving,
    .desktop-mode-ext__hint,
    .desktop-mode-ext__saving,
    .desktop-mode-os-settings__help-count,
    .desktop-mode-os-settings__help-code,
    .desktop-mode-os-settings__help-since,
    .desktop-mode-os-settings__help-nav-tag,
    .desktop-mode-features__hint
  ),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__intro,
    .desktop-mode-os-settings__uploader-heading,
    .desktop-mode-os-settings__upload-hint,
    .desktop-mode-os-settings__upload-status,
    .desktop-mode-os-settings__library-empty,
    .desktop-mode-os-settings__library-meta,
    .desktop-mode-ai-settings__saving,
    .desktop-mode-ext__hint,
    .desktop-mode-ext__saving,
    .desktop-mode-os-settings__help-count,
    .desktop-mode-os-settings__help-code,
    .desktop-mode-os-settings__help-since,
    .desktop-mode-os-settings__help-nav-tag,
    .desktop-mode-features__hint
  ) {
  color: var(--ysh-muted, #9eb0bd);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__editor-slot-inner,
    .desktop-mode-os-settings__help-nav,
    .desktop-mode-os-settings__help-detail
  ),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__editor-slot-inner,
    .desktop-mode-os-settings__help-nav,
    .desktop-mode-os-settings__help-detail
  ),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__editor-slot-inner,
    .desktop-mode-os-settings__help-nav,
    .desktop-mode-os-settings__help-detail
  ) {
  background: var(--ysh-card, #1a1d23);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__upload-tile:not(.desktop-mode-os-settings__upload-tile--filled),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__upload-tile:not(.desktop-mode-os-settings__upload-tile--filled),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__upload-tile:not(.desktop-mode-os-settings__upload-tile--filled) {
  background-color: var(--desktop-mode-input-bg, #22262e);
  border-color: rgba(255, 255, 255, 0.14);
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__upload-tile--dragover,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__upload-tile--dragover,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__upload-tile--dragover {
  background-color: color-mix(in srgb, var(--yooadmin-primary, #eda934) 10%, var(--desktop-mode-input-bg, #22262e));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__library-tile:not(.desktop-mode-os-settings__library-tile--skeleton),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__library-tile:not(.desktop-mode-os-settings__library-tile--skeleton),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__library-tile:not(.desktop-mode-os-settings__library-tile--skeleton) {
  background-color: var(--desktop-mode-input-bg, #22262e);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__library-tile--skeleton,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__library-tile--skeleton,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__library-tile--skeleton {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.04) 0%,
    rgba(255, 255, 255, 0.1) 50%,
    rgba(255, 255, 255, 0.04) 100%
  );
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-nav-item:hover,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-nav-item:hover,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__help-nav-item:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-nav-item.is-active,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-nav-item.is-active,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__help-nav-item.is-active {
  background: color-mix(in srgb, var(--yooadmin-primary, #eda934) 12%, var(--ysh-card, #1a1d23));
  border-color: color-mix(in srgb, var(--yooadmin-primary, #eda934) 45%, rgba(255, 255, 255, 0.12));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__help-example,
    .desktop-mode-os-settings__help-table th,
    .desktop-mode-os-settings__help-table td
  ),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__help-example,
    .desktop-mode-os-settings__help-table th,
    .desktop-mode-os-settings__help-table td
  ),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__help-example,
    .desktop-mode-os-settings__help-table th,
    .desktop-mode-os-settings__help-table td
  ) {
  background: var(--desktop-mode-input-bg, #22262e);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-table th,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-table th,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__help-table th {
  color: var(--ysh-muted, #9eb0bd);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__help-list code,
    .desktop-mode-os-settings__help-table code
  ),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__help-list code,
    .desktop-mode-os-settings__help-table code
  ),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings :is(
    .desktop-mode-os-settings__help-list code,
    .desktop-mode-os-settings__help-table code
  ) {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--ysh-border, rgba(255, 255, 255, 0.1));
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-list li,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-list li,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__help-list li {
  border-bottom-color: var(--ysh-border, rgba(255, 255, 255, 0.08));
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-badge:not(.is-experimental):not(.is-planned),
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-os-settings__help-badge:not(.is-experimental):not(.is-planned),
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-os-settings__help-badge:not(.is-experimental):not(.is-planned) {
  background: rgba(255, 255, 255, 0.08);
  color: var(--ysh-text, #d0d7df);
}

html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-features__status--saving,
html.yooadmin-studio-hub-html:is([data-yooadmin-studio-color-mode-effective="dark"], .is-dark-theme) body.desktop-mode-active .desktop-mode-os-settings .desktop-mode-features__status--saving,
#desktop-mode-shell.yooadmin-desktop-dark-surface .desktop-mode-os-settings .desktop-mode-features__status--saving {
  background: rgba(255, 255, 255, 0.06);
  color: var(--ysh-muted, #9eb0bd);
}