:root {
  color-scheme: light;
  --df-bg: #f7f7f5;
  --df-panel: #ffffff;
  --df-panel-muted: #f1f2f0;
  --df-ink: #202123;
  --df-muted: #667085;
  --df-line: #d9dcd8;
  --df-link: #173a68;
  --df-link-hover: #0f294d;
  --df-ok: #2f6547;
  --df-warn: #7b5d13;
  --df-bad: #8a2e2e;
  --df-disabled: #8a9099;
  --df-action-bg: #edf3f8;
  --df-action-hover: #dfeaf5;
  --df-action-line: #a8b9cc;
  --df-action-critical-bg: #fff6df;
  --df-action-critical-line: #b78a2e;
  --df-action-disabled-bg: #f0f1f2;
  --df-radius: 6px;
  --df-shell: 1280px;
  --df-font-xs: 12px;
  --df-font-sm: 13px;
  --df-font-base: 14px;
  --df-font-md: 16px;
  --df-font-lg: 18px;
  --df-font-xl: 20px;
}

html { font-size: var(--df-font-base) !important; }
html body {
  margin: 0;
  background: var(--df-bg) !important;
  color: var(--df-ink) !important;
  font: var(--df-font-base)/1.45 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

/* A hard typographic boundary: one UI family, 12px minimum, 20px maximum.
   Technical identifiers and source material are the only monospace exception. */
html body * {
  font-family: inherit !important;
  font-size: inherit !important;
}
html body h1 { font-size: var(--df-font-xl) !important; line-height: 1.25 !important; letter-spacing: -.015em !important; }
html body h2 { font-size: var(--df-font-lg) !important; line-height: 1.3 !important; letter-spacing: -.01em !important; }
html body h3 { font-size: var(--df-font-md) !important; line-height: 1.35 !important; letter-spacing: 0 !important; }
html body h4,
html body h5,
html body h6 { font-size: var(--df-font-base) !important; line-height: 1.4 !important; letter-spacing: 0 !important; }
html body small,
html body .eyebrow,
html body .tag,
html body .status,
html body .meta,
html body .field-id,
html body .path-number,
html body .number,
html body .chapter-nav small,
html body .toc p,
html body .toc h2,
html body dt { font-size: var(--df-font-xs) !important; }
html body .metric strong,
html body .term strong,
html body .availability strong { font-size: var(--df-font-md) !important; }
html body code,
html body pre,
html body kbd,
html body samp,
html body .field-id,
html body .number {
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace !important;
}

html body a {
  color: var(--df-link) !important;
  text-decoration: none !important;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}
html body a:hover,
html body a:focus-visible {
  color: var(--df-link-hover) !important;
  text-decoration: underline !important;
}
html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible,
html body summary:focus-visible {
  outline: 2px solid var(--df-link) !important;
  outline-offset: 2px !important;
}

html body a.surface:hover,
html body a.menu-row:hover,
html body a.path-row:hover,
html body .document-list a:hover,
html body a.course-chapter:hover,
html body a.chapter-card:hover { text-decoration: none !important; }
html body a.surface:hover strong,
html body a.menu-row:hover strong,
html body a.path-row:hover strong,
html body .document-list a:hover strong,
html body a.course-chapter:hover strong,
html body a.chapter-card:hover strong { text-decoration: underline !important; }

html body button,
html body input,
html body select,
html body textarea {
  font: inherit !important;
  border-radius: 4px !important;
}
html body button:not(:disabled),
html body input[type="button"]:not(:disabled),
html body input[type="submit"]:not(:disabled) { cursor: pointer; }
html body button:disabled,
html body [aria-disabled="true"],
html body .planned,
html body .disabled {
  color: var(--df-disabled) !important;
  cursor: not-allowed !important;
  text-decoration: none !important;
}

/* Operational controls use a filled resting state. White is reserved for
   fields and panels; availability must never be inferred from text alone. */
html body .df-action-button:not(:disabled):not([aria-disabled="true"]) {
  background: var(--df-action-bg) !important;
  border-color: var(--df-action-line) !important;
  color: var(--df-link) !important;
  opacity: 1 !important;
}
html body .df-action-button:not(:disabled):not([aria-disabled="true"]):hover {
  background: var(--df-action-hover) !important;
  border-color: var(--df-link) !important;
  color: var(--df-link-hover) !important;
}
html body .df-action-button[data-df-critical="true"]:not(:disabled):not([aria-disabled="true"]) {
  background: var(--df-action-critical-bg) !important;
  border-color: var(--df-action-critical-line) !important;
}
html body .df-action-button.primary:not(:disabled),
html body .primary.df-action-button:not(:disabled) {
  background: var(--df-link) !important;
  border-color: var(--df-link) !important;
  color: #fff !important;
}
html body .df-action-button.primary:not(:disabled):hover,
html body .primary.df-action-button:not(:disabled):hover {
  background: var(--df-link-hover) !important;
  border-color: var(--df-link-hover) !important;
  color: #fff !important;
}
html body .df-action-button:disabled,
html body .df-action-button[aria-disabled="true"] {
  background: var(--df-action-disabled-bg) !important;
  border-color: var(--df-line) !important;
  color: var(--df-disabled) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html body .screen {
  width: min(var(--df-shell), calc(100% - 32px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body .masthead,
html body .site-header,
html body .topbar,
html body .reader-header,
html body .mast {
  min-height: 48px !important;
  height: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: var(--df-panel) !important;
  border-bottom: 1px solid var(--df-line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html body .hero,
html body .home-intro,
html body .home-intro-compact,
html body .workspace-head {
  min-height: 0 !important;
  padding: 20px 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-bottom: 1px solid var(--df-line) !important;
}
html body .hero h1,
html body .home-intro h1,
html body .workspace-head h1 { max-width: none !important; margin: 0 0 6px !important; }
html body .hero p,
html body .home-intro p,
html body .lead { max-width: 900px !important; margin: 4px 0 0 !important; color: var(--df-muted) !important; }

html body .paper,
html body .panel,
html body .card,
html body .case,
html body .workflow,
html body .toc,
html body .boundary,
html body .notice,
html body .warning,
html body .metric,
html body .term,
html body .date,
html body .step {
  background: var(--df-panel) !important;
  border-color: var(--df-line) !important;
  border-radius: var(--df-radius) !important;
  box-shadow: none !important;
}

html body .document-group,
html body .menu-group {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  gap: 24px !important;
}
html body .surface,
html body .menu-row,
html body .path-row,
html body .document-list a,
html body .row,
html body .security {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  transition: background-color .12s ease !important;
}
html body .surface:hover,
html body .menu-row:not(.planned):hover,
html body .path-row:hover,
html body .document-list a:hover { background: var(--df-panel-muted) !important; }

html body .paper { padding: 24px !important; }
html body .reader-layout,
html body .layout { margin-top: 20px !important; margin-bottom: 32px !important; gap: 20px !important; }
html body .toc { padding: 14px !important; }
html body .doc h1 { margin: 0 0 18px !important; }
html body .reader-layout .doc h1,
html body.academy-home .home-intro h1,
html body .hero.compact h1 { font-size: var(--df-font-xl) !important; }
html body .doc h2,
html body .reader-layout .doc h2 { font-size: var(--df-font-lg) !important; margin: 28px 0 10px !important; padding-top: 12px !important; }
html body .doc h3,
html body .reader-layout .doc h3 { font-size: var(--df-font-md) !important; margin: 20px 0 8px !important; }
html body .doc h4,
html body .reader-layout .doc h4 { font-size: var(--df-font-base) !important; margin: 16px 0 6px !important; }
html body .doc p { margin: 0 0 12px !important; }
html body .doc blockquote { margin: 16px 0 !important; padding: 10px 14px !important; }
html body .doc table { font-size: var(--df-font-sm) !important; }
html body .doc th,
html body .doc td { padding: 8px 10px !important; }

html body .orchestrator-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 20px 0 16px;
  border-bottom: 1px solid var(--df-line);
}
html body .orchestrator-head h1 { margin: 0 0 4px; }
html body .orchestrator-head p { margin: 0; color: var(--df-muted); }
html body .orchestrator-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
  border: 1px solid var(--df-line);
  background: var(--df-panel);
}
html body .orchestrator-status div { min-width: 130px; padding: 8px 10px; border-right: 1px solid var(--df-line); }
html body .orchestrator-status div:last-child { border-right: 0; }
html body .orchestrator-status dt { color: var(--df-muted); text-transform: uppercase; letter-spacing: .04em; }
html body .orchestrator-status dd { margin: 2px 0 0; font-weight: 700; }
html body .orchestrator-status .ok { color: var(--df-ok); }
html body .orchestrator-status .warn { color: var(--df-warn); }

/* Legacy pages may carry highly specific inline rules. These are the final
   presentation constraints and deliberately outrank them. */
html body .page-sections a,
html body .reader-layout .toc a,
html body .reader-layout .toc a.l3,
html body .footnote-ref,
html body .chapter-nav small,
html body .external-mark,
html body .route .step,
html body .term span,
html body .language-picker span,
html body .language-picker a { font-size: var(--df-font-xs) !important; }

html body .masthead a,
html body .mast a,
html body .site-header a,
html body .topbar a,
html body .top a,
html body .reader-header a {
  border-bottom-color: transparent !important;
}

/* Documentation uses the full reading column; navigation begins at its rule. */
html body .reader-layout {
  grid-template-columns: minmax(0, 1fr) 280px !important;
  gap: 0 !important;
}
html body .reader-paper {
  padding-right: 24px !important;
}
html body .reader-paper .doc {
  width: 100% !important;
  max-width: none !important;
}
html body .reader-layout .course-toc {
  padding-left: 22px !important;
}
@media (max-width: 900px) {
  html body .reader-layout { grid-template-columns: 1fr !important; }
  html body .reader-paper { padding-right: 0 !important; }
  html body .reader-layout .course-toc { display: none !important; }
}

html body a.btn.dark,
html body .flow a,
html body a.action-link {
  color: #fff !important;
}

/* Global semantic location bar. Physical directories never determine the
   breadcrumb: each page declares its product surface and current context. */
html body .df-location-shell {
  width: 100%;
  min-height: 48px;
  background: #fff !important;
  border-bottom: 1px solid var(--df-line) !important;
  box-shadow: none !important;
}
html body .df-location-bar {
  width: min(var(--df-shell), calc(100% - 32px));
  min-height: 48px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
}
html body .df-location-home {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}
html body .df-location-home img { display: block; width: 28px; height: 28px; }
html body .df-location-home:hover,
html body .df-location-home:focus-visible { text-decoration: none !important; }
html body .df-breadcrumbs {
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
html body .df-breadcrumbs::-webkit-scrollbar { display: none; }
html body .df-breadcrumbs ol {
  display: flex;
  align-items: center;
  min-width: max-content;
  margin: 0;
  padding: 0;
  list-style: none;
}
html body .df-breadcrumbs li {
  display: flex;
  align-items: center;
  color: var(--df-muted);
  white-space: nowrap;
}
html body .df-breadcrumbs li + li::before {
  content: "/";
  margin: 0 8px;
  color: var(--df-disabled);
}
html body .df-breadcrumbs a,
html body .df-breadcrumbs span,
html body .df-language a,
html body .df-language span { font-size: var(--df-font-sm) !important; }
html body .df-breadcrumbs span[aria-current="page"] { color: var(--df-ink); font-weight: 650; }
html body .df-language {
  margin-left: auto;
  padding-left: 12px;
  border-left: 1px solid var(--df-line);
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
html body .df-language .active { color: var(--df-ink); font-weight: 700; }
html body .df-language .unavailable { color: var(--df-disabled); cursor: not-allowed; }

@media (max-width: 560px) {
  html body .df-location-bar { width: calc(100% - 20px); gap: 8px; }
  html body .df-location-home { width: 28px; height: 28px; flex-basis: 28px; }
  html body .df-location-home img { width: 26px; height: 26px; }
  html body .df-language { gap: 6px; padding-left: 8px; }
  html body .df-breadcrumbs li + li::before { margin: 0 6px; }
}

@media (max-width: 760px) {
  html body .orchestrator-head { grid-template-columns: 1fr; }
  html body .orchestrator-status { width: 100%; }
  html body .orchestrator-status div { flex: 1 1 50%; border-bottom: 1px solid var(--df-line); }
}

@media print {
  html body { background: #fff !important; }
  html body .site-header,
  html body .masthead,
  html body .topbar { position: static !important; }
}