:root {
  --site-bg: #ffffff;
  --site-surface: #ffffff;
  --site-soft: #f6f7f9;
  --site-text: #15171a;
  --site-muted: #68707d;
  --site-line: #e7e9ed;
  --site-link: #2563eb;
  --site-link-hover: #1d4ed8;
  --site-button: #17191d;
  --site-button-hover: #2a2d32;
}

::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-new(root) { z-index: 9999; }
::view-transition-old(root) { z-index: 1; }

html.theme-view-transitioning::view-transition-new(root) {
  animation: site-theme-reveal .7s cubic-bezier(.22,.8,.2,1) both;
}

.theme-transitioning,
.theme-transitioning *,
.theme-transitioning *::before,
.theme-transitioning *::after {
  transition: background-color .68s cubic-bezier(.22,.8,.2,1),color .5s ease,border-color .5s ease,box-shadow .5s ease,fill .5s ease,stroke .5s ease !important;
}

html.site-ready body:not(.legacy-home) {
  animation: site-page-enter .62s cubic-bezier(.22,.8,.2,1) both;
}

[data-theme-button] {
  position: relative;
  overflow: hidden;
  transition: transform .22s ease,border-color .22s ease,background-color .22s ease,box-shadow .22s ease;
}

[data-theme-button]:hover { transform: translateY(-1px); }
[data-theme-button] svg { width: 17px; height: 17px; transition: transform .3s ease; }
[data-theme-button]:hover svg { transform: rotate(14deg); }
[data-theme-button].is-switching { animation: site-theme-button .7s cubic-bezier(.22,.8,.2,1); }
[data-theme-button].is-switching svg,
[data-theme-button].is-switching .theme-icon { animation: site-theme-icon .7s cubic-bezier(.2,.85,.2,1); }

.guide-header [data-theme-button] svg {
  position: static;
  width: 18px;
  height: 18px;
  opacity: 1;
  transform: none;
}

:where(a,button,.site-button,.extension-center-item,.related-docs a) {
  transition-property: color,background-color,border-color,box-shadow,opacity,transform;
  transition-duration: .22s;
  transition-timing-function: ease;
}

@keyframes site-theme-reveal {
  from { clip-path: circle(0 at var(--theme-transition-x) var(--theme-transition-y)); }
  to { clip-path: circle(var(--theme-transition-radius) at var(--theme-transition-x) var(--theme-transition-y)); }
}

@keyframes site-theme-icon {
  0% { opacity: 0; transform: rotate(-170deg) scale(.18); }
  58% { opacity: 1; transform: rotate(18deg) scale(1.22); }
  100% { opacity: 1; transform: rotate(0) scale(1); }
}

@keyframes site-theme-button {
  0%,100% { box-shadow: 0 0 0 0 rgb(23 25 29 / 0%); }
  45% { box-shadow: 0 0 0 9px rgb(23 25 29 / 12%); }
}

@keyframes site-page-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html.site-ready body:not(.legacy-home),
  html.theme-view-transitioning::view-transition-new(root),
  [data-theme-button].is-switching,
  [data-theme-button].is-switching svg,
  [data-theme-button].is-switching .theme-icon { animation-duration: .01ms !important; }
  .theme-transitioning,.theme-transitioning * { transition: none !important; }
}

html:not(.dark):not([data-theme="dark"]) {
  --bg: var(--site-bg);
  --page: var(--site-bg);
  --surface: var(--site-surface);
  --surface-strong: var(--site-soft);
  --surface-soft: var(--site-soft);
  --text: var(--site-text);
  --ink: var(--site-text);
  --muted: var(--site-muted);
  --line: var(--site-line);
  --accent: var(--site-link);
  --accent-strong: var(--site-link-hover);
  --accent-soft: #edf4ff;
  --docs-ink: var(--site-text);
  --docs-body: #343a43;
  --docs-muted: var(--site-muted);
  --docs-line: var(--site-line);
  --docs-blue: var(--site-link);
  --docs-blue-soft: #edf4ff;
  --docs-surface: var(--site-surface);
  --docs-sidebar: var(--site-soft);
}

html:not(.dark):not([data-theme="dark"]),
html:not(.dark):not([data-theme="dark"]) body,
html:not(.dark):not([data-theme="dark"]) .extensions-page {
  background: var(--site-bg) !important;
}

html:not(.dark):not([data-theme="dark"]) body::before {
  display: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.site-header,.docs-header) {
  border-color: var(--site-line) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.docs-sidebar,.mobile-search,.extension-detail-footer) {
  background: var(--site-soft) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.article-toc,.extensions-sidebar,.extensions-overview,.extension-results,.docs-share-dialog,.doc-image-dialog,.runtime-popup-panel,.download-dialog-panel) {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.docs-article,.search-results,.related-docs a,.extension-center-item,.extension-detail-dialog,.access-shell,.access-form-panel,.metric,.devices-panel,.details-panel,.device-item,.query-loading,.unbind-dialog) {
  border-color: var(--site-line) !important;
  background: var(--site-surface) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.docs-search,input,textarea,select,.license-slider,.header-button,.theme-toggle,.secondary-button) {
  border-color: var(--site-line) !important;
  background: var(--site-soft) !important;
  box-shadow: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.home-link,.icon-button,.article-action,.dialog-button,.extension-detail-footer button,.license-paste) {
  border-color: var(--site-line) !important;
  color: var(--site-text) !important;
  background: var(--site-surface) !important;
  box-shadow: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.home-link,.icon-button,.article-action,.dialog-button,.extension-detail-footer button,.license-paste):hover {
  border-color: #c7ccd4 !important;
  color: var(--site-text) !important;
  background: var(--site-soft) !important;
}

:where(.site-button.primary,.download-trigger,.dialog-button.primary,.doc-system-share,.runtime-popup-button.primary) {
  border-color: var(--site-button) !important;
  color: #ffffff !important;
  background: var(--site-button) !important;
  box-shadow: 0 10px 24px rgb(23 25 29 / 18%) !important;
}

/* Use graphite for ordinary front-site commands while preserving an explicit inline color. */
.site-button {
  border-color: var(--site-button);
  color: #ffffff;
  background: var(--site-button);
}

.site-button:hover {
  border-color: var(--site-button-hover);
  color: #ffffff;
  background: var(--site-button-hover);
}

:where(.site-button.primary,.download-trigger,.dialog-button.primary,.doc-system-share,.runtime-popup-button.primary):hover {
  border-color: var(--site-button-hover) !important;
  color: #ffffff !important;
  background: var(--site-button-hover) !important;
}

.slider-thumb {
  color: #ffffff !important;
  background: var(--site-button) !important;
  box-shadow: 0 8px 20px rgb(23 25 29 / 18%) !important;
}

.license-slider.is-preparing .slider-thumb {
  background: var(--site-button-hover) !important;
}

.license-slider.is-success .slider-thumb {
  background: var(--success) !important;
}

html:not(.dark):not([data-theme="dark"]) .access-brand-panel,
html:not(.dark):not([data-theme="dark"]) .license-overview {
  border: 1px solid var(--site-line) !important;
  color: var(--site-text) !important;
  background: var(--site-soft) !important;
  box-shadow: none !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.access-brand-panel,.license-overview)::before,
html:not(.dark):not([data-theme="dark"]) :where(.access-brand-panel,.license-overview)::after {
  border-color: #dfe3e8 !important;
}

html:not(.dark):not([data-theme="dark"]) .access-logo {
  filter: drop-shadow(0 12px 20px rgb(23 25 29 / 10%));
}

html:not(.dark):not([data-theme="dark"]) :where(.access-eyebrow,.access-brand-panel > p,.overview-copy > p,.license-code) {
  color: var(--site-muted) !important;
}

html:not(.dark):not([data-theme="dark"]) .access-capabilities span {
  border-color: var(--site-line) !important;
  color: #424851 !important;
}

html:not(.dark):not([data-theme="dark"]) .access-capabilities span:hover {
  color: var(--site-text) !important;
}

html:not(.dark):not([data-theme="dark"]) .status-badge {
  border-color: var(--site-line) !important;
}

html:not(.dark):not([data-theme="dark"]) .status-badge.is-active {
  color: var(--success) !important;
  background: var(--success-soft) !important;
}

html:not(.dark):not([data-theme="dark"]) .status-badge.is-inactive {
  color: var(--danger) !important;
  background: var(--danger-soft) !important;
}

html:not(.dark):not([data-theme="dark"]) :where(.extension-center-cover,.extension-detail-cover) {
  background: var(--site-soft) !important;
}

html.dark,
html[data-theme="dark"] {
  --site-button: #f5f6f8;
  --site-button-hover: #ffffff;
}

html.dark :where(.site-button.primary,.download-trigger,.dialog-button.primary,.doc-system-share,.runtime-popup-button.primary),
html[data-theme="dark"] :where(.site-button.primary,.download-trigger,.dialog-button.primary,.doc-system-share,.runtime-popup-button.primary) {
  color: #15171a !important;
  background: var(--site-button) !important;
  border-color: var(--site-button) !important;
}

html.dark :where(.site-button.primary,.download-trigger,.dialog-button.primary,.doc-system-share,.runtime-popup-button.primary):hover,
html[data-theme="dark"] :where(.site-button.primary,.download-trigger,.dialog-button.primary,.doc-system-share,.runtime-popup-button.primary):hover {
  color: #15171a !important;
  background: var(--site-button-hover) !important;
  border-color: var(--site-button-hover) !important;
}

html[data-theme="dark"] .slider-thumb {
  color: #15171a !important;
  background: #f5f6f8 !important;
}