html.mpd-color-mode-inverted {
  color-scheme: dark;
  --mpd-color-mode-page: #171820;
  --mpd-color-mode-surface: #20222b;
  --mpd-color-mode-surface-soft: #252834;
  --mpd-color-mode-text: #f7f7fb;
  --mpd-color-mode-heading: #ffffff;
  --mpd-color-mode-muted: #d0d3dd;
  --mpd-color-mode-muted-soft: #b7bcc8;
  --mpd-color-mode-line: rgba(255, 255, 255, 0.2);
  --mpd-color-mode-line-soft: rgba(255, 255, 255, 0.14);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main {
  background: var(--mpd-color-mode-page);
  color: var(--mpd-color-mode-text);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-close,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky header.mpd-site-header:not(.mpd-menu-open),
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky-init header.mpd-site-header:not(.mpd-menu-open) {
  background: var(--mpd-color-mode-page);
  color: var(--mpd-color-mode-text);
  fill: var(--mpd-color-mode-text);
  border-bottom: 1px solid var(--mpd-color-mode-line-soft);
}

@media (min-width: 769px) {
  html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-open {
    background: var(--mpd-color-mode-page);
    color: var(--mpd-color-mode-text);
    fill: var(--mpd-color-mode-text);
  }
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-close .mpd-header-search-trigger,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky header.mpd-site-header:not(.mpd-menu-open) .mpd-header-search-trigger,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky-init header.mpd-site-header:not(.mpd-menu-open) .mpd-header-search-trigger {
  --mpd-ui-button-color: var(--mpd-color-mode-text);
  --mpd-ui-button-hover-color: var(--mpd-color-primary-light);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-close .multi-menu .top-level li,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky-init header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li {
  color: var(--mpd-color-mode-text);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-close .multi-menu .top-level li:hover,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-close .multi-menu .top-level li:focus-visible,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled header.mpd-site-header.mpd-menu-close .multi-menu .top-level li.active,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li:hover,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li:focus-visible,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li.active,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky-init header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li:hover,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky-init header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li:focus-visible,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-sticky-init header.mpd-site-header:not(.mpd-menu-open) .multi-menu .top-level li.active {
  color: var(--mpd-color-primary-light);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-service-page {
  --mpd-service-page-background: var(--mpd-color-mode-page);
  --mpd-service-text: var(--mpd-color-mode-text);
  --mpd-service-heading: var(--mpd-color-mode-heading);
  --mpd-service-subheading: var(--mpd-color-mode-text);
  --mpd-service-muted: var(--mpd-color-mode-muted);
  --mpd-service-muted-soft: var(--mpd-color-mode-muted-soft);
  --mpd-service-surface: var(--mpd-color-mode-surface);
  --mpd-service-line: var(--mpd-color-mode-line);
  --mpd-service-line-soft: var(--mpd-color-mode-line-soft);
  --mpd-service-control-surface: rgba(32, 34, 43, 0.9);
  --mpd-service-control-overlay: rgba(0, 0, 0, 0.56);
  --mpd-service-dark-overlay: rgba(0, 0, 0, 0.86);
  --mpd-service-accent-soft: rgba(255, 83, 160, 0.15);
  --mpd-service-focus-outline: 3px solid rgba(255, 83, 160, 0.28);
  --mpd-field-background: #1d1f28;
  --mpd-field-border: 1px solid rgba(255, 255, 255, 0.16);
  --mpd-field-color: var(--mpd-color-mode-text);
  --mpd-field-placeholder-color: var(--mpd-color-mode-muted-soft);
  --mpd-spec-text: var(--mpd-service-muted);
  --mpd-spec-primary-text: var(--mpd-service-subheading);
  --mpd-spec-head-text: var(--mpd-service-muted-soft);
  --mpd-spec-line: var(--mpd-service-line-soft);
  --mpd-spec-card-surface: rgba(255, 255, 255, 0.055);
  --mpd-spec-card-border: 1px solid rgba(255, 255, 255, 0.14);
  --mpd-spec-detail-chip-surface: rgba(255, 255, 255, 0.08);
  --mpd-spec-detail-chip-border: rgba(255, 255, 255, 0.16);
  --mpd-spec-color-border: rgba(255, 255, 255, 0.38);
  --mpd-heading-color: var(--mpd-service-heading);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-service-request-panel .mpd-form-control,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-request-dialog .mpd-form-control {
  --mpd-field-background: #1d1f28;
  --mpd-field-border: 1px solid rgba(255, 255, 255, 0.16);
  --mpd-field-color: var(--mpd-color-mode-text);
  --mpd-field-placeholder-color: var(--mpd-color-mode-muted-soft);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-date-popover {
  background: var(--mpd-color-mode-surface);
  border-color: rgba(255, 255, 255, 0.16);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-request-summary {
  background: var(--mpd-color-mode-surface);
  color: var(--mpd-color-mode-text);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-catalog-archive {
  --mpd-catalog-page-background: var(--mpd-color-mode-page);
  --mpd-catalog-text: var(--mpd-color-mode-text);
  --mpd-catalog-heading: var(--mpd-color-mode-heading);
  --mpd-catalog-muted: var(--mpd-color-mode-muted);
  --mpd-catalog-muted-soft: var(--mpd-color-mode-muted-soft);
  --mpd-catalog-surface: var(--mpd-color-mode-surface);
  --mpd-catalog-line: rgba(255, 255, 255, 0.18);
  --mpd-catalog-accent: var(--mpd-color-primary-light);
  --mpd-heading-color: var(--mpd-catalog-heading);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-home {
  background: var(--mpd-color-mode-page);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-home-page,
body.mpd-color-mode-current-inverted .mpd-home-page,
body.mpd-invert .mpd-home-page {
  --mpd-home-page-background: var(--mpd-color-mode-page, #171820);
  --mpd-home-text: var(--mpd-color-mode-text, #f7f7fb);
  --mpd-home-heading: var(--mpd-color-mode-heading, #ffffff);
  --mpd-home-muted: var(--mpd-color-mode-muted, #d0d3dd);
  --mpd-home-muted-soft: var(--mpd-color-mode-muted-soft, #b7bcc8);
  --mpd-home-surface: var(--mpd-color-mode-surface, #20222b);
  --mpd-home-surface-soft: var(--mpd-color-mode-surface-soft, #252834);
  --mpd-home-line: var(--mpd-color-mode-line, rgba(255, 255, 255, 0.2));
  --mpd-home-line-soft: var(--mpd-color-mode-line-soft, rgba(255, 255, 255, 0.14));
  --mpd-home-card-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
  --mpd-home-compact-shadow: 0 14px 34px rgba(0, 0, 0, 0.2);
  --mpd-home-events-background: var(--mpd-color-mode-page, #171820);
  --mpd-home-cta-background: var(--mpd-color-mode-surface, #20222b);
  --mpd-home-cta-text: var(--mpd-color-mode-heading, #ffffff);
  --mpd-home-cta-muted: var(--mpd-color-mode-muted, #d0d3dd);
  --mpd-catalog-text: var(--mpd-home-heading);
  --mpd-catalog-heading: var(--mpd-home-heading);
  --mpd-catalog-muted: var(--mpd-home-muted-soft);
  --mpd-catalog-surface: var(--mpd-home-surface);
  --mpd-catalog-line: var(--mpd-home-line);
  --mpd-heading-color: var(--mpd-home-heading);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card,
body.mpd-color-mode-current-inverted .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card,
body.mpd-invert .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card {
  background: transparent;
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card a,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card-body,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card-title,
body.mpd-color-mode-current-inverted .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card a,
body.mpd-color-mode-current-inverted .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card-body,
body.mpd-color-mode-current-inverted .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card-title,
body.mpd-invert .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card a,
body.mpd-invert .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card-body,
body.mpd-invert .mpd-home-page .mpd-collections-directory .mpd-catalog-grid .mpd-collection-card-title {
  color: var(--mpd-home-heading);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-collection-page .mpd-service-gallery {
  --mpd-service-heading: var(--mpd-catalog-heading);
  --mpd-service-surface: var(--mpd-catalog-surface);
  --mpd-service-control-surface: rgba(24, 26, 32, 0.88);
  --mpd-service-control-overlay: rgba(0, 0, 0, 0.56);
  --mpd-service-dark-overlay: rgba(0, 0, 0, 0.86);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-catalog-grid .mpd-service-card,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-catalog-grid .mpd-collection-card {
  background: rgba(255, 255, 255, 0.12);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-collection-page .mpd-catalog-slider-title,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-collection-page .mpd-catalog-grid .mpd-service-card-body,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-collection-page .mpd-catalog-grid .mpd-collection-card-body {
  color: var(--mpd-color-light-pure);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-related-services .mpd-service-card {
  background: var(--mpd-service-line);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-related-services .mpd-service-card-body {
  color: var(--mpd-color-light-pure);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-related-services .mpd-service-card-title {
  color: inherit;
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main :is(.mpd-entry-summary, .mpd-archive-description, .mpd-empty-state p, .mpd-error-page p) {
  color: var(--mpd-color-mode-muted);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main :is(.mpd-entry-content, .mpd-post-card) {
  background: var(--mpd-color-mode-surface);
  border-color: rgba(255, 255, 255, 0.16);
  color: var(--mpd-color-mode-text);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main :is(input, textarea, select, .mpd-ui-field) {
  --mpd-field-background: #1d1f28;
  --mpd-field-border: 1px solid rgba(255, 255, 255, 0.16);
  --mpd-field-color: var(--mpd-color-mode-text);
  --mpd-field-placeholder-color: var(--mpd-color-mode-muted-soft);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main .mpd-ui-button--light,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main .mpd-ui-button--white,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main .mpd-ui-button--ghost-dark,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main .mpd-ui-button--ghost-black {
  --mpd-ui-button-background: var(--mpd-color-mode-surface);
  --mpd-ui-button-border-color: rgba(255, 255, 255, 0.18);
  --mpd-ui-button-color: var(--mpd-color-mode-text);
  --mpd-ui-button-hover-background: var(--mpd-color-mode-surface-soft);
  --mpd-ui-button-hover-border-color: var(--mpd-color-primary-light);
  --mpd-ui-button-hover-color: var(--mpd-color-mode-heading);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled.single-mpd_idea,
html.mpd-color-mode-inverted body.mpd-color-mode-enabled.mpd-idea-view {
  background: var(--mpd-color-mode-page);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled .mpd-idea-page {
  --mpd-idea-page-background: var(--mpd-color-mode-page);
  --mpd-idea-text: var(--mpd-color-mode-text);
  --mpd-idea-heading: var(--mpd-color-mode-heading);
  --mpd-idea-muted: var(--mpd-color-mode-muted);
  --mpd-idea-muted-soft: var(--mpd-color-mode-muted-soft);
  --mpd-idea-surface: var(--mpd-color-mode-surface);
  --mpd-idea-surface-soft: rgba(255, 255, 255, 0.08);
  --mpd-idea-line: var(--mpd-color-mode-line);
  --mpd-idea-line-soft: var(--mpd-color-mode-line-soft);
  --mpd-idea-accent: var(--mpd-color-primary-light);
  --mpd-idea-accent-soft: rgba(255, 83, 160, 0.16);
  --mpd-idea-accent-border: rgba(255, 83, 160, 0.42);
  --mpd-idea-tray-background: rgba(32, 34, 43, 0.9);
  --mpd-idea-overlay-button-background: rgba(32, 34, 43, 0.72);
  --mpd-idea-overlay-button-hover-background: rgba(37, 40, 52, 0.88);
  --mpd-idea-overlay-button-border: rgba(255, 255, 255, 0.18);
  --mpd-idea-selected-button-background: rgba(255, 83, 160, 0.7);
  --mpd-idea-selected-button-hover-background: rgba(255, 83, 160, 0.82);
  --mpd-idea-selected-button-border: rgba(255, 83, 160, 0.48);
  --mpd-idea-selected-button-color: var(--mpd-color-light-pure);
  --mpd-field-background: #1d1f28;
  --mpd-field-border: 1px solid rgba(255, 255, 255, 0.16);
  --mpd-field-color: var(--mpd-color-mode-text);
  --mpd-field-placeholder-color: var(--mpd-color-mode-muted-soft);
  --mpd-heading-color: var(--mpd-idea-heading);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main .mpd-idea-toggle {
  --mpd-ui-button-background: var(--mpd-idea-overlay-button-background);
  --mpd-ui-button-border-color: var(--mpd-idea-overlay-button-border);
  --mpd-ui-button-color: var(--mpd-idea-accent);
  --mpd-ui-button-hover-background: var(--mpd-idea-overlay-button-hover-background);
  --mpd-ui-button-hover-border-color: var(--mpd-idea-accent-border);
  --mpd-ui-button-hover-color: var(--mpd-idea-accent);
}

html.mpd-color-mode-inverted body.mpd-color-mode-enabled main.mpd-main .mpd-idea-item.is-selected .mpd-idea-toggle {
  --mpd-ui-button-background: var(--mpd-idea-selected-button-background);
  --mpd-ui-button-border-color: var(--mpd-idea-selected-button-border);
  --mpd-ui-button-color: var(--mpd-idea-selected-button-color);
  --mpd-ui-button-hover-background: var(--mpd-idea-selected-button-hover-background);
  --mpd-ui-button-hover-border-color: var(--mpd-idea-selected-button-border);
  --mpd-ui-button-hover-color: var(--mpd-idea-selected-button-color);
}

body.mpd-color-mode-enabled .mpd-service-gallery .mpd-gallery-nav,
body.mpd-color-mode-enabled .mpd-service-gallery .mpd-gallery-nav:hover,
body.mpd-color-mode-enabled .mpd-service-gallery .mpd-gallery-nav:focus-visible {
  color: var(--mpd-color-light-pure);
}

body.mpd-color-mode-enabled .mpd-service-gallery .mpd-gallery-nav > span[aria-hidden="true"] {
  display: block;
  line-height: 1;
  transform: translateY(-0.06em);
}

.mpd-color-mode-toggle.mpd-ui-button {
  --mpd-color-mode-toggle-offset-x: max(18px, env(safe-area-inset-right));
  --mpd-color-mode-toggle-offset-y: max(18px, env(safe-area-inset-bottom));
  --mpd-color-mode-toggle-icon-edge-shift: 12px;
  --mpd-ui-button-size: 48px;
  --mpd-ui-button-height: 48px;
  --mpd-ui-button-icon-padding: 10px;
  --mpd-ui-button-background: rgba(39, 39, 47, 0.7);
  --mpd-ui-button-border-color: var(--mpd-color-primary);
  --mpd-ui-button-color: var(--mpd-color-primary);
  --mpd-ui-button-shadow: var(--mpd-shadow-md);
  --mpd-ui-button-hover-background: rgba(39, 39, 47, 0.7);
  --mpd-ui-button-hover-border-color: var(--mpd-color-primary);
  --mpd-ui-button-hover-color: var(--mpd-color-primary);
  --mpd-ui-button-hover-shadow: var(--mpd-shadow-lg);
  --mpd-ui-button-active-shadow: var(--mpd-shadow-null);
  position: fixed;
  right: var(--mpd-color-mode-toggle-offset-x);
  bottom: var(--mpd-color-mode-toggle-offset-y);
  z-index: 80;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: var(--mpd-button-transition);
  will-change: transform;
}

html.mpd-color-mode-inverted .mpd-color-mode-toggle.mpd-ui-button {
  --mpd-ui-button-background: rgba(255, 255, 255, 0.7);
  --mpd-ui-button-hover-background: rgba(255, 255, 255, 0.7);
  --mpd-ui-button-color: var(--mpd-color-primary);
  --mpd-ui-button-hover-color: var(--mpd-color-primary);
}

.mpd-color-mode-toggle.mpd-ui-button.is-user-choice {
  --mpd-ui-button-background: rgba(39, 39, 47, 0.3);
  --mpd-ui-button-hover-background: rgba(39, 39, 47, 0.3);
  --mpd-ui-button-shadow: var(--mpd-shadow-null);
}

html.mpd-color-mode-inverted .mpd-color-mode-toggle.mpd-ui-button.is-user-choice {
  --mpd-ui-button-background: rgba(255, 255, 255, 0.3);
  --mpd-ui-button-hover-background: rgba(255, 255, 255, 0.3);
}

.mpd-color-mode-toggle.mpd-ui-button.is-hidden-by-scroll:not(.is-expanded):not(:focus-visible) {
  --mpd-ui-button-background: transparent;
  --mpd-ui-button-border-color: transparent;
  --mpd-ui-button-hover-background: transparent;
  --mpd-ui-button-hover-border-color: transparent;
  --mpd-ui-button-shadow: var(--mpd-shadow-null);
  --mpd-ui-button-hover-shadow: var(--mpd-shadow-null);
  transform: translate(
    calc(var(--mpd-color-mode-toggle-offset-x) + var(--mpd-color-mode-toggle-icon-edge-shift)),
    calc(var(--mpd-color-mode-toggle-offset-y) + var(--mpd-color-mode-toggle-icon-edge-shift))
  );
}

body.mpd-idea-view.mpd-idea-has-selection:not(.mpd-request-modal-open) .mpd-color-mode-toggle.mpd-ui-button {
  bottom: calc(
    var(--mpd-idea-selection-tray-height, 0px)
    + var(--mpd-color-mode-toggle-offset-y)
    + 0.15rem
  );
  transition: bottom 0.24s ease, var(--mpd-button-transition);
}

body.mpd-idea-view.mpd-idea-has-selection:not(.mpd-request-modal-open) .mpd-color-mode-toggle.mpd-ui-button.is-hidden-by-scroll:not(.is-expanded):not(:focus-visible) {
  transform: translateX(calc(var(--mpd-color-mode-toggle-offset-x) + var(--mpd-color-mode-toggle-icon-edge-shift)));
}

.mpd-color-mode-toggle-icon {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.mpd-color-mode-toggle svg {
  display: block;
  width: 24px;
  height: 24px;
  fill: currentColor;
}

html.mpd-color-mode-inverted .mpd-color-mode-toggle-icon--moon,
html:not(.mpd-color-mode-inverted) .mpd-color-mode-toggle-icon--sun {
  display: none;
}

@media (max-width: 640px) {
  .mpd-color-mode-toggle.mpd-ui-button {
    --mpd-color-mode-toggle-offset-x: max(14px, env(safe-area-inset-right));
    --mpd-color-mode-toggle-offset-y: max(14px, env(safe-area-inset-bottom));
    --mpd-color-mode-toggle-icon-edge-shift: 10px;
    --mpd-ui-button-size: 44px;
    --mpd-ui-button-height: 44px;
    --mpd-ui-button-icon-padding: 9px;
  }
}