/*
  AzureGlossary premium visual layer.

  Stable semantic hooks only. Browser behaviour must never depend on a release,
  build, branch, sprint, or iteration label. This file is presentation only.

  Design contract:
  - one 80rem (1280px) outer measure across every present and future route;
  - responsive gutters rather than 100vw calculations;
  - jewel-toned colour used as light, depth, and wayfinding—not visual noise;
  - no learner-facing content hidden as a shortcut;
  - accessible focus, motion, contrast, and forced-colour behaviour.
*/

:root {
  --ag-page-width: 80rem;
  --ag-reading-width: 68rem;
  --ag-page-gutter: clamp(1rem, 3vw, 3rem);
  --ag-page-gap: clamp(.9rem, 1.8vw, 1.35rem);
  --ag-section-gap: clamp(1.1rem, 2.4vw, 1.8rem);

  /* Shared luxury-surface geometry. Keep radii restrained and padding generous. */
  --ag-radius-panel: 1.45rem;
  --ag-radius-card: 1.15rem;
  --ag-radius-inset: .9rem;
  --ag-surface-pad: clamp(1rem, 2vw, 1.45rem);
  --ag-surface-pad-lg: clamp(1.35rem, 3vw, 2.25rem);
  --ag-surface-pad-xl: clamp(1.55rem, 3.5vw, 2.75rem);

  --ag-sapphire: #3db8ff;
  --ag-sapphire-deep: #187ed9;
  --ag-aqua: #5ee7ff;
  --ag-teal: #36e1bf;
  --ag-violet: #9277ff;
  --ag-orchid: #d477ff;
  --ag-magenta: #d86cff;
  --ag-coral: #ff8496;

  --ag-page-accent-rgb: 61 184 255;
  --ag-page-accent-2-rgb: 146 119 255;
  --ag-page-accent-3-rgb: 54 225 191;
  --ag-card-accent-rgb: var(--ag-page-accent-rgb);

  /* Dark, saturated action stops retain AA contrast with white text. */
  --ag-action-1: #0f6dc7;
  --ag-action-2: #6247c7;
  --ag-action-3: #087a87;

  --ag-premium-line: rgb(var(--ag-page-accent-rgb) / .3);
  --ag-premium-line-strong: rgb(var(--ag-page-accent-rgb) / .56);
  --ag-premium-glow:
    0 34px 96px rgb(0 0 0 / .36),
    0 0 76px rgb(var(--ag-page-accent-rgb) / .1),
    inset 0 1px 0 rgb(255 255 255 / .08);
}

/* Page families get their own jewel palette and accessible action gradient. */
body.ag-app-shell:is(
  .azure-home-page,
  .exams-catalog-page,
  .exam-track-page,
  .diagnostic-entry-page,
  .diagnostic-session-page,
  .diagnostic-results-page
) {
  --ag-page-accent-rgb: 61 184 255;
  --ag-page-accent-2-rgb: 112 103 255;
  --ag-page-accent-3-rgb: 94 231 255;
  --ag-action-1: #0f6dc7;
  --ag-action-2: #6247c7;
  --ag-action-3: #087a87;
}

body.ag-app-shell:is(
  .azure-reference-hub-page,
  .azure-term-page,
  .azure-glossary-term-page,
  .deep-reference-page
) {
  --ag-page-accent-rgb: 54 225 191;
  --ag-page-accent-2-rgb: 61 184 255;
  --ag-page-accent-3-rgb: 146 119 255;
  --ag-action-1: #08786b;
  --ag-action-2: #0f6dc7;
  --ag-action-3: #5e45be;
}

body.ag-app-shell:is(
  .azure-command-center-page,
  .azure-ops-page,
  .azure-runbooks-page
) {
  --ag-page-accent-rgb: 216 92 255;
  --ag-page-accent-2-rgb: 61 184 255;
  --ag-page-accent-3-rgb: 54 225 191;
  --ag-action-1: #7e22ce;
  --ag-action-2: #0f65b3;
  --ag-action-3: #087468;
}

body.ag-app-shell:is(
  .azure-compare-page,
  .azure-resource-graph-page,
  .azure-graph-page,
  .universal-search-page
) {
  --ag-page-accent-rgb: 146 119 255;
  --ag-page-accent-2-rgb: 212 119 255;
  --ag-page-accent-3-rgb: 61 184 255;
  --ag-action-1: #6547bd;
  --ag-action-2: #8a3fa8;
  --ag-action-3: #0f66b1;
}

body.ag-app-shell:is(
  .learner-workspace-page,
  .azure-learn-page,
  .azure-case-study-page,
  .azure-retake-runbook-page,
  .azure-labs-page
) {
  --ag-page-accent-rgb: 61 184 255;
  --ag-page-accent-2-rgb: 54 225 191;
  --ag-page-accent-3-rgb: 146 119 255;
  --ag-action-1: #0d69bf;
  --ag-action-2: #08786d;
  --ag-action-3: #6047c0;
}

body.ag-app-shell:is(
  .azure-learner-account-page,
  .pricing-page,
  .teams-page,
  .azure-services-page,
  .azure-team-dashboard-shell-page,
  .account-secondary-page,
  .legal-page-shell
) {
  --ag-page-accent-rgb: 216 92 255;
  --ag-page-accent-2-rgb: 146 119 255;
  --ag-page-accent-3-rgb: 255 132 150;
  --ag-action-1: #7e22ce;
  --ag-action-2: #6047c0;
  --ag-action-3: #a13e59;
}

/* --------------------------------------------------------------------------
   One page geometry
   -------------------------------------------------------------------------- */

body.ag-app-shell :where(
  .site-header-inner,
  .site-context-bar-inner,
  .site-main,
  .site-footer-inner
) {
  width: min(
    var(--ag-page-width),
    calc(100% - (var(--ag-page-gutter) * 2))
  ) !important;
  max-width: var(--ag-page-width) !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}

body.ag-app-shell .site-main {
  position: relative;
  min-width: 0;
  padding-block: clamp(.9rem, 2vw, 1.65rem) clamp(3.5rem, 7vw, 6rem);
}

/* Any current or future route root gets the same outer measure automatically. */
body.ag-app-shell .site-main > :where(section, article, div, form) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin-inline: auto !important;
  box-sizing: border-box;
}

/* Neutralise legacy workbench widths without narrowing useful inner reading columns. */
body.ag-app-shell .site-main :where(
  .site-width,
  .azure-glossary-layout,
  .azure-search-first-layout,
  .azure-practice-frame,
  .azure-learn-frame,
  .azure-compare-page-frame,
  .azure-compare-decision-surface,
  .azure-resource-graph-frame,
  .azure-runbooks-library-intro,
  .learner-workspace-route-inner,
  .reference-hub-v2,
  .reference-diagnostic-bridge,
  .study-plan-hub-v2,
  .universal-search-shell,
  .operational-reference-shell,
  .azure-ops-shell,
  .azure-runbooks-shell,
  .azure-command-center-shell,
  .azure-command-center-layout,
  .azure-resource-graph-shell,
  .azure-compare-shell,
  .azure-glossary-term-detail-shell,
  .learner-account-shell,
  .intent-hub,
  .legal-page
) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin-inline: auto !important;
  box-sizing: border-box;
}

body.ag-app-shell :where(.site-main *, .site-header-inner *, .site-footer-inner *) {
  min-width: 0;
}

body.ag-app-shell {
  overflow-x: clip;
  background:
    radial-gradient(circle at 4% -8%, rgb(var(--ag-page-accent-rgb) / .3), transparent 31rem),
    radial-gradient(circle at 96% 0%, rgb(var(--ag-page-accent-2-rgb) / .24), transparent 36rem),
    radial-gradient(circle at 52% 43%, rgb(var(--ag-page-accent-3-rgb) / .085), transparent 43rem),
    radial-gradient(circle at 80% 84%, rgb(212 119 255 / .075), transparent 38rem),
    linear-gradient(180deg, #020713 0%, #071426 46%, #030916 100%);
}

body.ag-app-shell ::selection {
  background: rgb(var(--ag-page-accent-rgb) / .38);
  color: #fff;
}

/* --------------------------------------------------------------------------
   Header, navigation, and context
   -------------------------------------------------------------------------- */

.site-header.ag-site-header {
  border-bottom-color: rgb(var(--ag-page-accent-rgb) / .2);
  background:
    radial-gradient(circle at 13% -160%, rgb(var(--ag-page-accent-rgb) / .28), transparent 29rem),
    radial-gradient(circle at 87% -180%, rgb(var(--ag-page-accent-2-rgb) / .23), transparent 31rem),
    linear-gradient(180deg, rgb(3 10 23 / .98), rgb(4 13 28 / .94));
}

.site-header.ag-site-header::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    rgb(var(--ag-page-accent-rgb) / .72) 18%,
    rgb(var(--ag-page-accent-2-rgb) / .66) 52%,
    rgb(var(--ag-page-accent-3-rgb) / .58) 82%,
    transparent
  );
}

.site-brand-mark {
  background:
    radial-gradient(circle at 28% 18%, rgb(255 255 255 / .18), transparent 36%),
    linear-gradient(145deg, rgb(var(--ag-page-accent-rgb) / .29), rgb(var(--ag-page-accent-2-rgb) / .22));
  box-shadow:
    0 0 0 1px rgb(var(--ag-page-accent-rgb) / .42),
    0 14px 38px rgb(var(--ag-page-accent-rgb) / .24),
    0 0 30px rgb(var(--ag-page-accent-2-rgb) / .16);
}

.site-nav .site-nav-link[aria-current="page"] {
  border-color: rgb(var(--ag-page-accent-rgb) / .52);
  background:
    linear-gradient(135deg, rgb(var(--ag-page-accent-rgb) / .24), rgb(var(--ag-page-accent-2-rgb) / .22));
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .1),
    0 10px 28px rgb(var(--ag-page-accent-rgb) / .11);
}

.site-header-cta {
  border-color: rgb(210 236 255 / .58);
  background: linear-gradient(135deg, var(--ag-action-1), var(--ag-action-2) 62%, var(--ag-action-3));
  color: #fff;
  text-shadow: 0 1px 1px rgb(0 0 0 / .24);
  box-shadow:
    0 15px 38px rgb(var(--ag-page-accent-rgb) / .24),
    0 0 30px rgb(var(--ag-page-accent-2-rgb) / .15),
    inset 0 1px 0 rgb(255 255 255 / .24);
}

.site-context-bar {
  border-bottom-color: rgb(var(--ag-page-accent-rgb) / .17);
  background:
    linear-gradient(90deg, rgb(var(--ag-page-accent-rgb) / .075), transparent 31%, rgb(var(--ag-page-accent-2-rgb) / .065)),
    rgb(5 15 29 / .84);
}

.site-context-bar p strong {
  color: rgb(var(--ag-page-accent-3-rgb));
  text-shadow: 0 0 20px rgb(var(--ag-page-accent-3-rgb) / .24);
}

/* --------------------------------------------------------------------------
   Premium hero language
   -------------------------------------------------------------------------- */

body.ag-app-shell :where(
  .ux-compact-hero,
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .exam-track-hero,
  .diagnostic-entry-hero,
  .diagnostic-results-route-header,
  .learner-workspace-route-head,
  .azure-learn-hero,
  .azure-practice-hero,
  .azure-case-study-hero,
  .azure-retake-runbook-hero,
  .reference-hub-hero,
  .azure-glossary-subpage-hero,
  .azure-glossary-term-hero-panel,
  .azure-glossary-deep-term-header,
  .operational-reference-header,
  .operational-resource-graph-header,
  .operational-runbook-header,
  .azure-services-hero,
  .account-hero,
  .learner-account-hero,
  .intent-hub-hero,
  .labs-guide-hero,
  .search-workspace-header,
  .azure-team-dashboard-hero-shell,
  .legal-page-head
) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
  padding: var(--ag-surface-pad-xl);
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .38);
  border-radius: clamp(1.35rem, 2.6vw, 2rem);
  background:
    radial-gradient(circle at 7% -15%, rgb(var(--ag-page-accent-rgb) / .39), transparent 30rem),
    radial-gradient(circle at 93% -9%, rgb(var(--ag-page-accent-2-rgb) / .31), transparent 31rem),
    radial-gradient(circle at 62% 112%, rgb(var(--ag-page-accent-3-rgb) / .15), transparent 24rem),
    linear-gradient(138deg, rgb(13 31 56 / .98), rgb(4 13 28 / .985));
  box-shadow: var(--ag-premium-glow);
}

body.ag-app-shell :where(
  .ux-compact-hero,
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .exam-track-hero,
  .diagnostic-entry-hero,
  .diagnostic-results-route-header,
  .learner-workspace-route-head,
  .azure-learn-hero,
  .azure-practice-hero,
  .azure-case-study-hero,
  .azure-retake-runbook-hero,
  .reference-hub-hero,
  .azure-glossary-subpage-hero,
  .azure-glossary-term-hero-panel,
  .azure-glossary-deep-term-header,
  .operational-reference-header,
  .operational-resource-graph-header,
  .operational-runbook-header,
  .azure-services-hero,
  .account-hero,
  .learner-account-hero,
  .intent-hub-hero,
  .labs-guide-hero,
  .search-workspace-header,
  .azure-team-dashboard-hero-shell,
  .legal-page-head
)::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(
    90deg,
    rgb(var(--ag-page-accent-rgb) / .95),
    rgb(var(--ag-page-accent-2-rgb) / .92) 56%,
    rgb(var(--ag-page-accent-3-rgb) / .9)
  );
  box-shadow: 0 0 28px rgb(var(--ag-page-accent-rgb) / .34);
}

body.ag-app-shell :where(
  .ux-compact-hero,
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .exam-track-hero,
  .diagnostic-entry-hero,
  .diagnostic-results-route-header,
  .learner-workspace-route-head,
  .azure-learn-hero,
  .azure-practice-hero,
  .azure-case-study-hero,
  .azure-retake-runbook-hero,
  .reference-hub-hero,
  .azure-glossary-subpage-hero,
  .operational-reference-header,
  .azure-services-hero,
  .account-hero,
  .learner-account-hero,
  .intent-hub-hero,
  .labs-guide-hero,
  .search-workspace-header
) > p,
body.ag-app-shell :where(
  .ux-compact-hero,
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .exam-track-hero,
  .diagnostic-entry-hero,
  .diagnostic-results-route-header,
  .learner-workspace-route-head,
  .azure-learn-hero,
  .azure-practice-hero,
  .azure-case-study-hero,
  .azure-retake-runbook-hero,
  .reference-hub-hero,
  .azure-glossary-subpage-hero,
  .operational-reference-header,
  .azure-services-hero,
  .account-hero,
  .learner-account-hero,
  .intent-hub-hero,
  .labs-guide-hero,
  .search-workspace-header
) > :where(p, div) p {
  max-width: 72ch;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  body.ag-app-shell :where(
    .ux-compact-hero,
    .azure-search-landing-hero,
    .exam-catalog-hero,
    .exam-track-hero,
    .diagnostic-entry-hero,
    .diagnostic-results-route-header,
    .learner-workspace-route-head,
    .azure-learn-hero,
    .azure-practice-hero,
    .azure-case-study-hero,
    .azure-retake-runbook-hero,
    .reference-hub-hero,
    .azure-glossary-subpage-hero,
    .operational-reference-header,
    .azure-services-hero,
    .account-hero,
    .learner-account-hero,
    .intent-hub-hero,
    .labs-guide-hero,
    .search-workspace-header
  ) h1 {
    background: linear-gradient(105deg, #fff 0%, #eff9ff 48%, rgb(var(--ag-page-accent-3-rgb)) 128%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
}

body.ag-app-shell :where(.eyebrow, [class$="-kicker"], [class*="-kicker "]) {
  color: rgb(var(--ag-page-accent-3-rgb));
  text-shadow: 0 0 24px rgb(var(--ag-page-accent-3-rgb) / .22);
}

/* Colourful but restrained section dividers. */
body.ag-app-shell .site-main :where(
  .exam-catalog-group > h2,
  .exam-track-section > h2,
  .learner-workspace-section > h2,
  .azure-glossary-panel-head > h2,
  .azure-glossary-term-section > h2,
  .reference-hub-v2 h2,
  .azure-learn-frame > section > h2,
  .operational-reference-shell > section > h2,
  .legal-page > h2
) {
  position: relative;
  padding-bottom: .55rem;
}

body.ag-app-shell .site-main :where(
  .exam-catalog-group > h2,
  .exam-track-section > h2,
  .learner-workspace-section > h2,
  .azure-glossary-panel-head > h2,
  .azure-glossary-term-section > h2,
  .reference-hub-v2 h2,
  .azure-learn-frame > section > h2,
  .operational-reference-shell > section > h2,
  .legal-page > h2
)::after {
  content: "";
  display: block;
  width: clamp(3.25rem, 8vw, 6rem);
  height: 2px;
  margin-top: .55rem;
  border-radius: 999px;
  background: linear-gradient(90deg, rgb(var(--ag-page-accent-rgb)), rgb(var(--ag-page-accent-2-rgb)), rgb(var(--ag-page-accent-3-rgb)));
  box-shadow: 0 0 18px rgb(var(--ag-page-accent-rgb) / .24);
}

/* --------------------------------------------------------------------------
   Diagnostic workspace
   -------------------------------------------------------------------------- */

.diagnostic-session {
  border-color: rgb(var(--ag-page-accent-rgb) / .36);
  background:
    radial-gradient(circle at 7% -12%, rgb(var(--ag-page-accent-rgb) / .34), transparent 31rem),
    radial-gradient(circle at 94% -4%, rgb(var(--ag-page-accent-2-rgb) / .31), transparent 31rem),
    radial-gradient(circle at 52% 112%, rgb(var(--ag-page-accent-3-rgb) / .12), transparent 27rem),
    linear-gradient(145deg, rgb(7 20 39 / .985), rgb(2 9 21 / .995));
  box-shadow: var(--ag-premium-glow);
}

.diagnostic-workspace-stage,
.diagnostic-workspace-sidecar {
  border-color: rgb(var(--ag-page-accent-rgb) / .28);
  background-image:
    radial-gradient(circle at 0 0, rgb(var(--ag-page-accent-rgb) / .09), transparent 18rem),
    radial-gradient(circle at 100% 0, rgb(var(--ag-page-accent-2-rgb) / .07), transparent 18rem);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .065),
    0 22px 58px rgb(0 0 0 / .2);
}

.diagnostic-workspace-secure,
.diagnostic-workspace-badge {
  border-color: rgb(var(--ag-page-accent-3-rgb) / .44);
  background: linear-gradient(135deg, rgb(var(--ag-page-accent-rgb) / .24), rgb(var(--ag-page-accent-2-rgb) / .2));
  color: #efffff;
}

.diagnostic-session-choices > :nth-child(4n + 1) { --ag-choice-rgb: 61 184 255; }
.diagnostic-session-choices > :nth-child(4n + 2) { --ag-choice-rgb: 146 119 255; }
.diagnostic-session-choices > :nth-child(4n + 3) { --ag-choice-rgb: 54 225 191; }
.diagnostic-session-choices > :nth-child(4n) { --ag-choice-rgb: 216 92 255; }

.diagnostic-session-question :where(.diagnostic-session-choices button, [data-assessment-format] button, [data-assessment-format] label) {
  border-color: rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .25);
  background-image:
    radial-gradient(circle at 0 50%, rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .105), transparent 12rem),
    linear-gradient(135deg, rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .035), transparent 52%);
}

.diagnostic-session-question :where(.diagnostic-session-choices button, [data-assessment-format] button, [data-assessment-format] label):hover {
  border-color: rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .55);
  box-shadow: 0 14px 34px rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .09);
}

.diagnostic-session-question :where(.diagnostic-session-choices button, [data-assessment-format] button) > span:first-child,
.diagnostic-session-question [data-assessment-format] label > span:first-child {
  border-color: rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .45);
  background: rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .18);
  color: #f8fdff;
  box-shadow: 0 0 22px rgb(var(--ag-choice-rgb, var(--ag-page-accent-rgb)) / .1);
}

.diagnostic-session-actions > :last-child,
.diagnostic-session-actions [data-diagnostic-next] {
  border-color: rgb(218 238 255 / .52);
  background: linear-gradient(135deg, var(--ag-action-1), var(--ag-action-2) 62%, var(--ag-action-3));
  color: #fff;
  text-shadow: 0 1px 1px rgb(0 0 0 / .24);
  box-shadow: 0 13px 32px rgb(var(--ag-page-accent-rgb) / .2), inset 0 1px 0 rgb(255 255 255 / .2);
}

/* --------------------------------------------------------------------------
   Cards and premium surfaces
   -------------------------------------------------------------------------- */

body.ag-app-shell .site-main :where(
  .exam-catalog-grid,
  .exam-track-next-grid,
  .exam-track-coverage-grid,
  .intent-grid,
  .reference-shortcut-grid,
  .reference-route-grid,
  .study-plan-route-grid,
  .azure-home-exam-compact-grid,
  .azure-home-reference-link-row,
  .azure-learn-outcome-grid,
  .azure-learn-map-grid,
  .azure-learn-path-grid,
  .azure-learn-fast-lanes,
  .azure-learn-workspace-grid,
  .azure-resource-graph-card-grid,
  .azure-resource-graph-area-grid,
  .azure-glossary-grid,
  .azure-glossary-core-grid,
  .azure-glossary-source-grid,
  .azure-glossary-command-grid,
  .azure-glossary-command-flow-grid,
  .azure-glossary-chain-grid,
  .azure-glossary-relationship-type-grid,
  .azure-glossary-surf-route-grid,
  .azure-glossary-signal-card-grid,
  .azure-glossary-use-case-card-grid,
  .azure-services-grid,
  .pricing-tier-grid,
  .account-explain-grid,
  .retake-runbook-static-grid
) > :nth-child(6n + 1) { --ag-card-accent-rgb: 61 184 255; }

body.ag-app-shell .site-main :where(
  .exam-catalog-grid,
  .exam-track-next-grid,
  .exam-track-coverage-grid,
  .intent-grid,
  .reference-shortcut-grid,
  .reference-route-grid,
  .study-plan-route-grid,
  .azure-home-exam-compact-grid,
  .azure-home-reference-link-row,
  .azure-learn-outcome-grid,
  .azure-learn-map-grid,
  .azure-learn-path-grid,
  .azure-learn-fast-lanes,
  .azure-learn-workspace-grid,
  .azure-resource-graph-card-grid,
  .azure-resource-graph-area-grid,
  .azure-glossary-grid,
  .azure-glossary-core-grid,
  .azure-glossary-source-grid,
  .azure-glossary-command-grid,
  .azure-glossary-command-flow-grid,
  .azure-glossary-chain-grid,
  .azure-glossary-relationship-type-grid,
  .azure-glossary-surf-route-grid,
  .azure-glossary-signal-card-grid,
  .azure-glossary-use-case-card-grid,
  .azure-services-grid,
  .pricing-tier-grid,
  .account-explain-grid,
  .retake-runbook-static-grid
) > :nth-child(6n + 2) { --ag-card-accent-rgb: 146 119 255; }

body.ag-app-shell .site-main :where(
  .exam-catalog-grid,
  .exam-track-next-grid,
  .exam-track-coverage-grid,
  .intent-grid,
  .reference-shortcut-grid,
  .reference-route-grid,
  .study-plan-route-grid,
  .azure-home-exam-compact-grid,
  .azure-home-reference-link-row,
  .azure-learn-outcome-grid,
  .azure-learn-map-grid,
  .azure-learn-path-grid,
  .azure-learn-fast-lanes,
  .azure-learn-workspace-grid,
  .azure-resource-graph-card-grid,
  .azure-resource-graph-area-grid,
  .azure-glossary-grid,
  .azure-glossary-core-grid,
  .azure-glossary-source-grid,
  .azure-glossary-command-grid,
  .azure-glossary-command-flow-grid,
  .azure-glossary-chain-grid,
  .azure-glossary-relationship-type-grid,
  .azure-glossary-surf-route-grid,
  .azure-glossary-signal-card-grid,
  .azure-glossary-use-case-card-grid,
  .azure-services-grid,
  .pricing-tier-grid,
  .account-explain-grid,
  .retake-runbook-static-grid
) > :nth-child(6n + 3) { --ag-card-accent-rgb: 54 225 191; }

body.ag-app-shell .site-main :where(
  .exam-catalog-grid,
  .exam-track-next-grid,
  .exam-track-coverage-grid,
  .intent-grid,
  .reference-shortcut-grid,
  .reference-route-grid,
  .study-plan-route-grid,
  .azure-home-exam-compact-grid,
  .azure-home-reference-link-row,
  .azure-learn-outcome-grid,
  .azure-learn-map-grid,
  .azure-learn-path-grid,
  .azure-learn-fast-lanes,
  .azure-learn-workspace-grid,
  .azure-resource-graph-card-grid,
  .azure-resource-graph-area-grid,
  .azure-glossary-grid,
  .azure-glossary-core-grid,
  .azure-glossary-source-grid,
  .azure-glossary-command-grid,
  .azure-glossary-command-flow-grid,
  .azure-glossary-chain-grid,
  .azure-glossary-relationship-type-grid,
  .azure-glossary-surf-route-grid,
  .azure-glossary-signal-card-grid,
  .azure-glossary-use-case-card-grid,
  .azure-services-grid,
  .pricing-tier-grid,
  .account-explain-grid,
  .retake-runbook-static-grid
) > :nth-child(6n + 4) { --ag-card-accent-rgb: 216 92 255; }

body.ag-app-shell .site-main :where(
  .exam-catalog-grid,
  .exam-track-next-grid,
  .exam-track-coverage-grid,
  .intent-grid,
  .reference-shortcut-grid,
  .reference-route-grid,
  .study-plan-route-grid,
  .azure-home-exam-compact-grid,
  .azure-home-reference-link-row,
  .azure-learn-outcome-grid,
  .azure-learn-map-grid,
  .azure-learn-path-grid,
  .azure-learn-fast-lanes,
  .azure-learn-workspace-grid,
  .azure-resource-graph-card-grid,
  .azure-resource-graph-area-grid,
  .azure-glossary-grid,
  .azure-glossary-core-grid,
  .azure-glossary-source-grid,
  .azure-glossary-command-grid,
  .azure-glossary-command-flow-grid,
  .azure-glossary-chain-grid,
  .azure-glossary-relationship-type-grid,
  .azure-glossary-surf-route-grid,
  .azure-glossary-signal-card-grid,
  .azure-glossary-use-case-card-grid,
  .azure-services-grid,
  .pricing-tier-grid,
  .account-explain-grid,
  .retake-runbook-static-grid
) > :nth-child(6n + 5) { --ag-card-accent-rgb: 212 119 255; }

body.ag-app-shell .site-main :where(
  .exam-catalog-grid,
  .exam-track-next-grid,
  .exam-track-coverage-grid,
  .intent-grid,
  .reference-shortcut-grid,
  .reference-route-grid,
  .study-plan-route-grid,
  .azure-home-exam-compact-grid,
  .azure-home-reference-link-row,
  .azure-learn-outcome-grid,
  .azure-learn-map-grid,
  .azure-learn-path-grid,
  .azure-learn-fast-lanes,
  .azure-learn-workspace-grid,
  .azure-resource-graph-card-grid,
  .azure-resource-graph-area-grid,
  .azure-glossary-grid,
  .azure-glossary-core-grid,
  .azure-glossary-source-grid,
  .azure-glossary-command-grid,
  .azure-glossary-command-flow-grid,
  .azure-glossary-chain-grid,
  .azure-glossary-relationship-type-grid,
  .azure-glossary-surf-route-grid,
  .azure-glossary-signal-card-grid,
  .azure-glossary-use-case-card-grid,
  .azure-services-grid,
  .pricing-tier-grid,
  .account-explain-grid,
  .retake-runbook-static-grid
) > :nth-child(6n) { --ag-card-accent-rgb: 255 132 150; }

body.ag-app-shell .site-main :where(
  .exam-catalog-card,
  .intent-card,
  .reference-shortcut-grid > a,
  .reference-route-card,
  .study-plan-route-card,
  .azure-home-exam-compact,
  .azure-home-reference-link-row > a,
  .azure-learn-outcome-card,
  .azure-learn-map-card,
  .azure-learn-path-card,
  .azure-learn-lane-card,
  .azure-learn-workspace-card,
  .azure-compare-card,
  .operational-compare-card,
  .azure-resource-graph-card-grid > *,
  .azure-resource-graph-area-grid > *,
  .azure-glossary-card,
  .azure-glossary-core-card,
  .azure-glossary-source-card,
  .azure-glossary-command-card,
  .azure-glossary-command-flow-card,
  .azure-glossary-chain-card,
  .azure-glossary-relationship-type-card,
  .azure-glossary-surf-route-card,
  .azure-glossary-signal-card,
  .azure-glossary-use-case-card,
  .azure-glossary-case-study-card,
  .exam-track-next-grid > article,
  .exam-track-coverage-grid > article,
  .pricing-tier-grid > *,
  .azure-services-grid > *,
  .account-explain-grid > *,
  .retake-runbook-static-grid > *
) {
  border-color: rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .36);
  background-image:
    radial-gradient(circle at 0 0, rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .16), transparent 15rem),
    linear-gradient(145deg, rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .065), transparent 46%);
  box-shadow:
    inset 0 3px 0 rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .62),
    inset 0 1px 0 rgb(255 255 255 / .07),
    0 20px 54px rgb(0 0 0 / .21),
    0 0 38px rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .055);
}

body.ag-app-shell .site-main :where(
  .exam-catalog-group,
  .exam-catalog-secondary-status,
  .exam-track-section,
  .learner-workspace-section,
  .search-workspace-results-panel,
  .diagnostic-results-host,
  .pricing-entitlement-table-wrap,
  .ux-table-wrap,
  .operational-reference-message,
  .azure-glossary-panel,
  .azure-glossary-term-section,
  .azure-glossary-source-panel,
  .azure-glossary-core-panel,
  .azure-glossary-learning-panel,
  .azure-glossary-graph-panel,
  .reference-workflow-panel,
  .reference-diagnostic-bridge,
  .azure-exam-study-panel,
  .azure-command-center-panel,
  .azure-runbooks-results-panel
) {
  border-color: rgb(var(--ag-page-accent-rgb) / .24);
  background-image:
    radial-gradient(circle at 4% 0, rgb(var(--ag-page-accent-rgb) / .075), transparent 24rem),
    radial-gradient(circle at 98% 4%, rgb(var(--ag-page-accent-2-rgb) / .055), transparent 23rem);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .055),
    0 22px 64px rgb(0 0 0 / .16);
}

@media (hover: hover) and (pointer: fine) {
  body.ag-app-shell .site-main :where(
    .exam-catalog-card,
    .intent-card,
    .reference-shortcut-grid > a,
    .reference-route-card,
    .study-plan-route-card,
    .azure-home-exam-compact,
    .azure-home-reference-link-row > a,
    .azure-learn-outcome-card,
    .azure-learn-map-card,
    .azure-learn-path-card,
    .azure-learn-lane-card,
    .azure-compare-card,
    .operational-compare-card,
    .azure-glossary-card,
    .azure-glossary-surf-route-card
  ) {
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, filter .18s ease;
  }

  body.ag-app-shell .site-main :where(
    .exam-catalog-card,
    .intent-card,
    .reference-shortcut-grid > a,
    .reference-route-card,
    .study-plan-route-card,
    .azure-home-exam-compact,
    .azure-home-reference-link-row > a,
    .azure-learn-outcome-card,
    .azure-learn-map-card,
    .azure-learn-path-card,
    .azure-learn-lane-card,
    .azure-compare-card,
    .operational-compare-card,
    .azure-glossary-card,
    .azure-glossary-surf-route-card
  ):hover {
    transform: translateY(-3px);
    border-color: rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .62);
    filter: saturate(1.07);
    box-shadow:
      inset 0 3px 0 rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .82),
      inset 0 1px 0 rgb(255 255 255 / .09),
      0 26px 66px rgb(0 0 0 / .29),
      0 0 48px rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .1);
  }
}

/* --------------------------------------------------------------------------
   Luxury surface recovery: consistent breathing room, radius, light, and glow
   -------------------------------------------------------------------------- */

/* The homepage exam picker previously painted a border around content with no
   interior padding. This is a real collision bug, not a taste preference. */
body.ag-app-shell .azure-search-first-layout > :where(
  .azure-home-exam-picker-compact,
  .azure-home-reference-shortcuts,
  .azure-home-study-value
) {
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  padding: var(--ag-surface-pad-lg);
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .34);
  border-radius: var(--ag-radius-panel);
  background:
    radial-gradient(circle at 4% -10%, rgb(var(--ag-page-accent-rgb) / .2), transparent 24rem),
    radial-gradient(circle at 96% -12%, rgb(var(--ag-page-accent-2-rgb) / .16), transparent 25rem),
    linear-gradient(145deg, rgb(10 27 49 / .92), rgb(3 12 27 / .96));
  box-shadow:
    0 24px 68px rgb(0 0 0 / .3),
    0 0 42px rgb(var(--ag-page-accent-rgb) / .075),
    inset 0 1px 0 rgb(255 255 255 / .08),
    inset 0 0 0 1px rgb(var(--ag-page-accent-2-rgb) / .035);
}

body.ag-app-shell .azure-search-first-layout > :where(
  .azure-home-exam-picker-compact,
  .azure-home-reference-shortcuts,
  .azure-home-study-value
)::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 2px;
  border-radius: inherit;
  background: linear-gradient(
    90deg,
    rgb(var(--ag-page-accent-rgb) / .94),
    rgb(var(--ag-page-accent-2-rgb) / .88) 58%,
    rgb(var(--ag-page-accent-3-rgb) / .82)
  );
  box-shadow: 0 0 24px rgb(var(--ag-page-accent-rgb) / .32);
}

body.ag-app-shell .azure-home-section-heading {
  margin-bottom: clamp(1.15rem, 2vw, 1.55rem);
}

body.ag-app-shell .azure-home-exam-compact {
  min-height: 9.25rem;
  padding: clamp(1.05rem, 1.7vw, 1.3rem) clamp(1.1rem, 1.9vw, 1.4rem);
  border: 1px solid rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .42);
  border-radius: var(--ag-radius-card);
  background:
    radial-gradient(circle at 8% -6%, rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .2), transparent 14rem),
    linear-gradient(145deg, rgb(12 30 54 / .94), rgb(3 12 27 / .94));
  box-shadow:
    inset 0 2px 0 rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .62),
    inset 0 1px 0 rgb(255 255 255 / .075),
    0 18px 46px rgb(0 0 0 / .25),
    0 0 28px rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .07);
}

body.ag-app-shell .azure-home-exam-compact :where(.azure-home-exam-code-row, .azure-home-exam-title, em) {
  min-width: 0;
}

body.ag-app-shell .azure-home-exam-title {
  line-height: 1.28;
}

body.ag-app-shell .azure-home-exam-compact em {
  padding-top: .15rem;
}

/* Recover borders and radii when older page-specific CSS reset a panel to
   border: 0, border-radius: 0, or box-shadow: none. */
body.ag-app-shell .site-main :where(
  .exam-catalog-group,
  .exam-catalog-secondary-status,
  .exam-track-section,
  .exam-track-start,
  .exam-track-official,
  .learner-workspace-section,
  .search-workspace-results-panel,
  .diagnostic-results-host,
  .pricing-entitlement-table-wrap,
  .ux-table-wrap,
  .operational-reference-message,
  .azure-glossary-panel,
  .azure-glossary-source-panel,
  .azure-glossary-core-panel,
  .azure-glossary-learning-panel,
  .azure-glossary-graph-panel,
  .reference-workflow-panel,
  .reference-diagnostic-bridge,
  .azure-exam-study-panel,
  .azure-runbooks-results-panel,
  .azure-command-search-panel,
  .azure-command-context-card,
  .azure-command-service-map-strip,
  .azure-command-group-gallery,
  .azure-command-results-frame,
  .azure-command-lower-disclosure,
  .azure-command-proof-band,
  .operational-resource-details,
  .operational-resource-graph-library,
  .operational-resource-graph-search,
  .azure-runbook-glance-grid > article,
  .labs-guide-panel,
  .account-panel,
  .legal-page section
) {
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .27);
  border-radius: var(--ag-radius-panel);
  background-color: rgb(5 16 32 / .72);
  box-shadow:
    0 18px 54px rgb(0 0 0 / .23),
    0 0 34px rgb(var(--ag-page-accent-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .065);
}

/* Card geometry is intentionally modest: enough radius to feel crafted,
   without turning every interface element into a bubble. */
body.ag-app-shell .site-main :where(
  .exam-catalog-card,
  .intent-card,
  .reference-shortcut-grid > a,
  .reference-route-card,
  .study-plan-route-card,
  .azure-home-reference-link-row > a,
  .azure-learn-outcome-card,
  .azure-learn-map-card,
  .azure-learn-path-card,
  .azure-learn-lane-card,
  .azure-learn-workspace-card,
  .azure-compare-card,
  .operational-compare-card,
  .azure-resource-graph-card-grid > *,
  .azure-resource-graph-area-grid > *,
  .azure-glossary-card,
  .azure-glossary-core-card,
  .azure-glossary-source-card,
  .azure-glossary-command-card,
  .azure-glossary-command-flow-card,
  .azure-glossary-chain-card,
  .azure-glossary-relationship-type-card,
  .azure-glossary-surf-route-card,
  .azure-glossary-signal-card,
  .azure-glossary-use-case-card,
  .azure-glossary-case-study-card,
  .exam-track-next-grid > article,
  .exam-track-coverage-grid > article,
  .pricing-tier-grid > *,
  .azure-services-grid > *,
  .account-explain-grid > *,
  .retake-runbook-static-grid > *
) {
  border-radius: var(--ag-radius-card);
}

/* --------------------------------------------------------------------------
   Deep reference pages: turn the long-form document into a lit reading suite
   -------------------------------------------------------------------------- */

body.ag-app-shell .azure-glossary-deep-term {
  --deep-term-reading-width: 74ch;
  --ag-term-surface-rgb: var(--ag-page-accent-rgb);
}

body.ag-app-shell .azure-glossary-deep-term .azure-glossary-breadcrumbs {
  margin-bottom: clamp(.9rem, 2vw, 1.35rem);
  padding-inline: .15rem;
}

body.ag-app-shell .azure-glossary-deep-term-header {
  width: 100%;
  max-width: 100%;
  padding: var(--ag-surface-pad-xl);
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .42);
  border-radius: clamp(1.45rem, 2.8vw, 2.1rem);
  background:
    radial-gradient(circle at 8% -12%, rgb(var(--ag-page-accent-rgb) / .36), transparent 28rem),
    radial-gradient(circle at 94% -10%, rgb(var(--ag-page-accent-2-rgb) / .29), transparent 29rem),
    radial-gradient(circle at 56% 118%, rgb(var(--ag-page-accent-3-rgb) / .13), transparent 24rem),
    linear-gradient(142deg, rgb(13 33 58 / .98), rgb(3 12 27 / .985));
  box-shadow:
    0 32px 86px rgb(0 0 0 / .37),
    0 0 58px rgb(var(--ag-page-accent-rgb) / .1),
    inset 0 1px 0 rgb(255 255 255 / .1),
    inset 0 0 0 1px rgb(var(--ag-page-accent-2-rgb) / .045);
}

body.ag-app-shell .azure-glossary-deep-term-header::before {
  display: block;
}

body.ag-app-shell .azure-glossary-deep-term-grid {
  grid-template-columns: minmax(0, 1fr) minmax(17rem, 20rem);
  gap: clamp(1.1rem, 2.6vw, 2rem);
  align-items: start;
}

body.ag-app-shell .azure-glossary-deep-term-main {
  display: grid;
  gap: var(--ag-section-gap);
}

body.ag-app-shell .azure-glossary-deep-term-main > .azure-glossary-term-section {
  --ag-term-surface-rgb: var(--ag-page-accent-rgb);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: clamp(1.3rem, 2.7vw, 2rem);
  border: 1px solid rgb(var(--ag-term-surface-rgb) / .34);
  border-radius: var(--ag-radius-panel);
  background:
    radial-gradient(circle at 3% -6%, rgb(var(--ag-term-surface-rgb) / .13), transparent 22rem),
    radial-gradient(circle at 98% 0%, rgb(var(--ag-page-accent-2-rgb) / .065), transparent 22rem),
    linear-gradient(145deg, rgb(8 23 43 / .91), rgb(3 13 28 / .96));
  box-shadow:
    0 22px 64px rgb(0 0 0 / .27),
    0 0 40px rgb(var(--ag-term-surface-rgb) / .07),
    inset 0 1px 0 rgb(255 255 255 / .075);
  scroll-margin-top: 6rem;
}

body.ag-app-shell .azure-glossary-deep-term-main > .azure-glossary-term-section:first-child {
  padding-top: clamp(1.3rem, 2.7vw, 2rem);
  border-top: 1px solid rgb(var(--ag-term-surface-rgb) / .34);
}

body.ag-app-shell .azure-glossary-deep-term-main > .azure-glossary-term-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, rgb(var(--ag-term-surface-rgb) / .94), rgb(var(--ag-page-accent-2-rgb) / .72), transparent 86%);
  box-shadow: 0 0 22px rgb(var(--ag-term-surface-rgb) / .28);
}

body.ag-app-shell .azure-glossary-deep-term :where(#term-understand, #term-architecture) { --ag-term-surface-rgb: 61 184 255; }
body.ag-app-shell .azure-glossary-deep-term :where(#term-technical-context, #term-scenarios) { --ag-term-surface-rgb: 146 119 255; }
body.ag-app-shell .azure-glossary-deep-term :where(#term-exam-context, #term-use-cases) { --ag-term-surface-rgb: 54 225 191; }
body.ag-app-shell .azure-glossary-deep-term #term-cli { --ag-term-surface-rgb: 216 92 255; }
body.ag-app-shell .azure-glossary-deep-term #term-common-mistakes { --ag-term-surface-rgb: 255 132 150; }

body.ag-app-shell .azure-glossary-deep-term-section :where(p, li, dd) {
  max-width: var(--deep-term-reading-width);
}

body.ag-app-shell .azure-glossary-deep-term-section h2 {
  margin-bottom: 1.05rem;
}

body.ag-app-shell .azure-glossary-deep-term-cautions {
  overflow: hidden;
  gap: 0;
  border: 1px solid rgb(var(--ag-page-accent-3-rgb) / .28);
  border-radius: var(--ag-radius-card);
  background:
    linear-gradient(135deg, rgb(var(--ag-page-accent-rgb) / .09), rgb(var(--ag-page-accent-2-rgb) / .065)),
    rgb(3 13 28 / .66);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .055), 0 15px 38px rgb(0 0 0 / .18);
}

body.ag-app-shell .azure-glossary-deep-term-cautions div {
  padding: 1rem 1.1rem;
}

body.ag-app-shell .azure-glossary-deep-term-details,
body.ag-app-shell .azure-glossary-deep-term-source-details {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .24);
  border-radius: var(--ag-radius-card);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-page-accent-rgb) / .09), transparent 18rem),
    rgb(2 11 25 / .62);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
}

body.ag-app-shell .azure-glossary-deep-term-facts div,
body.ag-app-shell .azure-glossary-deep-term-exam-links a,
body.ag-app-shell .azure-glossary-deep-term-list li,
body.ag-app-shell .azure-glossary-deep-term-cli-grid > section,
body.ag-app-shell .azure-glossary-deep-term-architecture-list div,
body.ag-app-shell .azure-glossary-deep-term-mistakes li,
body.ag-app-shell .azure-glossary-term-page-neighbor-nav-bottom a {
  border: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
  border-radius: var(--ag-radius-inset);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .07), transparent 13rem),
    rgb(2 11 25 / .52);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035), 0 12px 30px rgb(0 0 0 / .14);
}

body.ag-app-shell .azure-glossary-deep-term-facts div {
  padding: .72rem .82rem;
}

body.ag-app-shell .azure-glossary-deep-term-exam-links a {
  padding: .8rem .9rem;
  border-bottom: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
}

body.ag-app-shell .azure-glossary-deep-term-list li {
  padding: .78rem .9rem .78rem 2rem;
  border-bottom: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
}

body.ag-app-shell .azure-glossary-deep-term-numbered-list li {
  padding: .8rem .9rem .8rem 3rem;
  border: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
  border-radius: var(--ag-radius-inset);
  background: rgb(2 11 25 / .48);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035);
}

body.ag-app-shell .azure-glossary-deep-term-numbered-list li::before {
  left: .85rem;
  top: .86rem;
}

body.ag-app-shell .azure-glossary-deep-term-scenario {
  border: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .32);
  border-radius: var(--ag-radius-card);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .12), transparent 17rem),
    linear-gradient(145deg, rgb(8 23 43 / .86), rgb(2 10 24 / .91));
  box-shadow:
    0 16px 42px rgb(0 0 0 / .2),
    0 0 28px rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .055),
    inset 0 1px 0 rgb(255 255 255 / .055);
}

body.ag-app-shell .azure-glossary-deep-term-cli-grid > section {
  padding: 1rem;
}

body.ag-app-shell .azure-glossary-deep-term-commands .azure-glossary-command-bundle {
  padding: 1rem;
  border: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
  border-radius: var(--ag-radius-card);
  background: rgb(2 10 23 / .48);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035);
}

body.ag-app-shell .azure-glossary-deep-term-command-card {
  margin-top: .7rem;
  padding: .9rem;
  border: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .19);
  border-radius: var(--ag-radius-inset);
  background:
    linear-gradient(145deg, rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .045), transparent),
    rgb(2 9 21 / .58);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035), 0 12px 30px rgb(0 0 0 / .14);
}

body.ag-app-shell .azure-glossary-deep-term-architecture-list {
  display: grid;
  gap: .7rem;
}

body.ag-app-shell .azure-glossary-deep-term-architecture-list div {
  padding: .95rem 1rem;
  border-top: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
}

body.ag-app-shell .azure-glossary-deep-term-mistakes li {
  padding: .9rem 1rem .9rem 2.6rem;
  border-bottom: 1px solid rgb(var(--ag-term-surface-rgb, var(--ag-page-accent-rgb)) / .2);
}

body.ag-app-shell .azure-glossary-deep-term-mistakes li::before {
  left: .9rem;
  top: 1rem;
}

body.ag-app-shell .azure-glossary-term-page-neighbor-nav-bottom {
  max-width: 100%;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

body.ag-app-shell .azure-glossary-term-page-neighbor-nav-bottom a {
  padding: .9rem 1rem;
}

body.ag-app-shell .azure-glossary-deep-term-side {
  gap: .85rem;
}

body.ag-app-shell .azure-glossary-deep-term-side :where(
  .azure-glossary-deep-term-toc,
  .azure-glossary-deep-term-resources,
  .azure-glossary-deep-term-exam-cta,
  .azure-glossary-deep-term-related
) {
  padding: 1rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .28);
  border-radius: var(--ag-radius-card);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-page-accent-rgb) / .1), transparent 17rem),
    linear-gradient(145deg, rgb(7 21 40 / .91), rgb(2 10 23 / .94));
  box-shadow:
    0 18px 48px rgb(0 0 0 / .25),
    0 0 30px rgb(var(--ag-page-accent-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .06);
}

body.ag-app-shell .azure-glossary-deep-term-side :where(
  .azure-glossary-deep-term-resources,
  .azure-glossary-deep-term-exam-cta,
  .azure-glossary-deep-term-related
) {
  border-top: 1px solid rgb(var(--ag-page-accent-rgb) / .28);
}

body.ag-app-shell .azure-glossary-deep-term-related > details {
  padding: .72rem .78rem;
  border: 1px solid rgb(var(--ag-page-accent-2-rgb) / .16);
  border-radius: var(--ag-radius-inset);
  background: rgb(2 10 23 / .42);
}

body.ag-app-shell .azure-glossary-deep-term-related .azure-glossary-related-list.stacked a {
  padding: .55rem .65rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .12);
  border-radius: .72rem;
  background: rgb(var(--ag-page-accent-rgb) / .035);
}

@media (hover: hover) and (pointer: fine) {
  body.ag-app-shell .azure-home-exam-compact:hover,
  body.ag-app-shell .azure-home-exam-compact:focus-visible,
  body.ag-app-shell .azure-glossary-deep-term-scenario:hover,
  body.ag-app-shell .azure-glossary-term-page-neighbor-nav-bottom a:hover {
    border-color: rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .64);
    box-shadow:
      0 24px 60px rgb(0 0 0 / .3),
      0 0 42px rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .1),
      inset 0 1px 0 rgb(255 255 255 / .08);
  }
}

/* --------------------------------------------------------------------------
   Controls, filters, and lifecycle colour
   -------------------------------------------------------------------------- */

body.ag-app-shell :where(
  a.intent-button,
  a.exam-catalog-primary-action,
  a.azure-glossary-primary-link,
  a.azure-glossary-button-link.is-primary,
  a.ux-primary-action,
  a.is-primary,
  button.is-primary,
  button[type="submit"]:not(.secondary)
) {
  border-color: rgb(218 238 255 / .52);
  background: linear-gradient(135deg, var(--ag-action-1), var(--ag-action-2) 64%, var(--ag-action-3));
  color: #fff;
  text-shadow: 0 1px 1px rgb(0 0 0 / .24);
  box-shadow:
    0 15px 36px rgb(var(--ag-page-accent-rgb) / .22),
    0 0 26px rgb(var(--ag-page-accent-2-rgb) / .11),
    inset 0 1px 0 rgb(255 255 255 / .22);
}

body.ag-app-shell :where(input, select, textarea) {
  border-color: rgb(var(--ag-page-accent-rgb) / .24);
  background-color: rgb(2 9 21 / .76);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .04);
}

body.ag-app-shell :where(input, select, textarea):hover {
  border-color: rgb(var(--ag-page-accent-rgb) / .4);
}

body.ag-app-shell :where(input, select, textarea):focus {
  border-color: rgb(var(--ag-page-accent-3-rgb) / .72);
  box-shadow:
    0 0 0 3px rgb(var(--ag-page-accent-rgb) / .14),
    0 0 32px rgb(var(--ag-page-accent-2-rgb) / .08),
    inset 0 1px 0 rgb(255 255 255 / .055);
}

body.ag-app-shell :where(.exam-catalog-filters, .search-workspace-filter-row, .universal-search-toolbar) button[aria-pressed="true"],
body.ag-app-shell :where(.exam-catalog-filters, .search-workspace-filter-row, .universal-search-toolbar) button.is-active {
  border-color: rgb(220 240 255 / .52);
  background: linear-gradient(135deg, var(--ag-action-1), var(--ag-action-2) 66%, var(--ag-action-3));
  color: #fff;
  box-shadow: 0 11px 30px rgb(var(--ag-page-accent-rgb) / .18), inset 0 1px 0 rgb(255 255 255 / .2);
}

body.ag-app-shell :where(.exam-lifecycle-badge, [class*="-badge"], [class*="-pill"]) {
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .09);
}

.exam-lifecycle-badge.is-current,
.exam-lifecycle-badge.is-active {
  border-color: rgb(54 225 191 / .48);
  background: rgb(54 225 191 / .14);
  color: #bdfbea;
}

.exam-lifecycle-badge.is-beta {
  border-color: rgb(146 119 255 / .54);
  background: rgb(146 119 255 / .18);
  color: #e3ddff;
}

.exam-lifecycle-badge.is-retiring {
  border-color: rgb(216 92 255 / .54);
  background: rgb(216 92 255 / .17);
  color: #f0c4ff;
}

.exam-lifecycle-badge.is-retired,
.exam-lifecycle-badge.is-legacy,
.exam-lifecycle-badge.is-reference-only {
  border-color: rgb(255 132 150 / .42);
  background: rgb(255 132 150 / .12);
  color: #ffd5dc;
}

/* --------------------------------------------------------------------------
   Tables, code, notices, loading, and long-form content
   -------------------------------------------------------------------------- */

body.ag-app-shell :where(.ux-table-wrap, .pricing-entitlement-table-wrap) {
  scrollbar-color: rgb(var(--ag-page-accent-rgb) / .68) rgb(2 9 21 / .66);
}

body.ag-app-shell :where(table) {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

body.ag-app-shell :where(table thead th) {
  background:
    linear-gradient(180deg, rgb(var(--ag-page-accent-rgb) / .22), rgb(var(--ag-page-accent-2-rgb) / .12)),
    rgb(8 22 42 / .97);
  color: #f7fbff;
}

body.ag-app-shell :where(table tbody tr:nth-child(even)) {
  background: rgb(var(--ag-page-accent-rgb) / .035);
}

body.ag-app-shell :where(table tbody tr:hover) {
  background: rgb(var(--ag-page-accent-2-rgb) / .065);
}

body.ag-app-shell :where(pre, .azure-glossary-code-block, [class*="-code-block"]) {
  border-color: rgb(var(--ag-page-accent-3-rgb) / .3);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-page-accent-rgb) / .08), transparent 22rem),
    linear-gradient(145deg, rgb(1 8 19 / .97), rgb(7 18 35 / .95));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .04), 0 20px 50px rgb(0 0 0 / .2);
}

body.ag-app-shell :where(.ux-inline-note, [role="status"], [role="alert"], .operational-reference-message) {
  border-color: rgb(var(--ag-page-accent-rgb) / .3);
  background:
    linear-gradient(135deg, rgb(var(--ag-page-accent-rgb) / .11), rgb(var(--ag-page-accent-2-rgb) / .075)),
    rgb(4 14 28 / .68);
}

body.ag-app-shell :where(.ux-loading-skeleton, [class*="-loading"]) :where(span, i),
body.ag-app-shell :where(.diagnostic-results-loading) span {
  background-image: linear-gradient(
    90deg,
    rgb(var(--ag-page-accent-rgb) / .09),
    rgb(var(--ag-page-accent-2-rgb) / .24),
    rgb(var(--ag-page-accent-3-rgb) / .15),
    rgb(var(--ag-page-accent-rgb) / .09)
  );
}

body.ag-app-shell .legal-page {
  width: 100% !important;
  max-width: 100% !important;
}

body.ag-app-shell .legal-page > :where(h1, h2, h3, p, ul, ol, section, .legal-page-head) {
  max-width: 72ch;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.site-footer.ag-site-footer {
  border-top-color: rgb(var(--ag-page-accent-rgb) / .24);
  background:
    radial-gradient(circle at 8% 0%, rgb(var(--ag-page-accent-rgb) / .2), transparent 31rem),
    radial-gradient(circle at 89% 0%, rgb(var(--ag-page-accent-2-rgb) / .17), transparent 32rem),
    linear-gradient(180deg, rgb(4 13 28 / .94), rgb(2 7 18 / .995));
}

.site-footer-group:nth-child(6n + 1) { --ag-card-accent-rgb: 61 184 255; }
.site-footer-group:nth-child(6n + 2) { --ag-card-accent-rgb: 146 119 255; }
.site-footer-group:nth-child(6n + 3) { --ag-card-accent-rgb: 54 225 191; }
.site-footer-group:nth-child(6n + 4) { --ag-card-accent-rgb: 216 92 255; }
.site-footer-group:nth-child(6n + 5) { --ag-card-accent-rgb: 212 119 255; }
.site-footer-group:nth-child(6n) { --ag-card-accent-rgb: 255 132 150; }

.site-footer-group {
  border-color: rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .28);
  background-image:
    radial-gradient(circle at 0 0, rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .11), transparent 13rem);
  box-shadow:
    inset 0 3px 0 rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)) / .48),
    inset 0 1px 0 rgb(255 255 255 / .045);
}

.site-footer-group > strong {
  color: rgb(var(--ag-card-accent-rgb, var(--ag-page-accent-rgb)));
}

/* --------------------------------------------------------------------------
   Responsive and content-preservation safeguards
   -------------------------------------------------------------------------- */

@media (max-width: 980px) {
  :root {
    --ag-page-gutter: clamp(1rem, 3vw, 2rem);
  }

  .site-header-actions {
    border-color: rgb(var(--ag-page-accent-rgb) / .34);
    background:
      radial-gradient(circle at 10% 0%, rgb(var(--ag-page-accent-rgb) / .2), transparent 20rem),
      radial-gradient(circle at 90% 0%, rgb(var(--ag-page-accent-2-rgb) / .14), transparent 20rem),
      linear-gradient(145deg, rgb(5 16 33 / .995), rgb(3 10 23 / .995));
  }

  /* The desktop two-column term grid must collapse explicitly here. The
     premium desktop declaration otherwise wins the cascade and squeezes the
     side rail into a single-digit column on narrow screens. Keep the article
     first and place all supplementary navigation after it. */
  body.ag-app-shell .azure-glossary-deep-term-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--ag-section-gap);
  }

  body.ag-app-shell .azure-glossary-deep-term-main {
    order: 0;
    width: 100%;
    min-width: 0;
  }

  body.ag-app-shell .azure-glossary-deep-term-side {
    order: 1;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
  }

  body.ag-app-shell .azure-glossary-deep-term-side > * {
    width: 100%;
    min-width: 0;
  }

  /* These are substantive term sections. They must remain available on tablets. */
  .azure-glossary-deep-term-resources {
    display: grid !important;
  }

  .azure-glossary-deep-term-exam-cta {
    display: block !important;
  }

  .azure-glossary-deep-term-related {
    display: grid !important;
  }
}

@media (max-width: 760px) {
  :root {
    --ag-page-gutter: 1rem;
  }

  body.ag-app-shell {
    background-attachment: scroll;
  }

  body.ag-app-shell .site-main {
    padding-top: .7rem;
  }

  body.ag-app-shell :where(
    .ux-compact-hero,
    .azure-search-landing-hero,
    .exam-catalog-hero,
    .exam-track-hero,
    .diagnostic-entry-hero,
    .diagnostic-results-route-header,
    .learner-workspace-route-head,
    .azure-learn-hero,
    .azure-practice-hero,
    .azure-case-study-hero,
    .azure-retake-runbook-hero,
    .reference-hub-hero,
    .azure-glossary-subpage-hero,
    .operational-reference-header,
    .azure-services-hero,
    .account-hero,
    .learner-account-hero,
    .intent-hub-hero,
    .labs-guide-hero,
    .search-workspace-header
  ) {
    border-radius: 1.35rem;
    box-shadow: 0 22px 62px rgb(0 0 0 / .31), inset 0 1px 0 rgb(255 255 255 / .065);
  }

  .site-footer-grid {
    grid-template-columns: 1fr;
  }

  /* Keep all search controls available; scroll the compact toolbar instead. */
  [data-ui-performance] .universal-search-toolbar .is-secondary-filter:not([aria-pressed="true"]) {
    display: inline-flex !important;
  }

  .universal-search-toolbar {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .azure-query-autocomplete-head span {
    display: inline !important;
  }
}

@media (max-width: 680px) {
  /* Preserve the numbered miss indicator rather than deleting useful context. */
  .diagnostic-results-miss > span {
    display: inline-grid !important;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid rgb(var(--ag-page-accent-rgb) / .38);
    border-radius: 999px;
    color: rgb(var(--ag-page-accent-3-rgb));
    background: rgb(var(--ag-page-accent-rgb) / .15);
  }
}

@media (max-width: 420px) {
  :root {
    --ag-page-gutter: .875rem;
  }

  .site-brand-mark {
    width: 2.55rem;
    height: 2.55rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell .site-main :where(
    .exam-catalog-card,
    .intent-card,
    .reference-shortcut-grid > a,
    .reference-route-card,
    .study-plan-route-card,
    .azure-home-exam-compact,
    .azure-home-reference-link-row > a,
    .azure-learn-outcome-card,
    .azure-learn-map-card,
    .azure-learn-path-card,
    .azure-learn-lane-card,
    .azure-compare-card,
    .operational-compare-card,
    .azure-glossary-card,
    .azure-glossary-surf-route-card
  ) {
    transition: none;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell :where(.site-header-inner, .site-context-bar-inner, .site-main, .site-footer-inner) {
    max-width: var(--ag-page-width) !important;
  }

  .site-header.ag-site-header::after,
  body.ag-app-shell :where(
    .ux-compact-hero,
    .azure-search-landing-hero,
    .exam-catalog-hero,
    .exam-track-hero,
    .diagnostic-entry-hero,
    .diagnostic-results-route-header,
    .learner-workspace-route-head,
    .azure-learn-hero,
    .azure-practice-hero,
    .azure-case-study-hero,
    .azure-retake-runbook-hero,
    .reference-hub-hero,
    .azure-glossary-subpage-hero,
    .operational-reference-header,
    .azure-services-hero,
    .account-hero,
    .learner-account-hero,
    .intent-hub-hero,
    .labs-guide-hero,
    .search-workspace-header
  )::before {
    display: none;
  }

  body.ag-app-shell :where(
    .ux-compact-hero,
    .azure-search-landing-hero,
    .exam-catalog-hero,
    .exam-track-hero,
    .diagnostic-entry-hero,
    .diagnostic-session,
    .diagnostic-results-route-header,
    .learner-workspace-route-head,
    .azure-learn-hero,
    .azure-practice-hero,
    .reference-hub-hero,
    .search-workspace-header,
    .site-footer-group
  ) {
    border: 1px solid CanvasText;
    box-shadow: none;
  }

  body.ag-app-shell :where(
    .ux-compact-hero,
    .azure-search-landing-hero,
    .exam-catalog-hero,
    .exam-track-hero,
    .diagnostic-entry-hero,
    .diagnostic-results-route-header,
    .learner-workspace-route-head,
    .azure-learn-hero,
    .azure-practice-hero,
    .azure-case-study-hero,
    .azure-retake-runbook-hero,
    .reference-hub-hero,
    .azure-glossary-subpage-hero,
    .operational-reference-header,
    .azure-services-hero,
    .account-hero,
    .learner-account-hero,
    .intent-hub-hero,
    .labs-guide-hero,
    .search-workspace-header
  ) h1 {
    background: none;
    color: CanvasText;
    -webkit-text-fill-color: CanvasText;
  }
}

/* --------------------------------------------------------------------------
   Final search, hero, and autocomplete sweep
   Stable semantic hooks only. Never bind browser behavior or presentation to
   a release/build/iteration identifier.
   -------------------------------------------------------------------------- */

/* The former full-width pseudo-element did not follow the rounded corner and
   read as a detached blue rule. The illuminated border now carries the light. */
body.ag-app-shell :where(
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .reference-hub-hero,
  .search-workspace-header
)::before,
body.ag-app-shell .azure-search-first-layout > :where(
  .azure-home-exam-picker-compact,
  .azure-home-reference-shortcuts,
  .azure-home-study-value
)::before {
  content: none !important;
}

/* Homepage: strong editorial scale without turning the search tool into a
   billboard. Suggestions participate in layout so the hero grows around them. */
body.ag-app-shell .azure-search-landing-hero {
  gap: clamp(1.15rem, 2vw, 1.65rem);
  padding-block: clamp(2.5rem, 5.4vw, 4.75rem) clamp(2rem, 4.3vw, 3.5rem);
}

body.ag-app-shell .azure-search-landing-copy {
  max-width: 69rem;
}

body.ag-app-shell .azure-search-landing-copy h1 {
  max-width: 18ch;
  font-size: clamp(3rem, 5.35vw, 5.25rem);
  line-height: .96;
  letter-spacing: -.058em;
  text-wrap: balance;
}

body.ag-app-shell .azure-search-landing-intro {
  max-width: 56rem;
  margin-top: 1rem;
  font-size: clamp(1rem, 1.35vw, 1.18rem);
}

body.ag-app-shell .azure-query-autocomplete-shell.is-home {
  display: grid;
  gap: .65rem;
}

body.ag-app-shell .azure-query-autocomplete-shell.is-home .azure-query-autocomplete-panel {
  position: static !important;
  inset: auto !important;
  width: 100%;
  margin: 0;
  overflow: hidden;
  border-color: rgb(var(--ag-page-accent-rgb) / .43);
  border-radius: 1.08rem;
  background:
    radial-gradient(circle at 96% -18%, rgb(var(--ag-page-accent-2-rgb) / .16), transparent 20rem),
    linear-gradient(145deg, rgb(6 19 38 / .985), rgb(2 8 22 / .99));
  box-shadow:
    0 18px 52px rgb(0 0 0 / .31),
    0 0 28px rgb(var(--ag-page-accent-rgb) / .08),
    inset 0 1px 0 rgb(255 255 255 / .07);
}

body.ag-app-shell .azure-query-autocomplete-shell.is-home .azure-query-autocomplete-list {
  max-height: min(24rem, 48vh);
}

body.ag-app-shell .azure-query-autocomplete-shell.is-home .azure-query-autocomplete-head {
  background: rgb(11 27 49 / .92);
}

/* Exam and reference hero type should support the task rather than dominate it. */
body.ag-app-shell .exam-catalog-hero h1 {
  max-width: 18ch;
  font-size: clamp(2.85rem, 4.65vw, 4.45rem);
  line-height: .98;
  letter-spacing: -.055em;
  text-wrap: balance;
}

body.ag-app-shell .exam-catalog-hero :where(.eyebrow, h1, p, label, .exam-catalog-count) {
  -webkit-user-select: none;
  user-select: none;
}

body.ag-app-shell .exam-catalog-hero :where(input, textarea) {
  -webkit-user-select: text;
  user-select: text;
}

body.ag-app-shell .exam-catalog-hero {
  -webkit-tap-highlight-color: transparent;
}

body.ag-app-shell .reference-hub-hero h1 {
  max-width: 16ch;
  font-size: clamp(3rem, 5.2vw, 5rem);
  line-height: .96;
  letter-spacing: -.06em;
  text-wrap: balance;
}

/* Search Azure: one connected, premium workspace with moderate density. */
body.ag-app-shell .search-results-workspace {
  gap: clamp(1rem, 1.8vw, 1.35rem);
}

body.ag-app-shell .search-workspace-header {
  gap: clamp(.85rem, 1.5vw, 1.1rem);
  padding: clamp(1.25rem, 2.45vw, 2rem);
  border-color: rgb(var(--ag-page-accent-rgb) / .4);
  border-radius: clamp(1.35rem, 2.2vw, 1.75rem);
  background:
    radial-gradient(circle at 4% -22%, rgb(var(--ag-page-accent-rgb) / .29), transparent 24rem),
    radial-gradient(circle at 96% -15%, rgb(var(--ag-page-accent-2-rgb) / .24), transparent 24rem),
    linear-gradient(142deg, rgb(12 29 53 / .97), rgb(4 12 28 / .985));
  box-shadow:
    0 25px 70px rgb(0 0 0 / .32),
    0 0 38px rgb(var(--ag-page-accent-rgb) / .075),
    inset 0 1px 0 rgb(255 255 255 / .08);
}

body.ag-app-shell .search-workspace-title-row h1 {
  max-width: 18ch;
  font-size: clamp(2.35rem, 4.25vw, 3.85rem);
  line-height: .98;
  text-wrap: balance;
}

body.ag-app-shell .search-workspace-title-row p {
  max-width: 54rem;
  margin-top: .42rem;
}

body.ag-app-shell .azure-query-autocomplete-host.is-search-page {
  z-index: 40;
}

body.ag-app-shell .search-workspace-form {
  gap: .5rem;
  padding: .45rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .38);
  border-radius: 1.15rem;
  background: rgb(2 9 24 / .82);
  box-shadow:
    0 13px 34px rgb(0 0 0 / .25),
    0 0 24px rgb(var(--ag-page-accent-rgb) / .06),
    inset 0 1px 0 rgb(255 255 255 / .055);
}

body.ag-app-shell .search-workspace-form input {
  min-height: 3.55rem;
  padding-inline: 1rem;
  border: 0;
  border-radius: .82rem;
  background: rgb(1 8 22 / .76);
  box-shadow: inset 0 0 0 1px rgb(var(--ag-page-accent-rgb) / .22);
}

body.ag-app-shell .search-workspace-form input:focus {
  border: 0;
  box-shadow:
    inset 0 0 0 2px rgb(var(--ag-page-accent-3-rgb) / .72),
    0 0 0 4px rgb(var(--ag-page-accent-rgb) / .1);
}

body.ag-app-shell .search-workspace-form button {
  min-width: 7.25rem;
  min-height: 3.55rem;
  border-radius: .85rem;
  color: #fff;
  background: linear-gradient(
    135deg,
    rgb(var(--ag-page-accent-rgb) / .95),
    rgb(var(--ag-page-accent-2-rgb) / .95)
  );
  box-shadow: 0 12px 30px rgb(var(--ag-page-accent-rgb) / .2);
}

body.ag-app-shell .search-workspace-results-panel {
  display: grid;
  gap: clamp(.9rem, 1.5vw, 1.15rem);
  box-sizing: border-box;
  padding: clamp(1rem, 2.1vw, 1.55rem);
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .28);
  border-radius: clamp(1.25rem, 2vw, 1.65rem);
  background:
    radial-gradient(circle at 2% 0%, rgb(var(--ag-page-accent-rgb) / .12), transparent 23rem),
    radial-gradient(circle at 100% 22%, rgb(var(--ag-page-accent-2-rgb) / .08), transparent 27rem),
    linear-gradient(150deg, rgb(7 20 39 / .965), rgb(2 9 23 / .985));
  box-shadow:
    0 24px 68px rgb(0 0 0 / .28),
    0 0 34px rgb(var(--ag-page-accent-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .065);
}

body.ag-app-shell .search-workspace-results-head {
  padding: .15rem .15rem .1rem;
}

body.ag-app-shell .search-workspace-results-head h2 {
  font-size: clamp(1.45rem, 2.5vw, 2rem);
}

body.ag-app-shell .search-workspace-results-head p {
  max-width: 68rem;
  font-size: .94rem;
}

body.ag-app-shell .search-workspace-filter-row {
  gap: .45rem;
  padding: .62rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .2);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 0% 50%, rgb(var(--ag-page-accent-rgb) / .09), transparent 18rem),
    rgb(3 12 29 / .72);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
}

body.ag-app-shell .search-workspace-filter-row > button,
body.ag-app-shell .search-workspace-more-filters summary,
body.ag-app-shell .search-workspace-more-filters button {
  border-color: rgb(var(--ag-page-accent-rgb) / .22);
  background: rgb(12 28 51 / .72);
}

body.ag-app-shell .search-workspace-filter-row button:is(.is-active, [aria-pressed="true"]) {
  border-color: rgb(var(--ag-page-accent-3-rgb) / .7);
  background: linear-gradient(
    135deg,
    rgb(var(--ag-page-accent-rgb) / .74),
    rgb(var(--ag-page-accent-2-rgb) / .72)
  );
  box-shadow:
    0 8px 24px rgb(var(--ag-page-accent-rgb) / .15),
    inset 0 1px 0 rgb(255 255 255 / .15);
}

body.ag-app-shell .search-workspace-more-filters > div {
  border-color: rgb(var(--ag-page-accent-rgb) / .32);
  background: rgb(3 11 27 / .985);
  box-shadow:
    0 28px 74px rgb(0 0 0 / .52),
    0 0 28px rgb(var(--ag-page-accent-rgb) / .08),
    inset 0 1px 0 rgb(255 255 255 / .06);
}

body.ag-app-shell .search-workspace-empty,
body.ag-app-shell .search-workspace-no-results {
  padding: 1rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .2);
  border-radius: 1rem;
  background: rgb(5 17 34 / .66);
}

/* Result-family colour is informative rather than random decoration. */
body.ag-app-shell :where(.search-best-answer-card, .search-workspace-result-group) {
  --search-result-accent-rgb: var(--ag-page-accent-rgb);
}

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="term"],
  .search-workspace-result-group[data-search-workspace-result-group="term"]
) { --search-result-accent-rgb: 45 212 191; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="command"],
  .search-workspace-result-group[data-search-workspace-result-group="command"]
) { --search-result-accent-rgb: 56 189 248; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="task"],
  .search-workspace-result-group[data-search-workspace-result-group="task"]
) { --search-result-accent-rgb: 167 139 250; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="compare"],
  .search-workspace-result-group[data-search-workspace-result-group="compare"]
) { --search-result-accent-rgb: 244 114 182; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="resource-graph"],
  .search-workspace-result-group[data-search-workspace-result-group="resource-graph"]
) { --search-result-accent-rgb: 34 211 238; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="lab"],
  .search-workspace-result-group[data-search-workspace-result-group="lab"]
) { --search-result-accent-rgb: 192 38 211; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="command-group"],
  .search-workspace-result-group[data-search-workspace-result-group="command-group"]
) { --search-result-accent-rgb: 96 165 250; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="learning-path"],
  .search-workspace-result-group[data-search-workspace-result-group="learning-path"]
) { --search-result-accent-rgb: 52 211 153; }

body.ag-app-shell :where(
  .search-best-answer-card[data-search-best-answer-type="exam-track"],
  .search-best-answer-card[data-search-best-answer-type="readiness-objective"],
  .search-best-answer-card[data-search-best-answer-type="practice"],
  .search-best-answer-card[data-search-best-answer-type="mock-readiness"],
  .search-best-answer-card[data-search-best-answer-type="focus-plan"],
  .search-best-answer-card[data-search-best-answer-type="examPrep"],
  .search-workspace-result-group[data-search-workspace-result-group="exam-track"],
  .search-workspace-result-group[data-search-workspace-result-group="readiness-objective"],
  .search-workspace-result-group[data-search-workspace-result-group="practice"],
  .search-workspace-result-group[data-search-workspace-result-group="mock-readiness"],
  .search-workspace-result-group[data-search-workspace-result-group="focus-plan"],
  .search-workspace-result-group[data-search-workspace-result-group="examPrep"]
) { --search-result-accent-rgb: 129 140 248; }

body.ag-app-shell .search-best-answer-card {
  align-items: center;
  gap: clamp(1rem, 2vw, 1.35rem);
  padding: clamp(1rem, 2vw, 1.35rem);
  border-color: rgb(var(--search-result-accent-rgb) / .48);
  border-radius: 1.2rem;
  background:
    radial-gradient(circle at 96% -12%, rgb(var(--search-result-accent-rgb) / .2), transparent 22rem),
    linear-gradient(142deg, rgb(10 31 54 / .94), rgb(3 14 31 / .98));
  box-shadow:
    inset 0 2px 0 rgb(var(--search-result-accent-rgb) / .58),
    inset 0 1px 0 rgb(255 255 255 / .07),
    0 18px 48px rgb(0 0 0 / .24),
    0 0 30px rgb(var(--search-result-accent-rgb) / .07);
}

body.ag-app-shell .search-best-answer-label > span,
body.ag-app-shell .search-result-row-label > span,
body.ag-app-shell .search-workspace-result-count {
  color: rgb(var(--search-result-accent-rgb));
}

body.ag-app-shell .search-best-answer-card h3 {
  max-width: 46ch;
  font-size: clamp(1.3rem, 2.25vw, 1.9rem);
  line-height: 1.12;
  letter-spacing: -.03em;
}

body.ag-app-shell .search-best-answer-card p {
  max-width: 68ch;
  font-size: .94rem;
  line-height: 1.55;
}

body.ag-app-shell .search-contextual-next-step {
  margin: 0;
}

body.ag-app-shell .search-contextual-card {
  padding: clamp(.95rem, 1.7vw, 1.2rem);
  border: 1px solid rgb(var(--ag-page-accent-2-rgb) / .27);
  border-radius: 1.05rem;
  background:
    radial-gradient(circle at 100% 0%, rgb(var(--ag-page-accent-2-rgb) / .12), transparent 18rem),
    rgb(7 21 40 / .77);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .055),
    0 14px 40px rgb(0 0 0 / .19);
}

body.ag-app-shell .search-workspace-related-results {
  gap: clamp(.8rem, 1.45vw, 1.05rem);
}

body.ag-app-shell .search-workspace-result-group {
  display: grid;
  gap: .75rem;
  padding: clamp(.8rem, 1.5vw, 1.05rem);
  border: 1px solid rgb(var(--search-result-accent-rgb) / .3);
  border-radius: 1.12rem;
  background:
    radial-gradient(circle at 0% 0%, rgb(var(--search-result-accent-rgb) / .11), transparent 17rem),
    linear-gradient(145deg, rgb(7 21 40 / .88), rgb(3 12 27 / .94));
  box-shadow:
    inset 0 2px 0 rgb(var(--search-result-accent-rgb) / .4),
    inset 0 1px 0 rgb(255 255 255 / .05),
    0 15px 42px rgb(0 0 0 / .19),
    0 0 24px rgb(var(--search-result-accent-rgb) / .045);
}

body.ag-app-shell .search-workspace-result-group-head {
  min-height: 2.2rem;
  padding: 0 .1rem;
}

body.ag-app-shell .search-workspace-result-group-head > div {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .38rem .65rem;
}

body.ag-app-shell .search-workspace-result-group-head h3 {
  font-size: 1.04rem;
  letter-spacing: -.015em;
}

body.ag-app-shell .search-workspace-result-count {
  font-size: .72rem;
  font-weight: 850;
}

body.ag-app-shell .search-workspace-result-list {
  display: grid;
  gap: .55rem;
  border: 0;
}

body.ag-app-shell .search-result-row {
  gap: .9rem;
  padding: .82rem .9rem;
  border: 1px solid rgb(var(--search-result-accent-rgb) / .18);
  border-radius: .9rem;
  background: rgb(2 11 27 / .68);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035);
}

body.ag-app-shell .search-result-row h4 {
  font-size: .98rem;
  line-height: 1.32;
}

body.ag-app-shell .search-result-row p {
  font-size: .87rem;
  line-height: 1.48;
}

body.ag-app-shell .search-result-row code,
body.ag-app-shell .search-best-answer-card code {
  border-color: rgb(var(--search-result-accent-rgb) / .24);
  background: rgb(0 8 22 / .72);
}

body.ag-app-shell .search-workspace-view-all {
  border-color: rgb(var(--search-result-accent-rgb) / .35);
  color: rgb(var(--search-result-accent-rgb));
}

body.ag-app-shell .search-workspace-view-all:hover,
body.ag-app-shell .search-workspace-view-all:focus-visible {
  background: rgb(var(--search-result-accent-rgb) / .12);
}

@media (max-width: 820px) {
  body.ag-app-shell .azure-search-landing-copy h1 {
    max-width: 16ch;
    font-size: clamp(2.8rem, 9.6vw, 4.25rem);
  }

  body.ag-app-shell .exam-catalog-hero h1,
  body.ag-app-shell .reference-hub-hero h1 {
    font-size: clamp(2.6rem, 9vw, 4rem);
  }

  body.ag-app-shell .search-best-answer-card,
  body.ag-app-shell .search-contextual-card,
  body.ag-app-shell .search-result-row {
    grid-template-columns: minmax(0, 1fr);
  }

  body.ag-app-shell .search-best-answer-actions,
  body.ag-app-shell .search-result-row-actions,
  body.ag-app-shell .search-contextual-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  body.ag-app-shell .azure-search-landing-hero {
    padding-inline: 1rem;
  }

  body.ag-app-shell .azure-search-landing-copy h1 {
    max-width: 14ch;
    font-size: clamp(2.55rem, 12.2vw, 3.65rem);
  }

  body.ag-app-shell .search-workspace-form {
    grid-template-columns: minmax(0, 1fr);
  }

  body.ag-app-shell .search-workspace-form button {
    width: 100%;
  }

  body.ag-app-shell .search-workspace-filter-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  body.ag-app-shell .search-workspace-result-group-head {
    align-items: flex-start;
  }

  body.ag-app-shell .search-workspace-result-group-head > div {
    display: grid;
    gap: .15rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell :where(.search-best-answer-card, .search-workspace-result-group, .search-result-row) {
    transition: none;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell :where(
    .azure-search-landing-hero,
    .exam-catalog-hero,
    .reference-hub-hero,
    .search-workspace-header,
    .search-workspace-results-panel,
    .search-workspace-result-group,
    .search-best-answer-card,
    .search-result-row,
    .search-contextual-card,
    .azure-query-autocomplete-panel
  ) {
    border: 1px solid CanvasText;
    background: Canvas;
    color: CanvasText;
    box-shadow: none;
  }

  body.ag-app-shell :where(
    .search-best-answer-label > span,
    .search-result-row-label > span,
    .search-workspace-result-count,
    .search-workspace-view-all
  ) {
    color: LinkText;
  }
}

/* --------------------------------------------------------------------------
   Global illuminated container-border system

   This is a visual contract, not a release/build contract. Bordered semantic
   surfaces receive a page-appropriate halo. Large page panels use a broad,
   quiet glow; cards use a tighter light; dense nested rows use only a small
   edge bloom so long pages stay calm rather than looking neon-heavy.
   -------------------------------------------------------------------------- */

:root {
  --ag-container-glow-rgb: var(--ag-page-accent-rgb);
  --ag-container-shadow-panel:
    0 30px 78px rgb(0 0 0 / .32),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .07),
    0 0 34px rgb(var(--ag-container-glow-rgb) / .11),
    inset 0 1px 0 rgb(255 255 255 / .075),
    inset 0 0 24px rgb(var(--ag-container-glow-rgb) / .025);
  --ag-container-shadow-card:
    0 17px 44px rgb(0 0 0 / .24),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .055),
    0 0 22px rgb(var(--ag-container-glow-rgb) / .078),
    inset 0 1px 0 rgb(255 255 255 / .065),
    inset 0 0 16px rgb(var(--ag-container-glow-rgb) / .02);
  --ag-container-shadow-inset:
    0 10px 27px rgb(0 0 0 / .18),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .042),
    0 0 14px rgb(var(--ag-container-glow-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .055);
}

/* Every hero is a real container. Some older route CSS reset compact heroes
   to border:0, which made them read as a loose block of text. */
body.ag-app-shell .site-main :where(header, section, article, aside):is(
  [class$="-hero"],
  [class*="-hero "]
) {
  --ag-container-glow-rgb: var(--ag-page-accent-rgb);
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .34);
  border-radius: var(--ag-radius-panel);
  box-shadow: var(--ag-container-shadow-panel);
}

/* Stable semantic surface names cover present and future route components.
   These selectors deliberately exclude buttons, links, inputs, and plain
   layout shells. */
body.ag-app-shell .site-main :where(section, article, aside, nav, div, form, details, fieldset, figure):is(
  [class$="-card"], [class*="-card "],
  [class$="-panel"], [class*="-panel "],
  [class$="-note"], [class*="-note "],
  [class$="-message"], [class*="-message "],
  [class$="-form"], [class*="-form "],
  [class$="-table-wrap"], [class*="-table-wrap "],
  [class$="-sidecar"], [class*="-sidecar "],
  [class$="-section"], [class*="-section "],
  [class$="-group"], [class*="-group "],
  [class$="-toolbar"], [class*="-toolbar "],
  [class$="-stats"], [class*="-stats "],
  [class$="-library"], [class*="-library "],
  [class$="-handoff"], [class*="-handoff "],
  [class$="-disclosure"], [class*="-disclosure "],
  [class$="-callout"], [class*="-callout "],
  [class$="-surface"], [class*="-surface "],
  [class$="-tile"], [class*="-tile "]
) {
  --ag-container-glow-rgb: var(--ag-card-accent-rgb, var(--ag-page-accent-rgb));
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .31);
  border-radius: var(--ag-radius-card);
  box-shadow: var(--ag-container-shadow-card);
}

/* Principal route surfaces carry the broader halo. */
body.ag-app-shell .site-main :where(
  .azure-search-landing-hero,
  .azure-home-exam-picker-compact,
  .azure-home-reference-shortcuts,
  .azure-home-study-value,
  .exam-catalog-hero,
  .exam-track-hero,
  .diagnostic-entry-hero,
  .diagnostic-session,
  .diagnostic-workspace-stage,
  .diagnostic-results-route-header,
  .diagnostic-results-host,
  .learner-workspace-route-head,
  .learner-workspace-question-stage,
  .azure-learn-hero,
  .azure-learn-guided-workspace,
  .azure-case-study-player-host,
  .adaptive-retake-runbook-host,
  .azure-team-dashboard-shell-host,
  .reference-hub-hero,
  .azure-glossary-subpage-hero,
  .azure-glossary-term-hero-panel,
  .azure-glossary-deep-term-header,
  .operational-reference-header,
  .operational-resource-graph-header,
  .operational-runbook-header,
  .azure-runbooks-workbench,
  .azure-services-hero,
  .account-hero,
  .learner-account-hero,
  .intent-hub-hero,
  .labs-guide-hero,
  .search-workspace-header,
  .search-workspace-results-panel,
  .legal-page,
  .legal-page-head
) {
  --ag-container-glow-rgb: var(--ag-page-accent-rgb);
  border-color: rgb(var(--ag-container-glow-rgb) / .34);
  box-shadow: var(--ag-container-shadow-panel);
}

/* Existing multicolour card collections keep the colour assigned to the card,
   rather than inheriting one identical page-wide halo. */
body.ag-app-shell .site-main :where(
  .exam-catalog-card,
  .exam-catalog-secondary-status article,
  .intent-card,
  .reference-shortcut-grid > a,
  .reference-route-card,
  .study-plan-route-card,
  .azure-home-exam-compact,
  .azure-home-reference-link-row > a,
  .azure-learn-outcome-card,
  .azure-learn-map-card,
  .azure-learn-path-card,
  .azure-learn-lane-card,
  .azure-learn-workspace-card,
  .azure-compare-card,
  .operational-compare-card,
  .azure-resource-graph-card-grid > *,
  .azure-resource-graph-area-grid > *,
  .azure-glossary-card,
  .azure-glossary-core-card,
  .azure-glossary-source-card,
  .azure-glossary-command-card,
  .azure-glossary-command-flow-card,
  .azure-glossary-chain-card,
  .azure-glossary-relationship-type-card,
  .azure-glossary-surf-route-card,
  .azure-glossary-signal-card,
  .azure-glossary-use-case-card,
  .azure-glossary-case-study-card,
  .exam-track-next-grid > article,
  .exam-track-coverage-grid > article,
  .pricing-tier-grid > *,
  .azure-services-principles > *,
  .azure-services-grid > *,
  .azure-services-fit > *,
  .azure-learn-exam-value-grid > article,
  .azure-learn-crosslinks > div,
  .account-explain-grid > *,
  .retake-runbook-static-grid > *,
  .site-footer-group
) {
  --ag-container-glow-rgb: var(--ag-card-accent-rgb, var(--ag-page-accent-rgb));
  border-color: rgb(var(--ag-container-glow-rgb) / .36);
  box-shadow: var(--ag-container-shadow-card);
}

/* Previously unlit but visibly bordered supporting surfaces. */
body.ag-app-shell .site-main :where(
  .diagnostic-entry-select-row,
  .diagnostic-entry-grid,
  .diagnostic-entry-selected,
  .diagnostic-entry-secondary,
  .diagnostic-workspace-status-card,
  .diagnostic-workspace-progress-panel,
  .diagnostic-session-loading,
  .diagnostic-workspace-loading,
  .exam-track-status-card,
  .exam-track-status-card dl > div,
  .exam-track-start,
  .exam-track-official,
  .exam-catalog-empty,
  .exam-catalog-no-results,
  .exam-catalog-secondary-status,
  .azure-home-reference-link-row,
  .azure-exam-study-detail,
  .azure-learn-exam-strip,
  .azure-learn-exam-objectives,
  .azure-learn-exam-modules,
  .azure-learn-path-signal,
  .azure-learn-context-sidecar,
  .operational-search-entry,
  .operational-filter-disclosure,
  .operational-secondary-tool,
  .operational-command-group,
  .azure-ops-detail,
  .azure-ops-loading,
  .learner-workspace-supporting-tools,
  .learner-workspace-practice-settings,
  .azure-practice-question-card,
  .azure-practice-toolbar,
  .azure-practice-stats,
  .azure-query-autocomplete-panel,
  .search-workspace-empty,
  .search-workspace-no-results,
  .search-workspace-filter-row,
  .pricing-entitlement-table-wrap,
  .ux-table-wrap,
  .account-key-note,
  .ux-disclosure
) {
  --ag-container-glow-rgb: var(--ag-card-accent-rgb, var(--ag-page-accent-rgb));
  border-color: rgb(var(--ag-container-glow-rgb) / .3);
  box-shadow: var(--ag-container-shadow-card);
}

/* Dense nested rows get the smallest halo to avoid visual noise. */
body.ag-app-shell .site-main :where(
  .search-result-row,
  .diagnostic-workspace-status-card,
  .diagnostic-workspace-progress-panel,
  .exam-track-status-card dl > div,
  .azure-learn-exam-strip,
  .azure-learn-exam-objectives,
  .azure-learn-exam-modules,
  .azure-learn-path-signal,
  .azure-practice-stats,
  .azure-glossary-deep-term-scenario,
  .azure-glossary-deep-term-command-card,
  .azure-glossary-deep-term-side > *,
  .azure-glossary-term-page-neighbor-nav-bottom > a
) {
  box-shadow: var(--ag-container-shadow-inset);
}

/* Deep-reference suites retain their section-specific jewel colour. */
body.ag-app-shell .azure-glossary-deep-term :where(
  .azure-glossary-deep-term-header,
  .azure-glossary-term-section,
  .azure-glossary-deep-term-scenario,
  .azure-glossary-deep-term-command-card,
  .azure-glossary-deep-term-side > *,
  .azure-glossary-term-page-neighbor-nav-bottom > a
) {
  --ag-container-glow-rgb: var(--ag-term-surface-rgb, var(--ag-page-accent-rgb));
}

/* Search result families retain their semantic result colour. */
body.ag-app-shell :where(
  .search-best-answer-card,
  .search-workspace-result-group,
  .search-result-row
) {
  --ag-container-glow-rgb: var(--search-result-accent-rgb, var(--ag-page-accent-rgb));
}

body.ag-app-shell .search-best-answer-card,
body.ag-app-shell .search-workspace-result-group {
  box-shadow: var(--ag-container-shadow-card);
}

/* The exam-prep / operational bridge is now explicitly its own card. The old
   selector targeted an imaginary child aside, so the full border never painted. */
body.ag-app-shell .search-workspace-contextual-next-step {
  margin: 0;
}

body.ag-app-shell .search-contextual-card {
  --ag-container-glow-rgb: var(--ag-page-accent-3-rgb);
  position: relative;
  isolation: isolate;
  overflow: clip;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(.9rem, 2vw, 1.4rem);
  align-items: center;
  margin: 0;
  padding: clamp(1.05rem, 2vw, 1.35rem) clamp(1.1rem, 2.3vw, 1.55rem);
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .43);
  border-radius: var(--ag-radius-card);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-container-glow-rgb) / .17), transparent 20rem),
    radial-gradient(circle at 100% 100%, rgb(var(--ag-page-accent-2-rgb) / .11), transparent 18rem),
    linear-gradient(145deg, rgb(8 27 48 / .93), rgb(3 13 29 / .97));
  box-shadow:
    0 19px 48px rgb(0 0 0 / .27),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .065),
    0 0 28px rgb(var(--ag-container-glow-rgb) / .11),
    inset 0 1px 0 rgb(255 255 255 / .075),
    inset 0 0 20px rgb(var(--ag-container-glow-rgb) / .026);
}

body.ag-app-shell .search-contextual-card.is-operational {
  --ag-container-glow-rgb: 216 92 255;
}

body.ag-app-shell .search-contextual-card.is-study {
  --ag-container-glow-rgb: 54 225 191;
}

body.ag-app-shell .search-contextual-copy {
  max-width: 70ch;
}

body.ag-app-shell .search-contextual-card h3 {
  margin: .2rem 0 .28rem;
  font-size: clamp(1.1rem, 1.65vw, 1.3rem);
  line-height: 1.2;
}

body.ag-app-shell .search-contextual-card p {
  margin: 0;
  color: rgb(214 226 242 / .79);
  line-height: 1.55;
}

body.ag-app-shell .search-contextual-card .search-contextual-actions {
  justify-content: flex-end;
}

@media (hover: hover) and (pointer: fine) {
  body.ag-app-shell .site-main :where(
    .exam-catalog-card,
    .intent-card,
    .reference-shortcut-grid > a,
    .reference-route-card,
    .study-plan-route-card,
    .azure-home-exam-compact,
    .azure-home-reference-link-row > a,
    .azure-learn-outcome-card,
    .azure-learn-map-card,
    .azure-learn-path-card,
    .azure-learn-lane-card,
    .azure-learn-workspace-card,
    .azure-compare-card,
    .operational-compare-card,
    .azure-glossary-card,
    .azure-glossary-surf-route-card,
    .exam-track-next-grid > article,
    .azure-services-grid > article,
    .pricing-tier-grid > article
  ):hover {
    border-color: rgb(var(--ag-container-glow-rgb) / .62);
    box-shadow:
      0 24px 60px rgb(0 0 0 / .29),
      0 0 0 1px rgb(var(--ag-container-glow-rgb) / .085),
      0 0 34px rgb(var(--ag-container-glow-rgb) / .13),
      inset 0 1px 0 rgb(255 255 255 / .08);
  }
}

@media (max-width: 820px) {
  body.ag-app-shell .search-contextual-card {
    grid-template-columns: minmax(0, 1fr);
  }

  body.ag-app-shell .search-contextual-card .search-contextual-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  :root {
    --ag-container-shadow-panel:
      0 22px 58px rgb(0 0 0 / .3),
      0 0 0 1px rgb(var(--ag-container-glow-rgb) / .06),
      0 0 24px rgb(var(--ag-container-glow-rgb) / .085),
      inset 0 1px 0 rgb(255 255 255 / .065);
    --ag-container-shadow-card:
      0 14px 34px rgb(0 0 0 / .23),
      0 0 0 1px rgb(var(--ag-container-glow-rgb) / .05),
      0 0 17px rgb(var(--ag-container-glow-rgb) / .065),
      inset 0 1px 0 rgb(255 255 255 / .055);
  }
}

@media (forced-colors: active) {
  body.ag-app-shell .site-main :where(header, section, article, aside, nav, div, form, details, fieldset, figure):is(
    [class$="-hero"], [class*="-hero "],
    [class$="-card"], [class*="-card "],
    [class$="-panel"], [class*="-panel "],
    [class$="-note"], [class*="-note "],
    [class$="-message"], [class*="-message "],
    [class$="-form"], [class*="-form "],
    [class$="-table-wrap"], [class*="-table-wrap "],
    [class$="-sidecar"], [class*="-sidecar "],
    [class$="-section"], [class*="-section "],
    [class$="-group"], [class*="-group "],
    [class$="-toolbar"], [class*="-toolbar "],
    [class$="-stats"], [class*="-stats "],
    [class$="-library"], [class*="-library "],
    [class$="-handoff"], [class*="-handoff "],
    [class$="-disclosure"], [class*="-disclosure "],
    [class$="-callout"], [class*="-callout "],
    [class$="-surface"], [class*="-surface "],
    [class$="-tile"], [class*="-tile "]
  ),
  body.ag-app-shell .search-contextual-card {
    border: 1px solid CanvasText;
    background: Canvas;
    color: CanvasText;
    box-shadow: none;
  }
}

/* --------------------------------------------------------------------------
   Study Plan: server-first evidence workspace
   --------------------------------------------------------------------------
   The objective map is present in the initial HTML. These rules make the
   server-rendered state feel complete before browser-local evidence hydrates.
   The visual hierarchy deliberately uses only three glow strengths so the
   page stays premium rather than neon.
*/
body.ag-app-shell.learner-workspace-plan-page {
  --ag-plan-cyan-rgb: 94 231 255;
  --ag-plan-blue-rgb: 61 184 255;
  --ag-plan-violet-rgb: 146 119 255;
  --ag-plan-teal-rgb: 54 225 191;
  --ag-plan-magenta-rgb: 216 92 255;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-inner {
  gap: clamp(.9rem, 1.8vw, 1.25rem);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head {
  --ag-container-glow-rgb: var(--ag-plan-blue-rgb);
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(18rem, .72fr);
  gap: clamp(1.3rem, 3vw, 2.5rem);
  align-items: stretch;
  padding: clamp(1.45rem, 3.8vw, 3.15rem);
  border-color: rgb(var(--ag-plan-blue-rgb) / .46);
  border-radius: clamp(1.35rem, 2.4vw, 1.9rem);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-plan-blue-rgb) / .34), transparent 29rem),
    radial-gradient(circle at 100% 8%, rgb(var(--ag-plan-teal-rgb) / .25), transparent 27rem),
    radial-gradient(circle at 58% 112%, rgb(var(--ag-plan-violet-rgb) / .19), transparent 25rem),
    linear-gradient(135deg, rgb(9 31 57 / .985), rgb(5 15 34 / .995) 58%, rgb(7 31 40 / .97));
  box-shadow:
    0 32px 88px rgb(0 0 0 / .34),
    0 0 0 1px rgb(var(--ag-plan-blue-rgb) / .075),
    0 0 48px rgb(var(--ag-plan-blue-rgb) / .12),
    inset 0 1px 0 rgb(255 255 255 / .095),
    inset 0 0 55px rgb(var(--ag-plan-violet-rgb) / .035);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head::before {
  height: 2px;
  background: linear-gradient(
    90deg,
    rgb(var(--ag-plan-cyan-rgb) / .98),
    rgb(var(--ag-plan-blue-rgb) / .95) 37%,
    rgb(var(--ag-plan-violet-rgb) / .9) 69%,
    rgb(var(--ag-plan-teal-rgb) / .92)
  );
  box-shadow: 0 0 24px rgb(var(--ag-plan-cyan-rgb) / .31);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-copy {
  align-self: center;
  max-width: 50rem;
  padding-block: clamp(.15rem, 1vw, .65rem);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head h1 {
  max-width: 12ch;
  margin: .42rem 0 .8rem;
  font-size: clamp(3rem, 5.35vw, 4.8rem);
  line-height: .94;
  letter-spacing: -.055em;
  text-wrap: balance;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head p {
  max-width: 48rem;
  color: rgb(218 231 247 / .82);
  line-height: 1.66;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot {
  --ag-container-glow-rgb: var(--ag-plan-teal-rgb);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  align-content: center;
  gap: .45rem;
  min-height: 100%;
  padding: clamp(1.15rem, 2.5vw, 1.65rem);
  border: 1px solid rgb(var(--ag-plan-teal-rgb) / .41);
  border-radius: 1.2rem;
  background:
    radial-gradient(circle at 100% 0, rgb(var(--ag-plan-teal-rgb) / .2), transparent 18rem),
    radial-gradient(circle at 0 100%, rgb(var(--ag-plan-violet-rgb) / .14), transparent 16rem),
    linear-gradient(145deg, rgb(7 30 43 / .88), rgb(4 13 29 / .92));
  box-shadow:
    0 22px 56px rgb(0 0 0 / .28),
    0 0 0 1px rgb(var(--ag-plan-teal-rgb) / .055),
    0 0 31px rgb(var(--ag-plan-teal-rgb) / .095),
    inset 0 1px 0 rgb(255 255 255 / .085);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, rgb(var(--ag-plan-teal-rgb) / .9), rgb(var(--ag-plan-violet-rgb) / .72));
  box-shadow: 0 0 18px rgb(var(--ag-plan-teal-rgb) / .24);
  pointer-events: none;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-snapshot-label {
  color: rgb(var(--ag-plan-teal-rgb));
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot > strong {
  color: #f8fbff;
  font-size: clamp(1.3rem, 2.2vw, 1.72rem);
  line-height: 1.12;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot > p {
  margin: 0;
  color: rgb(211 226 242 / .74);
  font-size: .91rem;
  line-height: 1.5;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin: .65rem 0 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dl > div {
  min-width: 0;
  padding: .7rem .65rem;
  border: 1px solid rgb(var(--ag-plan-teal-rgb) / .18);
  border-radius: .8rem;
  background: rgb(2 10 24 / .48);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .055),
    0 0 16px rgb(var(--ag-plan-teal-rgb) / .035);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot :is(dt, dd) {
  margin: 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dt {
  overflow-wrap: anywhere;
  color: rgb(174 194 216 / .7);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dd {
  margin-top: .2rem;
  color: #f7fbff;
  font-size: 1.08rem;
  font-weight: 900;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-shell {
  --ag-container-glow-rgb: var(--ag-plan-violet-rgb);
  gap: .85rem;
  padding: clamp(1rem, 2.2vw, 1.4rem);
  border-color: rgb(var(--ag-plan-violet-rgb) / .37);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-plan-violet-rgb) / .13), transparent 23rem),
    radial-gradient(circle at 100% 100%, rgb(var(--ag-plan-blue-rgb) / .09), transparent 22rem),
    linear-gradient(145deg, rgb(7 17 36 / .965), rgb(2 9 23 / .98));
  box-shadow:
    0 24px 64px rgb(0 0 0 / .27),
    0 0 0 1px rgb(var(--ag-plan-violet-rgb) / .055),
    0 0 34px rgb(var(--ag-plan-violet-rgb) / .075),
    inset 0 1px 0 rgb(255 255 255 / .075);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-context {
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 26rem) auto;
  gap: .8rem 1rem;
  align-items: end;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-context select {
  border-color: rgb(var(--ag-plan-blue-rgb) / .37);
  background:
    linear-gradient(180deg, rgb(8 23 42 / .96), rgb(2 10 22 / .98));
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .055),
    0 0 18px rgb(var(--ag-plan-blue-rgb) / .04);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-nav {
  gap: .45rem;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-nav a {
  min-height: 2.65rem;
  border-color: rgb(var(--ag-plan-violet-rgb) / .2);
  border-radius: .78rem;
  background: rgb(2 8 21 / .55);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-nav a[aria-current="page"] {
  border-color: rgb(var(--ag-plan-cyan-rgb) / .58);
  background:
    radial-gradient(circle at 20% 0, rgb(var(--ag-plan-cyan-rgb) / .22), transparent 8rem),
    linear-gradient(135deg, rgb(12 93 150 / .82), rgb(55 74 174 / .75));
  box-shadow:
    0 0 22px rgb(var(--ag-plan-blue-rgb) / .14),
    inset 0 1px 0 rgb(255 255 255 / .13);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-next-action {
  --ag-container-glow-rgb: var(--ag-plan-teal-rgb);
  padding: clamp(1rem, 2vw, 1.3rem);
  border-color: rgb(var(--ag-plan-teal-rgb) / .39);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-plan-teal-rgb) / .13), transparent 19rem),
    linear-gradient(135deg, rgb(7 40 53 / .82), rgb(8 19 42 / .88));
  box-shadow:
    0 15px 38px rgb(0 0 0 / .22),
    0 0 23px rgb(var(--ag-plan-teal-rgb) / .07),
    inset 0 1px 0 rgb(255 255 255 / .065);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-section-link {
  display: inline-flex;
  align-items: center;
  min-height: 2.35rem;
  padding: .5rem .75rem;
  border: 1px solid rgb(var(--ag-plan-blue-rgb) / .25);
  border-radius: 999px;
  background: rgb(4 17 35 / .54);
  color: rgb(196 234 255);
  font-size: .84rem;
  font-weight: 850;
  text-decoration: none;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-section {
  --ag-container-glow-rgb: var(--ag-plan-blue-rgb);
  gap: clamp(1rem, 2vw, 1.35rem);
  padding: clamp(1.15rem, 2.7vw, 1.75rem);
  border-color: rgb(var(--ag-plan-blue-rgb) / .36);
  background:
    radial-gradient(circle at 2% 0, rgb(var(--ag-plan-blue-rgb) / .12), transparent 28rem),
    radial-gradient(circle at 100% 42%, rgb(var(--ag-plan-violet-rgb) / .075), transparent 27rem),
    linear-gradient(145deg, rgb(6 19 38 / .965), rgb(3 11 25 / .985));
  box-shadow:
    0 25px 68px rgb(0 0 0 / .27),
    0 0 0 1px rgb(var(--ag-plan-blue-rgb) / .055),
    0 0 36px rgb(var(--ag-plan-blue-rgb) / .08),
    inset 0 1px 0 rgb(255 255 255 / .07);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-section-head {
  align-items: end;
  padding-bottom: .2rem;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-section-head h2 {
  max-width: 18ch;
  margin-top: .28rem;
  font-family: var(--lux-serif, Georgia, 'Times New Roman', serif);
  font-size: clamp(2rem, 4vw, 3.35rem);
  line-height: 1;
  letter-spacing: -.045em;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-summary {
  align-items: end;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-summary h2 {
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin: 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics > div {
  --ag-container-glow-rgb: var(--ag-plan-blue-rgb);
  min-width: 0;
  padding: .85rem 1rem;
  border: 1px solid rgb(var(--ag-plan-blue-rgb) / .22);
  border-radius: .9rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-plan-blue-rgb) / .09), transparent 11rem),
    rgb(2 10 24 / .56);
  box-shadow:
    0 12px 27px rgb(0 0 0 / .16),
    0 0 16px rgb(var(--ag-plan-blue-rgb) / .035),
    inset 0 1px 0 rgb(255 255 255 / .05);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics :is(dt, dd) {
  margin: 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics dt {
  color: rgb(170 193 217 / .72);
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .065em;
  text-transform: uppercase;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics dd {
  margin-top: .24rem;
  color: #f8fbff;
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: 950;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li {
  --ag-card-accent-rgb: var(--ag-plan-blue-rgb);
  min-width: 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li:nth-child(4n + 2) {
  --ag-card-accent-rgb: var(--ag-plan-violet-rgb);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li:nth-child(4n + 3) {
  --ag-card-accent-rgb: var(--ag-plan-teal-rgb);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li:nth-child(4n) {
  --ag-card-accent-rgb: var(--ag-plan-cyan-rgb);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  grid-template-areas: "index copy status arrow";
  gap: .75rem;
  align-items: center;
  min-height: 6.45rem;
  padding: clamp(.9rem, 1.7vw, 1.15rem);
  border: 1px solid rgb(var(--ag-card-accent-rgb) / .31);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-card-accent-rgb) / .12), transparent 15rem),
    linear-gradient(145deg, rgb(6 20 39 / .86), rgb(2 9 22 / .92));
  box-shadow:
    0 15px 35px rgb(0 0 0 / .2),
    0 0 0 1px rgb(var(--ag-card-accent-rgb) / .03),
    0 0 20px rgb(var(--ag-card-accent-rgb) / .045),
    inset 0 1px 0 rgb(255 255 255 / .06);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(180deg, rgb(var(--ag-card-accent-rgb) / .9), rgb(var(--ag-card-accent-rgb) / .08));
  box-shadow: 0 0 14px rgb(var(--ag-card-accent-rgb) / .24);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-index {
  grid-area: index;
  display: grid;
  place-items: center;
  width: 2.15rem;
  aspect-ratio: 1;
  justify-self: start !important;
  padding: 0 !important;
  border: 1px solid rgb(var(--ag-card-accent-rgb) / .35) !important;
  border-radius: .7rem !important;
  background: rgb(var(--ag-card-accent-rgb) / .105) !important;
  color: rgb(229 246 255) !important;
  font-size: .7rem !important;
  letter-spacing: .04em;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .07);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-copy {
  grid-area: copy;
  display: grid;
  gap: .28rem;
  min-width: 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-copy strong {
  color: #f7fbff;
  font-size: .98rem;
  line-height: 1.35;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-copy small {
  grid-column: auto;
  color: rgb(171 193 217 / .75);
  font-size: .78rem;
  line-height: 1.4;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-status {
  grid-area: status;
  justify-self: end !important;
  max-width: 9.2rem;
  overflow-wrap: anywhere;
  white-space: normal !important;
  text-align: center;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-arrow {
  grid-area: arrow;
  justify-self: end !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgb(var(--ag-card-accent-rgb)) !important;
  font-size: 1.05rem !important;
  text-shadow: 0 0 15px rgb(var(--ag-card-accent-rgb) / .25);
}

@media (hover: hover) and (pointer: fine) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a:hover {
    transform: translateY(-2px);
    border-color: rgb(var(--ag-card-accent-rgb) / .58);
    background:
      radial-gradient(circle at 0 0, rgb(var(--ag-card-accent-rgb) / .18), transparent 17rem),
      linear-gradient(145deg, rgb(8 25 47 / .92), rgb(3 11 26 / .96));
    box-shadow:
      0 20px 44px rgb(0 0 0 / .25),
      0 0 0 1px rgb(var(--ag-card-accent-rgb) / .055),
      0 0 29px rgb(var(--ag-card-accent-rgb) / .085),
      inset 0 1px 0 rgb(255 255 255 / .075);
  }
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a:focus-visible {
  outline: 3px solid rgb(var(--ag-card-accent-rgb) / .26);
  outline-offset: 3px;
  border-color: rgb(var(--ag-card-accent-rgb) / .66);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-supporting-tools {
  --ag-container-glow-rgb: var(--ag-plan-magenta-rgb);
  border-color: rgb(var(--ag-plan-magenta-rgb) / .31);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-plan-magenta-rgb) / .08), transparent 20rem),
    linear-gradient(145deg, rgb(10 18 34 / .91), rgb(3 10 22 / .95));
  box-shadow:
    0 16px 42px rgb(0 0 0 / .22),
    0 0 23px rgb(var(--ag-plan-magenta-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .055);
  content-visibility: auto;
  contain-intrinsic-size: auto 4rem;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-supporting-tools > summary {
  color: rgb(245 208 254);
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-supporting-tools a {
  border-color: rgb(var(--ag-plan-magenta-rgb) / .22);
  color: rgb(245 208 254);
  background: rgb(33 15 53 / .34);
}

body.ag-app-shell.learner-workspace-plan-page :where(.learner-workspace-empty, .learner-review-empty) {
  --ag-container-glow-rgb: var(--ag-plan-cyan-rgb);
  border-style: solid;
  border-color: rgb(var(--ag-plan-cyan-rgb) / .29);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-plan-cyan-rgb) / .09), transparent 18rem),
    rgb(2 10 23 / .55);
  box-shadow:
    0 13px 30px rgb(0 0 0 / .18),
    0 0 17px rgb(var(--ag-plan-cyan-rgb) / .045),
    inset 0 1px 0 rgb(255 255 255 / .045);
}

@media (max-width: 980px) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head {
    grid-template-columns: minmax(0, 1fr) minmax(16rem, .65fr);
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-context {
    grid-template-columns: minmax(0, 1fr) minmax(15rem, 21rem);
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-persistence {
    grid-column: 1 / -1;
    max-width: none;
    text-align: left;
  }
}

@media (max-width: 760px) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head {
    grid-template-columns: minmax(0, 1fr);
    padding: clamp(1.25rem, 5vw, 1.7rem);
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-route-head h1 {
    max-width: 10ch;
    font-size: clamp(2.75rem, 13vw, 4.15rem);
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot {
    min-height: auto;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-context,
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list {
    grid-template-columns: minmax(0, 1fr);
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics {
    grid-template-columns: repeat(3, minmax(5.4rem, 1fr));
    overflow-x: auto;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "index copy arrow"
      "index status status";
    align-items: start;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-status {
    justify-self: start !important;
    max-width: 100%;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-section-head {
    align-items: flex-start;
  }
}

@media (max-width: 480px) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dl {
    gap: .4rem;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dl > div,
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics > div {
    padding-inline: .65rem;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-shell,
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-section {
    padding: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a {
    transition: none;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell.learner-workspace-plan-page :where(
    .learner-workspace-route-head,
    .learner-workspace-hero-snapshot,
    .learner-workspace-shell,
    .learner-workspace-next-action,
    .learner-workspace-plan-section,
    .learner-workspace-plan-metrics > div,
    .learner-workspace-objective-list > li > a,
    .learner-workspace-supporting-tools,
    .learner-workspace-empty,
    .learner-review-empty
  ) {
    border: 1px solid CanvasText;
    background: Canvas;
    color: CanvasText;
    box-shadow: none;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a::before,
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot::after {
    display: none;
  }
}

/* Study Plan objective-copy reset. The legacy workspace stylesheet styled every
   span as a status pill; the richer card markup uses spans as layout wrappers. */
body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-copy {
  justify-self: stretch !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  white-space: normal !important;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-supporting-tools {
  content-visibility: visible;
  contain-intrinsic-size: none;
}

@media (max-width: 760px) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas:
      "index copy"
      "index status";
    gap: .5rem .7rem;
    min-height: 7.25rem;
    padding-right: 2.7rem;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-copy strong {
    overflow-wrap: anywhere;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-arrow {
    position: absolute;
    top: .9rem;
    right: .9rem;
  }
}

@media (max-width: 620px) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-nav {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    overflow: visible;
    padding-bottom: 0;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-nav a {
    grid-column: span 2;
    min-width: 0;
    padding-inline: .42rem;
    font-size: .8rem;
    line-height: 1.18;
    text-align: center;
  }

  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-nav a:nth-last-child(-n + 2) {
    grid-column: span 3;
  }
}

@media (max-width: 480px) {
  body.ag-app-shell.learner-workspace-plan-page .learner-workspace-hero-snapshot dt {
    font-size: .58rem;
    letter-spacing: .015em;
  }
}

/* Iteration: route polish, reference hub luxury refresh, mastery link fix companion styles */
body.ag-app-shell .learner-workspace-shell,
body.ag-app-shell .learner-workspace-section,
body.ag-app-shell .learner-workspace-question-stage,
body.ag-app-shell .learner-workspace-supporting-tools,
body.ag-app-shell .learner-workspace-practice-settings {
  padding-top: clamp(1.05rem, 2.2vw, 1.35rem);
  padding-bottom: clamp(1.05rem, 2.2vw, 1.35rem);
}

body.ag-app-shell .learner-workspace-section,
body.ag-app-shell .learner-workspace-question-stage {
  gap: .95rem;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-section {
  gap: .9rem;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-summary,
body.ag-app-shell.learner-workspace-plan-page .learner-workspace-plan-metrics,
body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list {
  margin-block: 0;
}

body.ag-app-shell.learner-workspace-plan-page .learner-workspace-objective-list > li > a {
  min-height: 7rem;
}

body.ag-app-shell.learner-workspace-practice-page .learner-workspace-question-stage {
  gap: .8rem;
}

body.ag-app-shell.learner-workspace-practice-page .learner-workspace-question-stage-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 1rem;
}

body.ag-app-shell.learner-workspace-practice-page .learner-workspace-question-stage-head > div:first-child {
  max-width: 42rem;
}

body.ag-app-shell.learner-workspace-practice-page .azure-practice-stats {
  min-width: 19.5rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem .9rem;
  align-self: start;
  border-radius: 1.05rem;
  background:
    radial-gradient(circle at 0 0, rgba(56, 189, 248, .12), transparent 11rem),
    rgba(2, 6, 23, .82);
  box-shadow:
    0 0 0 1px rgba(56, 189, 248, .10),
    0 0 24px rgba(56, 189, 248, .06),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body.ag-app-shell.learner-workspace-practice-page .azure-practice-progress {
  margin: 0;
  padding: .75rem .95rem;
  border: 1px solid rgba(125, 211, 252, .20);
  border-radius: 1rem;
  background:
    linear-gradient(145deg, rgba(9, 21, 39, .68), rgba(2, 6, 23, .58));
}

body.ag-app-shell.learner-workspace-practice-page .azure-practice-question-host {
  display: grid;
  gap: .75rem;
}

body.ag-app-shell.learner-workspace-practice-page .azure-practice-question-card {
  box-shadow:
    0 18px 44px rgba(0,0,0,.22),
    0 0 22px rgba(56, 189, 248, .035),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body.ag-app-shell.learner-workspace-practice-page .azure-practice-keyboard-note {
  margin: 0;
  padding: .8rem .95rem;
  border: 1px solid rgba(148, 163, 184, .14);
  border-radius: .95rem;
  background: rgba(3, 10, 25, .48);
}

body.ag-app-shell.learner-workspace-practice-page .learner-workspace-review-preview {
  padding-block: 1rem;
}

body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(18rem, .9fr);
  align-items: stretch;
  gap: 1.25rem;
  overflow: hidden;
  min-height: 0;
  padding: clamp(1.35rem, 3vw, 2rem);
  border-radius: 1.7rem;
  border: 1px solid rgba(68, 211, 255, .26);
  background:
    linear-gradient(90deg, rgba(11, 26, 44, .92), rgba(5, 18, 37, .86) 48%, rgba(18, 23, 52, .90)),
    radial-gradient(circle at 8% 18%, rgba(45, 212, 191, .16), transparent 26rem),
    radial-gradient(circle at 80% 14%, rgba(167, 139, 250, .14), transparent 22rem),
    repeating-linear-gradient(90deg, rgba(255,255,255,.028), rgba(255,255,255,.028) 1px, transparent 1px, transparent 3.45rem);
  box-shadow:
    0 26px 78px rgba(2, 6, 23, .34),
    0 0 0 1px rgba(255,255,255,.03),
    0 0 28px rgba(45, 212, 191, .06),
    inset 0 1px 0 rgba(255,255,255,.06);
}

body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury::before {
  content: none;
}

body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury .reference-hub-copy {
  display: grid;
  align-content: center;
  gap: .9rem;
  min-width: 0;
}

body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury h1 {
  max-width: 9.2ch;
  margin: 0;
  font-size: clamp(3rem, 6vw, 5.4rem);
  line-height: .94;
}

body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury p:not(.ux-proof-line) {
  max-width: 50rem;
  font-size: clamp(1rem, 1.65vw, 1.26rem);
  line-height: 1.6;
}

body.ag-app-shell .reference-hub-sidecar {
  display: grid;
  gap: .9rem;
  align-content: center;
}

body.ag-app-shell .reference-hub-sidecard,
body.ag-app-shell .reference-hub-stat-grid > div {
  border-radius: 1.15rem;
  border: 1px solid rgba(125, 211, 252, .18);
  background: linear-gradient(145deg, rgba(6, 18, 34, .84), rgba(3, 10, 24, .94));
  box-shadow:
    0 16px 38px rgba(2, 6, 23, .22),
    0 0 18px rgba(96, 165, 250, .04),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body.ag-app-shell .reference-hub-sidecard {
  padding: 1rem 1rem 1.05rem;
}

body.ag-app-shell .reference-hub-sidecard-label {
  color: #8ce8ff;
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

body.ag-app-shell .reference-hub-sidecard strong {
  display: block;
  margin-top: .42rem;
  color: #f8fbff;
  font-size: 1.05rem;
  line-height: 1.35;
}

body.ag-app-shell .reference-hub-sidecard p {
  margin: .45rem 0 0;
  color: rgba(226, 232, 240, .76);
  font-size: .92rem;
  line-height: 1.55;
}

body.ag-app-shell .reference-hub-sidecard-links {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  margin-top: .8rem;
}

body.ag-app-shell .reference-hub-sidecard-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.35rem;
  padding: .5rem .8rem;
  border-radius: 999px;
  border: 1px solid rgba(125, 211, 252, .25);
  background: rgba(8, 47, 73, .34);
  color: #dff6ff;
  text-decoration: none;
  font-weight: 850;
}

body.ag-app-shell .reference-hub-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 0;
}

body.ag-app-shell .reference-hub-stat-grid > div {
  padding: .78rem .88rem;
}

body.ag-app-shell .reference-hub-stat-grid dt,
body.ag-app-shell .reference-hub-stat-grid dd {
  margin: 0;
}

body.ag-app-shell .reference-hub-stat-grid dt {
  color: rgba(173, 191, 214, .8);
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.ag-app-shell .reference-hub-stat-grid dd {
  margin-top: .25rem;
  color: #f8fbff;
  font-size: 1.1rem;
  font-weight: 900;
}

body.ag-app-shell .reference-shortcut-grid {
  gap: .95rem;
}

body.ag-app-shell .reference-shortcut-grid > a {
  padding: 1.1rem 1.05rem;
  border-radius: 1.1rem;
}

@media (max-width: 980px) {
  body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body.ag-app-shell.learner-workspace-practice-page .learner-workspace-question-stage-head {
    grid-template-columns: 1fr;
  }

  body.ag-app-shell.learner-workspace-practice-page .azure-practice-stats {
    min-width: 0;
    width: 100%;
  }

  body.ag-app-shell .reference-hub-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  body.ag-app-shell .reference-hub-hero.reference-hub-hero-luxury h1 {
    font-size: clamp(2.55rem, 12vw, 3.55rem);
    max-width: 100%;
  }

  body.ag-app-shell .reference-hub-stat-grid {
    grid-template-columns: 1fr;
  }
}

/* --------------------------------------------------------------------------
   Depth and runbook experience refinement

   A slightly brighter edge bloom and a quiet contact shadow give containers
   weight without turning every surface into an identical neon sign. Search
   fields use a stronger neon-tube focus treatment only while active.
   -------------------------------------------------------------------------- */

:root {
  --ag-container-shadow-panel:
    0 3px 7px rgb(0 0 0 / .30),
    0 32px 82px rgb(0 0 0 / .39),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .10),
    0 0 42px rgb(var(--ag-container-glow-rgb) / .15),
    inset 0 1px 0 rgb(255 255 255 / .09),
    inset 0 -24px 42px rgb(0 0 0 / .105),
    inset 0 0 30px rgb(var(--ag-container-glow-rgb) / .035);
  --ag-container-shadow-card:
    0 2px 5px rgb(0 0 0 / .28),
    0 18px 46px rgb(0 0 0 / .30),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .085),
    0 0 28px rgb(var(--ag-container-glow-rgb) / .115),
    inset 0 1px 0 rgb(255 255 255 / .08),
    inset 0 -16px 28px rgb(0 0 0 / .085),
    inset 0 0 20px rgb(var(--ag-container-glow-rgb) / .028);
  --ag-container-shadow-inset:
    0 2px 4px rgb(0 0 0 / .24),
    0 11px 29px rgb(0 0 0 / .23),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .07),
    0 0 18px rgb(var(--ag-container-glow-rgb) / .085),
    inset 0 1px 0 rgb(255 255 255 / .07),
    inset 0 -10px 20px rgb(0 0 0 / .065);
}

/* AO-style contact shading at the places where panels visually meet the page. */
body.ag-app-shell .site-main :where(
  .azure-search-landing-hero,
  .azure-home-exam-picker-compact,
  .exam-catalog-hero,
  .reference-hub-hero,
  .search-workspace-header,
  .search-workspace-results-panel,
  .learner-workspace-shell,
  .learner-workspace-section,
  .learner-workspace-question-stage,
  .operational-reference-header,
  .operational-runbook-experience,
  .operational-runbook-journeys,
  .operational-runbook-exam-bridge,
  .operational-runbook-workbench,
  .operational-runbook-detail,
  .azure-glossary-term-section,
  .azure-glossary-deep-term-header,
  .site-footer-group
) {
  background-clip: padding-box;
}

body.ag-app-shell .site-main :where(
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .reference-hub-hero,
  .search-workspace-header,
  .learner-workspace-route-head,
  .operational-reference-header,
  .operational-runbook-experience,
  .operational-runbook-journeys,
  .operational-runbook-exam-bridge,
  .operational-runbook-workbench,
  .operational-runbook-detail
) {
  border-color: rgb(var(--ag-container-glow-rgb, var(--ag-page-accent-rgb)) / .43);
  box-shadow: var(--ag-container-shadow-panel);
}

body.ag-app-shell .site-main :where(
  .exam-catalog-card,
  .search-workspace-result-group,
  .search-best-answer-card,
  .search-result-row,
  .learner-workspace-objective-list > li > a,
  .azure-practice-question-card,
  .reference-shortcut-grid > a,
  .operational-runbook-journey-card,
  .operational-runbook-row,
  .azure-runbook-detail-section,
  .azure-ops-section,
  .azure-ops-command-card,
  .azure-runbook-exam-card,
  .azure-runbook-next-grid > a
) {
  border-color: rgb(var(--ag-container-glow-rgb, var(--ag-card-accent-rgb, var(--ag-page-accent-rgb))) / .38);
}

/* Neon-tube focus. The bright inner line is only present while a field is in use. */
body.ag-app-shell :where(
  .azure-search-landing-form,
  .search-workspace-form,
  .operational-search-entry,
  .exam-catalog-search,
  .azure-glossary-search-entry,
  .azure-learn-search
) {
  --ag-neon-rgb: 91 224 255;
  position: relative;
  isolation: isolate;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}

body.ag-app-shell :where(
  .azure-search-landing-form,
  .search-workspace-form,
  .operational-search-entry,
  .exam-catalog-search,
  .azure-glossary-search-entry,
  .azure-learn-search
)::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 4px;
  border: 2px solid transparent;
  border-radius: max(.65rem, calc(var(--ag-radius-card) - 4px));
  pointer-events: none;
  transition: border-color .18s ease, box-shadow .18s ease, opacity .18s ease;
  opacity: 0;
}

body.ag-app-shell :where(
  .azure-search-landing-form,
  .search-workspace-form,
  .operational-search-entry,
  .exam-catalog-search,
  .azure-glossary-search-entry,
  .azure-learn-search
):focus-within {
  border-color: rgb(179 244 255 / .98) !important;
  background-color: rgb(2 9 24 / .94);
  box-shadow:
    0 2px 5px rgb(0 0 0 / .32),
    0 20px 46px rgb(0 0 0 / .30),
    0 0 0 1px rgb(var(--ag-neon-rgb) / .96),
    0 0 8px rgb(var(--ag-neon-rgb) / .92),
    0 0 24px rgb(var(--ag-neon-rgb) / .55),
    0 0 48px rgb(var(--ag-neon-rgb) / .24),
    inset 0 0 12px rgb(var(--ag-neon-rgb) / .17),
    inset 0 -16px 28px rgb(0 0 0 / .10) !important;
}

body.ag-app-shell :where(
  .azure-search-landing-form,
  .search-workspace-form,
  .operational-search-entry,
  .exam-catalog-search,
  .azure-glossary-search-entry,
  .azure-learn-search
):focus-within::after {
  border-color: rgb(211 250 255 / .96);
  box-shadow:
    0 0 4px rgb(255 255 255 / .92),
    0 0 10px rgb(var(--ag-neon-rgb) / .96),
    0 0 21px rgb(var(--ag-neon-rgb) / .72),
    inset 0 0 9px rgb(var(--ag-neon-rgb) / .38);
  opacity: 1;
  animation: ag-neon-tube-breathe 2.8s ease-in-out infinite;
}

body.ag-app-shell :where(
  .azure-search-landing-form,
  .search-workspace-form,
  .operational-search-entry,
  .exam-catalog-search,
  .azure-glossary-search-entry,
  .azure-learn-search
) :where(input, select, textarea):focus-visible {
  outline: none;
}

@keyframes ag-neon-tube-breathe {
  0%, 100% { opacity: .86; }
  50% { opacity: 1; }
}

/* Runbook library: goal-first organization and a safer, clearer route through detail. */
body.ag-app-shell .operational-reference-shell.azure-runbooks-shell {
  display: grid;
  gap: clamp(1rem, 2vw, 1.4rem);
}

body.ag-app-shell .operational-runbook-header-luxury {
  --ag-container-glow-rgb: 216 92 255;
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(18rem, .72fr);
  align-items: stretch;
  gap: clamp(1rem, 2.4vw, 1.5rem);
  padding: clamp(1.35rem, 3vw, 2.2rem);
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 0%, rgb(216 92 255 / .14), transparent 24rem),
    radial-gradient(circle at 88% 12%, rgb(61 184 255 / .13), transparent 22rem),
    linear-gradient(145deg, rgb(8 18 34 / .96), rgb(3 10 24 / .94));
}

body.ag-app-shell .operational-runbook-header-copy {
  display: grid;
  align-content: center;
  gap: .85rem;
}

body.ag-app-shell .operational-runbook-header-copy h1 {
  max-width: 14ch;
  margin: 0;
  font-family: var(--lux-serif, Georgia, 'Times New Roman', serif);
  font-size: clamp(3rem, 6.2vw, 5.75rem);
  line-height: .94;
  letter-spacing: -.055em;
  color: #f8fbff;
  text-wrap: balance;
}

body.ag-app-shell .operational-runbook-header-copy > p {
  max-width: 52rem;
  margin: 0;
  color: rgb(205 219 235 / .82);
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  line-height: 1.65;
}

body.ag-app-shell .operational-runbook-orientation {
  --ag-container-glow-rgb: 61 184 255;
  display: grid;
  align-content: center;
  gap: .7rem;
  padding: clamp(1rem, 2vw, 1.3rem);
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .34);
  border-radius: var(--ag-radius-card);
  background:
    radial-gradient(circle at 100% 0, rgb(61 184 255 / .14), transparent 13rem),
    linear-gradient(145deg, rgb(5 18 35 / .9), rgb(2 8 20 / .94));
  box-shadow: var(--ag-container-shadow-card);
}

body.ag-app-shell .operational-runbook-orientation-label,
body.ag-app-shell .operational-runbook-journey-top > span,
body.ag-app-shell .azure-runbook-exam-card > span,
body.ag-app-shell .azure-runbook-next-grid > a > span {
  color: #8ce8ff;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

body.ag-app-shell .operational-runbook-orientation > strong {
  color: #f8fbff;
  font-size: 1.12rem;
}

body.ag-app-shell .operational-runbook-orientation ol {
  display: grid;
  gap: .55rem;
  margin: .15rem 0;
  padding: 0;
  list-style: none;
}

body.ag-app-shell .operational-runbook-orientation li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .65rem;
  align-items: start;
  padding: .6rem .65rem;
  border: 1px solid rgb(61 184 255 / .13);
  border-radius: .82rem;
  background: rgb(2 9 23 / .52);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035), inset 0 -10px 18px rgb(0 0 0 / .06);
}

body.ag-app-shell .operational-runbook-orientation li > span {
  display: grid;
  place-items: center;
  width: 2rem;
  aspect-ratio: 1;
  border: 1px solid rgb(61 184 255 / .35);
  border-radius: .65rem;
  background: rgb(61 184 255 / .1);
  color: #dff8ff;
  font-weight: 900;
  font-size: .7rem;
}

body.ag-app-shell .operational-runbook-orientation li div {
  display: grid;
  gap: .16rem;
}

body.ag-app-shell .operational-runbook-orientation li strong { color: #f4f8ff; }
body.ag-app-shell .operational-runbook-orientation li small,
body.ag-app-shell .operational-runbook-orientation > p { color: rgb(190 207 227 / .72); line-height: 1.45; }
body.ag-app-shell .operational-runbook-orientation > p { margin: 0; font-size: .82rem; }

body.ag-app-shell .operational-runbook-experience,
body.ag-app-shell .operational-runbook-journeys,
body.ag-app-shell .operational-runbook-exam-bridge,
body.ag-app-shell .operational-runbook-workbench,
body.ag-app-shell .operational-runbook-detail {
  --ag-container-glow-rgb: 61 184 255;
  padding: clamp(1rem, 2.3vw, 1.45rem);
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .36);
  border-radius: var(--ag-radius-panel);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-container-glow-rgb) / .08), transparent 20rem),
    linear-gradient(145deg, rgb(7 18 35 / .88), rgb(2 8 20 / .91));
  box-shadow: var(--ag-container-shadow-panel);
}

body.ag-app-shell .operational-runbook-experience {
  --ag-container-glow-rgb: 54 225 191;
  display: grid;
  grid-template-columns: minmax(15rem, .64fr) minmax(0, 1.36fr);
  gap: 1.1rem;
  align-items: center;
}

body.ag-app-shell .operational-runbook-experience-heading h2,
body.ag-app-shell .operational-runbook-journeys-head h2,
body.ag-app-shell .operational-runbook-exam-bridge h2,
body.ag-app-shell .azure-runbook-next-path h3 {
  margin: .22rem 0 0;
  color: #f8fbff;
  font-family: var(--lux-serif, Georgia, 'Times New Roman', serif);
  letter-spacing: -.035em;
  line-height: 1.02;
}

body.ag-app-shell .operational-runbook-experience-heading h2,
body.ag-app-shell .operational-runbook-journeys-head h2 { font-size: clamp(1.65rem, 3.2vw, 2.65rem); }

body.ag-app-shell .operational-runbook-experience-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.ag-app-shell .operational-runbook-experience-steps li {
  position: relative;
  display: grid;
  align-content: start;
  gap: .28rem;
  min-height: 8.6rem;
  padding: .78rem;
  border: 1px solid rgb(54 225 191 / .18);
  border-radius: .9rem;
  background: linear-gradient(145deg, rgb(7 27 36 / .56), rgb(2 9 22 / .7));
  box-shadow: var(--ag-container-shadow-inset);
}

body.ag-app-shell .operational-runbook-experience-steps li > span {
  color: #61f4d6;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .1em;
}
body.ag-app-shell .operational-runbook-experience-steps li > strong { color: #f7fbff; line-height: 1.25; }
body.ag-app-shell .operational-runbook-experience-steps li > small { color: rgb(181 203 220 / .72); line-height: 1.4; }

body.ag-app-shell .operational-runbook-search {
  --ag-container-glow-rgb: 61 184 255;
  padding: .9rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .34) !important;
  border-radius: var(--ag-radius-card);
  background: linear-gradient(145deg, rgb(5 17 33 / .86), rgb(2 8 20 / .9)) !important;
  box-shadow: var(--ag-container-shadow-card) !important;
}

body.ag-app-shell .operational-runbook-search .operational-search-entry {
  border-color: rgb(61 184 255 / .35);
  box-shadow:
    0 2px 5px rgb(0 0 0 / .28),
    0 14px 30px rgb(0 0 0 / .20),
    0 0 18px rgb(61 184 255 / .08),
    inset 0 1px 0 rgb(255 255 255 / .055),
    inset 0 -12px 22px rgb(0 0 0 / .07);
}

body.ag-app-shell .operational-runbook-quick-actions,
body.ag-app-shell .operational-runbook-starters {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: center;
  padding: .8rem .9rem;
  border: 1px solid rgb(216 92 255 / .22);
  border-radius: 1rem;
  background: rgb(5 15 29 / .68);
  box-shadow:
    0 12px 30px rgb(0 0 0 / .22),
    0 0 18px rgb(216 92 255 / .055),
    inset 0 1px 0 rgb(255 255 255 / .045),
    inset 0 -10px 20px rgb(0 0 0 / .06);
}

body.ag-app-shell .operational-runbook-starters > strong { color: #dd8cff; }
body.ag-app-shell .operational-runbook-starters a { color: #dff6ff; }

body.ag-app-shell .operational-runbook-journeys {
  --ag-container-glow-rgb: 146 119 255;
  display: grid;
  gap: 1rem;
}

body.ag-app-shell .operational-runbook-journeys-head p,
body.ag-app-shell .operational-runbook-exam-bridge p,
body.ag-app-shell .azure-runbook-next-path > div:first-child p {
  max-width: 58rem;
  margin: .45rem 0 0;
  color: rgb(190 208 228 / .76);
  line-height: 1.55;
}

body.ag-app-shell .operational-runbook-journey-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .8rem;
}

body.ag-app-shell .operational-runbook-journey-card {
  --ag-container-glow-rgb: 146 119 255;
  display: grid;
  align-content: start;
  gap: .55rem;
  min-height: 15.5rem;
  padding: 1rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .34);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 100% 0, rgb(var(--ag-container-glow-rgb) / .12), transparent 12rem),
    linear-gradient(145deg, rgb(8 18 38 / .86), rgb(3 9 23 / .94));
  box-shadow: var(--ag-container-shadow-card);
}

body.ag-app-shell .operational-runbook-journey-card:nth-child(2) { --ag-container-glow-rgb: 61 184 255; }
body.ag-app-shell .operational-runbook-journey-card:nth-child(3) { --ag-container-glow-rgb: 216 92 255; }
body.ag-app-shell .operational-runbook-journey-card:nth-child(4) { --ag-container-glow-rgb: 54 225 191; }

body.ag-app-shell .operational-runbook-journey-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
}
body.ag-app-shell .operational-runbook-journey-top small { color: rgb(185 203 224 / .66); }
body.ag-app-shell .operational-runbook-journey-card > strong { color: #f7fbff; font-size: 1.08rem; line-height: 1.32; }
body.ag-app-shell .operational-runbook-journey-card > p { margin: 0; color: rgb(188 205 225 / .76); line-height: 1.5; }

body.ag-app-shell .operational-runbook-journey-links {
  display: flex;
  flex-wrap: wrap;
  gap: .42rem;
  margin-top: auto;
}

body.ag-app-shell .operational-runbook-journey-links :is(a, button) {
  min-height: 2.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .4rem .62rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .27);
  border-radius: 999px;
  background: rgb(var(--ag-container-glow-rgb) / .075);
  color: #eaf8ff;
  text-decoration: none;
  font: inherit;
  font-size: .78rem;
  font-weight: 800;
  cursor: pointer;
}

body.ag-app-shell .operational-runbook-exam-bridge {
  --ag-container-glow-rgb: 54 225 191;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
}
body.ag-app-shell .operational-runbook-exam-bridge h2 { font-size: clamp(1.55rem, 3vw, 2.35rem); }
body.ag-app-shell .operational-runbook-exam-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; }

body.ag-app-shell .operational-runbook-workbench {
  --ag-container-glow-rgb: 61 184 255;
  grid-template-columns: minmax(14rem, .27fr) minmax(0, 1fr);
  gap: 1rem;
}

body.ag-app-shell .operational-runbook-filters,
body.ag-app-shell .operational-runbook-results {
  border: 1px solid rgb(61 184 255 / .22);
  border-radius: 1.05rem;
  background: linear-gradient(145deg, rgb(5 16 31 / .74), rgb(2 8 20 / .82));
  box-shadow: var(--ag-container-shadow-card);
}

body.ag-app-shell .operational-runbook-filters {
  padding: .85rem;
}
body.ag-app-shell .operational-runbook-filters > summary { padding: .2rem .1rem .65rem; }
body.ag-app-shell .operational-runbook-results { padding: .9rem; }

body.ag-app-shell .operational-runbook-row {
  --ag-container-glow-rgb: 61 184 255;
  position: relative;
  overflow: hidden;
  padding: .95rem 1rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .24);
  border-radius: .95rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-container-glow-rgb) / .065), transparent 13rem),
    linear-gradient(145deg, rgb(6 17 33 / .72), rgb(2 8 20 / .76));
  box-shadow: var(--ag-container-shadow-inset);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body.ag-app-shell .operational-runbook-row:nth-child(4n + 2) { --ag-container-glow-rgb: 146 119 255; }
body.ag-app-shell .operational-runbook-row:nth-child(4n + 3) { --ag-container-glow-rgb: 54 225 191; }
body.ag-app-shell .operational-runbook-row:nth-child(4n) { --ag-container-glow-rgb: 216 92 255; }
body.ag-app-shell .operational-runbook-row:hover,
body.ag-app-shell .operational-runbook-row:focus-visible,
body.ag-app-shell .operational-runbook-row.is-active {
  transform: translateY(-1px);
  border-color: rgb(var(--ag-container-glow-rgb) / .62);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-container-glow-rgb) / .12), transparent 15rem),
    linear-gradient(145deg, rgb(8 23 43 / .86), rgb(2 8 20 / .9));
  box-shadow:
    0 3px 7px rgb(0 0 0 / .3),
    0 18px 40px rgb(0 0 0 / .28),
    0 0 0 1px rgb(var(--ag-container-glow-rgb) / .12),
    0 0 25px rgb(var(--ag-container-glow-rgb) / .16),
    inset 0 1px 0 rgb(255 255 255 / .075),
    inset 0 -12px 22px rgb(0 0 0 / .08);
}

body.ag-app-shell .azure-runbooks-show-more {
  min-height: 3.1rem;
  border: 1px solid rgb(61 184 255 / .28);
  border-radius: .9rem;
  background: rgb(8 47 73 / .24);
  color: #dff7ff;
  box-shadow: var(--ag-container-shadow-inset);
}

body.ag-app-shell .operational-runbook-detail {
  --ag-container-glow-rgb: 61 184 255;
  display: grid;
  gap: 1rem;
}

body.ag-app-shell .azure-runbook-detail-hero,
body.ag-app-shell .azure-runbook-glance,
body.ag-app-shell .azure-runbook-detail-nav,
body.ag-app-shell .azure-runbook-detail-section,
body.ag-app-shell .azure-runbook-next-path {
  border-color: rgb(61 184 255 / .30);
  box-shadow: var(--ag-container-shadow-card);
}

body.ag-app-shell .azure-runbook-detail-hero {
  padding: clamp(1.05rem, 2.4vw, 1.55rem);
  border: 1px solid rgb(61 184 255 / .34);
  border-radius: 1.2rem;
  background:
    radial-gradient(circle at 0 0, rgb(61 184 255 / .12), transparent 20rem),
    radial-gradient(circle at 100% 0, rgb(146 119 255 / .1), transparent 18rem),
    linear-gradient(145deg, rgb(7 20 39 / .9), rgb(2 8 20 / .94));
}

body.ag-app-shell .azure-runbook-glance {
  border-radius: 1.15rem;
  background: linear-gradient(145deg, rgb(5 17 33 / .82), rgb(2 8 20 / .88));
}

body.ag-app-shell .azure-runbook-glance-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .7rem;
  border: 0;
}

body.ag-app-shell .azure-runbook-glance-grid article {
  --ag-container-glow-rgb: 61 184 255;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .23);
  border-radius: .9rem;
  background: rgb(3 12 27 / .66);
  box-shadow: var(--ag-container-shadow-inset);
}
body.ag-app-shell .azure-runbook-glance-grid article:nth-child(2) { --ag-container-glow-rgb: 54 225 191; }
body.ag-app-shell .azure-runbook-glance-grid article:nth-child(3) { --ag-container-glow-rgb: 216 92 255; }
body.ag-app-shell .azure-runbook-glance-grid article:nth-child(4) { --ag-container-glow-rgb: 146 119 255; }

body.ag-app-shell .azure-runbook-detail-nav {
  border: 1px solid rgb(61 184 255 / .26);
  background: rgb(2 8 20 / .9);
}

body.ag-app-shell .azure-runbook-detail-section {
  --ag-container-glow-rgb: 61 184 255;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .29);
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-container-glow-rgb) / .055), transparent 17rem),
    linear-gradient(145deg, rgb(6 17 34 / .78), rgb(2 8 20 / .86));
  box-shadow: var(--ag-container-shadow-card);
}
body.ag-app-shell .azure-runbook-detail-section:nth-child(2) { --ag-container-glow-rgb: 54 225 191; }
body.ag-app-shell .azure-runbook-detail-section:nth-child(3) { --ag-container-glow-rgb: 146 119 255; }
body.ag-app-shell .azure-runbook-detail-section:nth-child(4) { --ag-container-glow-rgb: 216 92 255; }
body.ag-app-shell .azure-runbook-detail-section:nth-child(5) { --ag-container-glow-rgb: 255 132 150; }
body.ag-app-shell .azure-runbook-detail-section:nth-child(6) { --ag-container-glow-rgb: 61 184 255; }

body.ag-app-shell .azure-runbook-detail-section > summary {
  padding: 1rem 1.1rem;
  box-shadow: inset 0 -1px 0 rgb(var(--ag-container-glow-rgb) / .08);
}

body.ag-app-shell .azure-runbook-detail-section[open] > summary {
  background: rgb(var(--ag-container-glow-rgb) / .045);
}

body.ag-app-shell .azure-runbook-detail-section-body {
  padding: 1rem;
}

body.ag-app-shell .azure-ops-section,
body.ag-app-shell .azure-ops-phase,
body.ag-app-shell .azure-ops-command-card,
body.ag-app-shell .azure-ops-query-card,
body.ag-app-shell .azure-ops-check-panel,
body.ag-app-shell .azure-ops-output-pattern-grid > article,
body.ag-app-shell .azure-ops-risk-grid > article,
body.ag-app-shell .azure-ops-input-grid > article,
body.ag-app-shell .azure-ops-link-card {
  border-radius: .95rem;
  box-shadow: var(--ag-container-shadow-inset);
}

body.ag-app-shell .azure-runbook-exam-connection {
  --ag-container-glow-rgb: 216 92 255;
  background:
    radial-gradient(circle at 0 0, rgb(216 92 255 / .10), transparent 18rem),
    linear-gradient(145deg, rgb(21 10 35 / .42), rgb(3 9 22 / .76));
}

body.ag-app-shell .azure-runbook-exam-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: .7rem;
}

body.ag-app-shell .azure-runbook-exam-card {
  --ag-container-glow-rgb: 216 92 255;
  display: grid;
  gap: .45rem;
  padding: .9rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .3);
  border-radius: .9rem;
  background: linear-gradient(145deg, rgb(23 10 38 / .45), rgb(3 9 22 / .72));
  box-shadow: var(--ag-container-shadow-inset);
}
body.ag-app-shell .azure-runbook-exam-card.is-current-exam { --ag-container-glow-rgb: 54 225 191; }
body.ag-app-shell .azure-runbook-exam-card strong { color: #f8fbff; line-height: 1.35; }
body.ag-app-shell .azure-runbook-exam-card p { margin: 0; color: rgb(193 210 229 / .75); line-height: 1.45; }
body.ag-app-shell .azure-runbook-exam-card > div { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: auto; }
body.ag-app-shell .azure-runbook-exam-card a {
  display: inline-flex;
  min-height: 2.1rem;
  align-items: center;
  padding: .38rem .58rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .25);
  border-radius: 999px;
  background: rgb(var(--ag-container-glow-rgb) / .075);
  color: #edfaff;
  text-decoration: none;
  font-size: .78rem;
  font-weight: 800;
}

body.ag-app-shell .azure-runbook-evidence-boundary {
  margin: .75rem 0 0;
  padding: .7rem .8rem;
  border-left: 3px solid rgb(216 92 255 / .7);
  border-radius: 0 .75rem .75rem 0;
  background: rgb(216 92 255 / .06);
  color: rgb(220 226 235 / .8);
  line-height: 1.5;
}

body.ag-app-shell .azure-runbook-next-path {
  --ag-container-glow-rgb: 54 225 191;
  display: grid;
  grid-template-columns: minmax(15rem, .65fr) minmax(0, 1.35fr);
  gap: 1rem;
  padding: clamp(1rem, 2.2vw, 1.35rem);
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .34);
  border-radius: 1.15rem;
  background:
    radial-gradient(circle at 0 0, rgb(54 225 191 / .09), transparent 18rem),
    linear-gradient(145deg, rgb(6 22 31 / .78), rgb(2 8 20 / .9));
}

body.ag-app-shell .azure-runbook-next-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
}

body.ag-app-shell .azure-runbook-next-grid > a {
  --ag-container-glow-rgb: 54 225 191;
  display: grid;
  align-content: start;
  gap: .38rem;
  padding: .85rem;
  border: 1px solid rgb(var(--ag-container-glow-rgb) / .25);
  border-radius: .9rem;
  background: rgb(3 14 25 / .68);
  color: inherit;
  text-decoration: none;
  box-shadow: var(--ag-container-shadow-inset);
}
body.ag-app-shell .azure-runbook-next-grid > a strong { color: #f8fbff; line-height: 1.3; }
body.ag-app-shell .azure-runbook-next-grid > a small { color: rgb(183 203 221 / .7); line-height: 1.42; }

body.ag-app-shell .azure-runbooks-shell.has-runbooks-js.is-detail-mode .operational-runbook-detail {
  width: 100% !important;
  margin: 0 auto !important;
}

@media (max-width: 1080px) {
  body.ag-app-shell .operational-runbook-journey-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.ag-app-shell .operational-runbook-experience { grid-template-columns: 1fr; }
  body.ag-app-shell .operational-runbook-experience-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.ag-app-shell .azure-runbook-glance-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.ag-app-shell .azure-runbook-next-path { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  body.ag-app-shell .operational-runbook-header-luxury,
  body.ag-app-shell .operational-runbook-exam-bridge,
  body.ag-app-shell .operational-runbook-workbench { grid-template-columns: 1fr; }
  body.ag-app-shell .operational-runbook-exam-actions { justify-content: flex-start; }
  body.ag-app-shell .operational-runbook-filters { position: static; }
  body.ag-app-shell .azure-runbook-next-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  :root {
    --ag-container-shadow-panel:
      0 2px 5px rgb(0 0 0 / .28),
      0 22px 54px rgb(0 0 0 / .34),
      0 0 0 1px rgb(var(--ag-container-glow-rgb) / .085),
      0 0 25px rgb(var(--ag-container-glow-rgb) / .11),
      inset 0 1px 0 rgb(255 255 255 / .075),
      inset 0 -16px 28px rgb(0 0 0 / .08);
    --ag-container-shadow-card:
      0 2px 4px rgb(0 0 0 / .25),
      0 13px 32px rgb(0 0 0 / .27),
      0 0 0 1px rgb(var(--ag-container-glow-rgb) / .07),
      0 0 18px rgb(var(--ag-container-glow-rgb) / .085),
      inset 0 1px 0 rgb(255 255 255 / .065),
      inset 0 -11px 20px rgb(0 0 0 / .065);
  }
  body.ag-app-shell .operational-runbook-header-copy h1 { font-size: clamp(2.65rem, 13vw, 4rem); }
  body.ag-app-shell .operational-runbook-journey-grid,
  body.ag-app-shell .operational-runbook-experience-steps,
  body.ag-app-shell .azure-runbook-glance-grid { grid-template-columns: 1fr; }
  body.ag-app-shell .operational-runbook-experience-steps li,
  body.ag-app-shell .operational-runbook-journey-card { min-height: 0; }
  body.ag-app-shell .operational-runbook-row { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell :where(
    .azure-search-landing-form,
    .search-workspace-form,
    .operational-search-entry,
    .exam-catalog-search,
    .azure-glossary-search-entry,
    .azure-learn-search
  ):focus-within::after {
    animation: none;
  }
  body.ag-app-shell :where(.operational-runbook-row, .operational-runbook-journey-card, .azure-runbook-next-grid > a) {
    transition: none;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell :where(
    .azure-search-landing-form,
    .search-workspace-form,
    .operational-search-entry,
    .exam-catalog-search,
    .azure-glossary-search-entry,
    .azure-learn-search,
    .operational-runbook-header-luxury,
    .operational-runbook-experience,
    .operational-runbook-journeys,
    .operational-runbook-exam-bridge,
    .operational-runbook-workbench,
    .operational-runbook-detail,
    .operational-runbook-row,
    .azure-runbook-detail-section,
    .azure-runbook-exam-card,
    .azure-runbook-next-grid > a
  ) {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    color: CanvasText !important;
    box-shadow: none !important;
  }
  body.ag-app-shell :where(
    .azure-search-landing-form,
    .search-workspace-form,
    .operational-search-entry,
    .exam-catalog-search,
    .azure-glossary-search-entry,
    .azure-learn-search
  ):focus-within {
    outline: 3px solid Highlight;
    outline-offset: 3px;
  }
  body.ag-app-shell :where(
    .azure-search-landing-form,
    .search-workspace-form,
    .operational-search-entry,
    .exam-catalog-search,
    .azure-glossary-search-entry,
    .azure-learn-search
  )::after {
    display: none;
  }
}

/* ========================================================================== 
   Magenta luxury closeout: unified search light, restrained type, term paging
   ========================================================================== */

:root {
  --ag-magenta-rgb: 216 92 255;
  --ag-fuchsia-rgb: 217 70 239;
  --ag-violet-deep-rgb: 126 34 206;
  --ag-search-neon-rgb: 102 224 255;
  --ag-search-neon-violet-rgb: 174 92 255;
}

/* One calmer display scale across the product. Large editorial type remains,
   but it no longer overwhelms the tools and reading surfaces below it. */
body.ag-app-shell .site-main :where(h1) {
  max-width: 20ch;
  font-size: clamp(2.15rem, 4.25vw, 3.9rem) !important;
  line-height: .98 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance;
}

body.ag-app-shell :where(
  .azure-search-landing-hero,
  .exam-catalog-hero,
  .reference-hub-hero,
  .operational-reference-header,
  .search-workspace-header,
  .learner-workspace-route-head
) h1 {
  max-width: 15ch;
  font-size: clamp(2.35rem, 4.5vw, 4rem) !important;
}

body.ag-app-shell :where(.azure-glossary-deep-term-header, .azure-glossary-term-hero-panel) h1 {
  max-width: 18ch;
  font-size: clamp(2.25rem, 3.9vw, 3.3rem) !important;
  line-height: 1 !important;
}

body.ag-app-shell :where(
  .diagnostic-workspace-stage .diagnostic-session-card h2,
  .diagnostic-session-question h2,
  [data-diagnostic-question-heading]
) {
  max-width: 46ch !important;
  margin-block: clamp(.85rem, 1.6vw, 1.2rem) .65rem !important;
  font-size: clamp(1.4rem, 1.9vw, 1.8rem) !important;
  line-height: 1.18 !important;
  letter-spacing: -.025em !important;
  text-wrap: pretty;
}

/* The reference shortcut rail needs visible breathing room around and inside
   every card instead of allowing the text to crowd the shared boundary. */
body.ag-app-shell .reference-shortcut-grid {
  gap: clamp(.8rem, 1.6vw, 1rem) !important;
  padding: clamp(1rem, 2vw, 1.4rem) !important;
  border-radius: 1.45rem;
}

body.ag-app-shell .reference-shortcut-grid > a {
  min-height: 8.25rem;
  padding: clamp(1.15rem, 2vw, 1.45rem) !important;
  border-radius: 1.15rem !important;
}

body.ag-app-shell .reference-shortcut-grid > a strong {
  margin-bottom: .25rem;
  line-height: 1.2;
}

body.ag-app-shell .reference-shortcut-grid > a span {
  line-height: 1.5;
}

/* Shared search-light contract. The input itself has no heavy solid outline;
   the component is defined by a quiet glass edge and blurred emitted light. */
body.ag-app-shell [data-ag-neon-search] {
  --ag-neon-rgb: var(--ag-search-neon-rgb);
  position: relative;
  isolation: isolate;
  overflow: visible !important;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .14) !important;
  border-radius: 1.35rem !important;
  background:
    radial-gradient(circle at 10% 0%, rgb(var(--ag-search-neon-rgb) / .07), transparent 21rem),
    radial-gradient(circle at 92% 15%, rgb(var(--ag-search-neon-violet-rgb) / .06), transparent 18rem),
    linear-gradient(145deg, rgb(3 13 29 / .94), rgb(2 8 20 / .98)) !important;
  box-shadow:
    0 2px 5px rgb(0 0 0 / .34),
    0 18px 44px rgb(0 0 0 / .28),
    0 0 0 1px rgb(var(--ag-search-neon-rgb) / .055),
    0 0 18px rgb(var(--ag-search-neon-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .055),
    inset 0 -12px 24px rgb(0 0 0 / .08) !important;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}

/* Replace the prior hard inner tube with one deliberately soft exterior ring. */
body.ag-app-shell [data-ag-neon-search]::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -4px;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .24);
  border-radius: calc(1.35rem + 4px);
  pointer-events: none;
  opacity: .34;
  filter: blur(1.8px);
  box-shadow:
    0 0 9px rgb(var(--ag-search-neon-rgb) / .20),
    0 0 23px rgb(var(--ag-search-neon-rgb) / .10),
    0 0 37px rgb(var(--ag-search-neon-violet-rgb) / .055);
  transition: opacity .18s ease, border-color .18s ease, box-shadow .18s ease, filter .18s ease;
}

body.ag-app-shell [data-ag-neon-search]:has(> input[type="search"])::before {
  content: "";
  position: absolute;
  z-index: 3;
  left: 1.15rem;
  top: 50%;
  width: 1.45rem;
  height: 1.45rem;
  translate: 0 -50%;
  background: rgb(174 239 255 / .92);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m21 21-4.35-4.35m2.35-5.65a8 8 0 1 1-16 0 8 8 0 0 1 16 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m21 21-4.35-4.35m2.35-5.65a8 8 0 1 1-16 0 8 8 0 0 1 16 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 0 5px rgb(var(--ag-search-neon-rgb) / .55)) drop-shadow(0 0 11px rgb(var(--ag-search-neon-rgb) / .24));
  pointer-events: none;
}

body.ag-app-shell [data-ag-neon-search] :where(input[type="search"], input[type="text"]) {
  min-width: 0;
  min-height: 3.85rem;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #f7fbff !important;
  box-shadow: none !important;
  caret-color: rgb(194 244 255);
}

body.ag-app-shell [data-ag-neon-search]:has(> input[type="search"]) > input[type="search"] {
  padding-inline-start: 3.65rem !important;
}

body.ag-app-shell [data-ag-neon-search] :where(input[type="search"], input[type="text"])::placeholder {
  color: rgb(163 181 207 / .72);
  opacity: 1;
}

body.ag-app-shell [data-ag-neon-search]:focus-within {
  border-color: rgb(199 244 255 / .34) !important;
  transform: translateY(-1px);
  box-shadow:
    0 3px 7px rgb(0 0 0 / .38),
    0 24px 54px rgb(0 0 0 / .34),
    0 0 0 1px rgb(var(--ag-search-neon-rgb) / .16),
    0 0 18px rgb(var(--ag-search-neon-rgb) / .24),
    0 0 42px rgb(var(--ag-search-neon-rgb) / .13),
    0 0 62px rgb(var(--ag-search-neon-violet-rgb) / .08),
    inset 0 1px 0 rgb(255 255 255 / .08),
    inset 0 0 18px rgb(var(--ag-search-neon-rgb) / .055),
    inset 0 -16px 28px rgb(0 0 0 / .11) !important;
}

body.ag-app-shell [data-ag-neon-search]:focus-within::after {
  inset: -5px;
  border-color: rgb(169 238 255 / .38);
  opacity: .66;
  filter: blur(2.15px);
  box-shadow:
    0 0 8px rgb(255 255 255 / .16),
    0 0 15px rgb(var(--ag-search-neon-rgb) / .32),
    0 0 34px rgb(var(--ag-search-neon-rgb) / .18),
    0 0 54px rgb(var(--ag-search-neon-violet-rgb) / .09);
  animation: ag-soft-neon-breathe 3.2s ease-in-out infinite;
}

body.ag-app-shell [data-ag-neon-search] :where(
  button[type="submit"],
  [data-command-search-submit],
  [data-compare-submit]
) {
  border: 1px solid rgb(232 196 255 / .42) !important;
  background:
    linear-gradient(135deg, #6336c8 0%, #a832d0 56%, #167d9b 100%) !important;
  color: #fff !important;
  box-shadow:
    0 14px 34px rgb(91 33 182 / .22),
    0 0 22px rgb(var(--ag-fuchsia-rgb) / .11),
    inset 0 1px 0 rgb(255 255 255 / .16) !important;
}

body.ag-app-shell [data-ag-neon-search] :where(
  button[type="submit"],
  [data-command-search-submit],
  [data-compare-submit]
):is(:hover, :focus-visible) {
  filter: brightness(1.08);
  border-color: rgb(245 221 255 / .66) !important;
  box-shadow:
    0 17px 39px rgb(91 33 182 / .28),
    0 0 28px rgb(var(--ag-fuchsia-rgb) / .18),
    inset 0 1px 0 rgb(255 255 255 / .2) !important;
}

@keyframes ag-soft-neon-breathe {
  0%, 100% { opacity: .66; }
  50% { opacity: .82; }
}

/* Definition paging: ten compact definition containers per request, server-side
   filtering, and URL-backed navigation rather than a 307-record browser dump. */
body.ag-app-shell .search-workspace-result-group.is-term-browser {
  display: grid;
  gap: 1rem;
}

body.ag-app-shell .search-term-refine {
  display: grid;
  grid-template-columns: minmax(13rem, .56fr) minmax(0, 1.44fr);
  gap: .85rem 1rem;
  align-items: center;
  padding: clamp(.9rem, 1.7vw, 1.15rem);
}

body.ag-app-shell .search-term-refine > label {
  display: grid;
  gap: .2rem;
  padding-inline: .25rem;
}

body.ag-app-shell .search-term-refine > label span {
  color: #f8fbff;
  font-weight: 900;
}

body.ag-app-shell .search-term-refine > label small,
body.ag-app-shell .search-term-refine > p {
  color: rgb(169 188 211 / .72);
  line-height: 1.45;
}

body.ag-app-shell .search-term-refine-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: .55rem;
  align-items: center;
  min-width: 0;
}

body.ag-app-shell .search-term-refine > p { grid-column: 1 / -1; margin: 0; }

body.ag-app-shell .search-term-refine-control > button {
  min-height: 3rem;
  border-radius: .9rem;
  padding-inline: .9rem;
  font-weight: 900;
}

body.ag-app-shell .search-term-refine-control > button.is-secondary {
  border: 1px solid rgb(var(--ag-magenta-rgb) / .26);
  background: rgb(var(--ag-violet-deep-rgb) / .16);
  color: #f4d7ff;
}

body.ag-app-shell .search-term-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  flex-wrap: wrap;
  padding: .95rem;
  border: 1px solid rgb(var(--ag-magenta-rgb) / .18);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 50% 0%, rgb(var(--ag-magenta-rgb) / .07), transparent 18rem),
    rgb(3 11 26 / .62);
  box-shadow:
    0 14px 34px rgb(0 0 0 / .18),
    inset 0 1px 0 rgb(255 255 255 / .045);
}

body.ag-app-shell .search-term-pagination-pages {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
  justify-content: center;
}

body.ag-app-shell .search-term-pagination button {
  min-width: 2.55rem;
  min-height: 2.55rem;
  border: 1px solid rgb(149 173 205 / .22);
  border-radius: .78rem;
  background: rgb(4 14 31 / .72);
  color: #dbe7f5;
  cursor: pointer;
  font-weight: 850;
}

body.ag-app-shell .search-term-pagination button[aria-current="page"] {
  border-color: rgb(var(--ag-magenta-rgb) / .58);
  background: linear-gradient(135deg, rgb(var(--ag-violet-deep-rgb) / .72), rgb(var(--ag-fuchsia-rgb) / .55));
  color: #fff;
  box-shadow: 0 0 18px rgb(var(--ag-fuchsia-rgb) / .16);
}

body.ag-app-shell .search-term-pagination button:disabled {
  opacity: .38;
  cursor: not-allowed;
}

body.ag-app-shell .search-term-pagination-ellipsis {
  color: rgb(169 188 211 / .58);
  padding-inline: .2rem;
}

/* Term-page top matter: denser information, even spacing, and a clear route
   from reference reading into evidence-based exam preparation. */
body.ag-app-shell .azure-glossary-deep-term-header {
  gap: clamp(.9rem, 1.8vw, 1.2rem);
  padding: clamp(1.35rem, 3vw, 2.1rem) !important;
}

body.ag-app-shell .azure-glossary-deep-term-header > :first-child { margin-top: 0; }
body.ag-app-shell .azure-glossary-deep-term-header > :last-child { margin-bottom: 0; }

body.ag-app-shell .azure-glossary-term-hero-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
  margin: 0;
}

body.ag-app-shell .azure-glossary-term-hero-metrics > div {
  --ag-container-glow-rgb: var(--ag-page-accent-rgb);
  min-width: 0;
  padding: .78rem .88rem;
  border: 1px solid rgb(var(--ag-page-accent-rgb) / .22);
  border-radius: .9rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-page-accent-rgb) / .075), transparent 10rem),
    rgb(3 13 28 / .58);
  box-shadow:
    0 11px 26px rgb(0 0 0 / .16),
    0 0 16px rgb(var(--ag-page-accent-rgb) / .035),
    inset 0 1px 0 rgb(255 255 255 / .045);
}

body.ag-app-shell .azure-glossary-term-hero-metrics :where(dt, dd) { margin: 0; }
body.ag-app-shell .azure-glossary-term-hero-metrics dt {
  color: rgb(161 188 211 / .72);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.ag-app-shell .azure-glossary-term-hero-metrics dd {
  margin-top: .24rem;
  color: #f8fbff;
  font-size: .9rem;
  font-weight: 800;
  line-height: 1.38;
}

body.ag-app-shell .azure-glossary-term-exam-bridge {
  --ag-container-glow-rgb: var(--ag-magenta-rgb);
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(17rem, .75fr);
  gap: 1rem;
  align-items: center;
  padding: clamp(1rem, 2vw, 1.3rem);
  border: 1px solid rgb(var(--ag-magenta-rgb) / .26);
  border-radius: 1.1rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-magenta-rgb) / .10), transparent 22rem),
    radial-gradient(circle at 100% 0, rgb(var(--ag-search-neon-rgb) / .065), transparent 18rem),
    linear-gradient(145deg, rgb(10 17 39 / .82), rgb(3 10 25 / .9));
  box-shadow:
    0 18px 42px rgb(0 0 0 / .22),
    0 0 24px rgb(var(--ag-magenta-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .055);
}

body.ag-app-shell .azure-glossary-term-exam-bridge h2 {
  margin: .18rem 0 .4rem;
  color: #f8fbff;
  font-size: clamp(1.35rem, 2.3vw, 1.9rem);
  letter-spacing: -.03em;
}

body.ag-app-shell .azure-glossary-term-exam-bridge p {
  margin: 0;
  color: rgb(192 207 225 / .78);
  line-height: 1.55;
}

body.ag-app-shell .azure-glossary-term-exam-actions {
  display: grid;
  gap: .55rem;
}

body.ag-app-shell .azure-glossary-term-exam-actions a {
  width: 100%;
  min-height: 2.75rem;
  text-align: center;
}

/* Retain warning semantics but render them in the requested violet/magenta
   family. No warm brown, amber, orange, or yellow presentation remains. */
body.ag-app-shell :where(
  .site-header-cta,
  .intent-button,
  .exam-card-v2.is-full-track,
  .account-status[data-tone="warning"],
  .mock-exam-debrief-gate.is-borderline .mock-debrief-hero > strong,
  .mock-debrief-objective.is-borderline,
  .learner-workspace-objective-list .is-building
) {
  --ag-container-glow-rgb: var(--ag-magenta-rgb);
}

@media (max-width: 880px) {
  body.ag-app-shell .search-term-refine,
  body.ag-app-shell .azure-glossary-term-exam-bridge {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell .azure-glossary-term-hero-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  body.ag-app-shell .site-main :where(h1) {
    font-size: clamp(2rem, 9vw, 3rem) !important;
  }
  body.ag-app-shell .search-term-refine-control {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell .search-term-pagination {
    justify-content: stretch;
  }
  body.ag-app-shell .search-term-pagination > button {
    flex: 1 1 auto;
  }
  body.ag-app-shell .search-term-pagination-pages {
    order: -1;
    width: 100%;
  }
  body.ag-app-shell .azure-glossary-term-hero-metrics {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell [data-ag-neon-search]:focus-within::after { animation: none; }
  body.ag-app-shell [data-ag-neon-search] { transition: none; }
}

@media (forced-colors: active) {
  body.ag-app-shell [data-ag-neon-search] {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    box-shadow: none !important;
  }
  body.ag-app-shell [data-ag-neon-search]::after,
  body.ag-app-shell [data-ag-neon-search]::before { display: none !important; }
  body.ag-app-shell [data-ag-neon-search]:focus-within {
    outline: 3px solid Highlight;
    outline-offset: 3px;
    transform: none;
  }
}

/* Exam search is a composed search card: information above, one shared neon
   tube below. The outer card stays quiet while the input receives focus. */
body.ag-app-shell .exam-catalog-search {
  --ag-container-glow-rgb: var(--ag-search-neon-rgb);
  display: grid;
  gap: 1rem;
  margin-top: clamp(1.1rem, 2.2vw, 1.55rem);
  padding: clamp(1rem, 2vw, 1.35rem) !important;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .18) !important;
  border-radius: 1.35rem !important;
  background:
    radial-gradient(circle at 0 0, rgb(var(--ag-search-neon-rgb) / .085), transparent 18rem),
    radial-gradient(circle at 100% 0, rgb(var(--ag-search-neon-violet-rgb) / .065), transparent 17rem),
    linear-gradient(145deg, rgb(5 18 37 / .86), rgb(2 9 23 / .94)) !important;
  box-shadow:
    0 3px 7px rgb(0 0 0 / .32),
    0 22px 48px rgb(0 0 0 / .27),
    0 0 22px rgb(var(--ag-search-neon-rgb) / .045),
    inset 0 1px 0 rgb(255 255 255 / .055),
    inset 0 -15px 30px rgb(0 0 0 / .08) !important;
}

body.ag-app-shell .exam-catalog-search:focus-within {
  border-color: rgb(var(--ag-search-neon-rgb) / .23) !important;
  transform: none !important;
  background-color: transparent !important;
  box-shadow:
    0 3px 7px rgb(0 0 0 / .34),
    0 24px 54px rgb(0 0 0 / .30),
    0 0 25px rgb(var(--ag-search-neon-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .06),
    inset 0 -15px 30px rgb(0 0 0 / .09) !important;
}

body.ag-app-shell .exam-catalog-search-heading {
  display: flex;
  align-items: center;
  gap: .85rem;
}

body.ag-app-shell .exam-catalog-search-heading > span:last-child {
  display: grid;
  gap: .12rem;
}

body.ag-app-shell .exam-catalog-search-heading strong {
  color: #f8fbff;
  font-size: clamp(1.05rem, 1.7vw, 1.25rem);
  line-height: 1.2;
}

body.ag-app-shell .exam-catalog-search-heading small {
  color: rgb(173 193 217 / .76);
  font-size: .86rem;
  line-height: 1.4;
}

body.ag-app-shell .exam-catalog-search-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 2.45rem;
  height: 2.45rem;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .28);
  border-radius: .9rem;
  background:
    radial-gradient(circle at 28% 20%, rgb(255 255 255 / .10), transparent 55%),
    linear-gradient(145deg, rgb(18 91 132 / .42), rgb(var(--ag-violet-deep-rgb) / .20));
  box-shadow:
    0 8px 20px rgb(0 0 0 / .21),
    0 0 16px rgb(var(--ag-search-neon-rgb) / .065),
    inset 0 1px 0 rgb(255 255 255 / .08);
}

body.ag-app-shell .exam-catalog-search-icon::before {
  content: "";
  width: 1.25rem;
  height: 1.25rem;
  background: rgb(178 240 255 / .94);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m21 21-4.35-4.35m2.35-5.65a8 8 0 1 1-16 0 8 8 0 0 1 16 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m21 21-4.35-4.35m2.35-5.65a8 8 0 1 1-16 0 8 8 0 0 1 16 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 0 6px rgb(var(--ag-search-neon-rgb) / .48));
}

body.ag-app-shell .exam-catalog-search-control {
  width: 100%;
}

body.ag-app-shell .exam-catalog-search-control [data-exam-catalog-clear] {
  margin-right: .55rem;
  border: 1px solid rgb(var(--ag-magenta-rgb) / .28);
  border-radius: .75rem;
  background: rgb(var(--ag-violet-deep-rgb) / .18);
  color: #f5dcff;
}

@media (max-width: 620px) {
  body.ag-app-shell .exam-catalog-search {
    padding: .95rem !important;
  }

  body.ag-app-shell .exam-catalog-search-heading {
    align-items: flex-start;
  }
}

/* ========================================================================== 
   Glass depth closeout: full-width search, softer reset controls, runbook load
   ========================================================================== */

/* The Reference sidecar is one deliberate glass object, not six cards pressed
   against a parent edge. Light originates beneath the glass and fades upward. */
body.ag-app-shell .reference-hub-sidecar {
  --ag-container-glow-rgb: var(--ag-magenta-rgb);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  align-self: stretch;
  padding: clamp(1.25rem, 2.45vw, 1.7rem);
  gap: clamp(.95rem, 1.8vw, 1.2rem);
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .20);
  border-radius: 1.45rem;
  background:
    linear-gradient(145deg, rgb(8 21 43 / .72), rgb(3 10 25 / .88)),
    radial-gradient(circle at 12% 100%, rgb(var(--ag-search-neon-rgb) / .11), transparent 17rem),
    radial-gradient(circle at 88% 100%, rgb(var(--ag-magenta-rgb) / .10), transparent 17rem);
  -webkit-backdrop-filter: blur(18px) saturate(128%);
  backdrop-filter: blur(18px) saturate(128%);
  box-shadow:
    0 4px 9px rgb(0 0 0 / .34),
    0 28px 66px rgb(0 0 0 / .31),
    0 0 0 1px rgb(var(--ag-search-neon-rgb) / .055),
    0 0 28px rgb(var(--ag-search-neon-rgb) / .055),
    inset 0 1px 0 rgb(255 255 255 / .07),
    inset 0 -22px 42px rgb(0 0 0 / .12);
}

body.ag-app-shell .reference-hub-sidecar::before,
body.ag-app-shell .reference-hub-sidecar::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -4.8rem;
  width: 15rem;
  height: 8rem;
  border-radius: 50%;
  filter: blur(28px);
  pointer-events: none;
}
body.ag-app-shell .reference-hub-sidecar::before {
  left: -2rem;
  background: rgb(var(--ag-search-neon-rgb) / .20);
}
body.ag-app-shell .reference-hub-sidecar::after {
  right: -2rem;
  background: rgb(var(--ag-magenta-rgb) / .18);
}

body.ag-app-shell .reference-hub-sidecard,
body.ag-app-shell .reference-hub-stat-grid {
  position: relative;
  z-index: 1;
}

body.ag-app-shell .reference-hub-sidecard {
  padding: clamp(1.2rem, 2.25vw, 1.55rem);
}

body.ag-app-shell .reference-hub-stat-grid {
  gap: clamp(.75rem, 1.4vw, 1rem);
}

body.ag-app-shell .reference-hub-stat-grid > div {
  min-height: 6.8rem;
  padding: clamp(1rem, 1.8vw, 1.28rem);
  background:
    radial-gradient(circle at 12% 100%, rgb(var(--ag-search-neon-rgb) / .075), transparent 9rem),
    radial-gradient(circle at 88% 100%, rgb(var(--ag-magenta-rgb) / .065), transparent 9rem),
    linear-gradient(145deg, rgb(5 16 34 / .82), rgb(2 8 21 / .92));
}

/* Every search shell owns the full available measure. Individual pages may
   arrange supporting copy around it, but the actual search component must not
   be constrained to a random percentage of its container. */
body.ag-app-shell [data-ag-neon-search] {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  box-sizing: border-box;
}

body.ag-app-shell :where(
  .azure-search-landing-form,
  .search-workspace-form,
  .operational-command-search,
  .operational-runbook-search,
  .operational-resource-graph-search,
  .operational-compare-search,
  .exam-catalog-search,
  .azure-glossary-search-entry,
  .azure-learn-search,
  .labs-guide-search
) {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  box-sizing: border-box;
}

body.ag-app-shell .operational-search-entry {
  grid-template-columns: minmax(0, 1fr) auto !important;
  width: 100% !important;
  max-width: none !important;
}

body.ag-app-shell .operational-search-entry > input {
  width: 100% !important;
  min-width: 0 !important;
}

body.ag-app-shell .operational-search-entry > button[type="submit"] {
  min-width: clamp(10rem, 14vw, 13rem);
  margin: .12rem;
  border-radius: 1rem !important;
}

/* Runbook search gets a glass tray with deeper outside padding and two low,
   blurred light sources. The neon tube remains the functional focus target. */
body.ag-app-shell .operational-runbook-search {
  --ag-container-glow-rgb: var(--ag-search-neon-rgb);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  gap: .9rem;
  padding: clamp(1.2rem, 2.45vw, 1.65rem) !important;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .22) !important;
  border-radius: 1.55rem !important;
  background:
    radial-gradient(circle at 8% 115%, rgb(var(--ag-search-neon-rgb) / .16), transparent 22rem),
    radial-gradient(circle at 92% 115%, rgb(var(--ag-magenta-rgb) / .14), transparent 22rem),
    linear-gradient(145deg, rgb(8 22 43 / .78), rgb(3 10 24 / .92)) !important;
  -webkit-backdrop-filter: blur(18px) saturate(132%);
  backdrop-filter: blur(18px) saturate(132%);
  box-shadow:
    0 4px 9px rgb(0 0 0 / .34),
    0 28px 68px rgb(0 0 0 / .32),
    0 0 0 1px rgb(var(--ag-search-neon-rgb) / .06),
    0 0 32px rgb(var(--ag-search-neon-rgb) / .065),
    inset 0 1px 0 rgb(255 255 255 / .075),
    inset 0 -24px 44px rgb(0 0 0 / .13) !important;
}

body.ag-app-shell .operational-runbook-search::before,
body.ag-app-shell .operational-runbook-search::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -5rem;
  width: 18rem;
  height: 8rem;
  border-radius: 50%;
  filter: blur(32px);
  pointer-events: none;
}
body.ag-app-shell .operational-runbook-search::before {
  left: 4%;
  background: rgb(var(--ag-search-neon-rgb) / .24);
}
body.ag-app-shell .operational-runbook-search::after {
  right: 4%;
  background: rgb(var(--ag-magenta-rgb) / .20);
}

body.ag-app-shell .operational-runbook-search > * {
  position: relative;
  z-index: 1;
}

body.ag-app-shell .operational-runbook-search .operational-safety-note {
  margin: 0;
  padding-inline: .2rem;
  color: rgb(184 202 225 / .78);
}

/* Search clear/reset actions use the same dark glass, cyan edge, and restrained
   violet reflection as the surrounding search component. */
body.ag-app-shell :where(
  [data-ops-reset-filters],
  [data-rg-reset],
  [data-command-reset],
  [data-glossary-reset],
  [data-glossary-clear-path],
  [data-glossary-empty-reset],
  [data-glossary-empty-clear-filters],
  [data-compare-reset],
  [data-exam-catalog-clear],
  [data-search-term-refine-clear],
  [data-practice-clear-filters],
  [data-labs-reset]
) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 2.75rem;
  padding: .58rem .9rem !important;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .24) !important;
  border-radius: .9rem !important;
  background:
    radial-gradient(circle at 20% 0, rgb(var(--ag-search-neon-rgb) / .10), transparent 8rem),
    radial-gradient(circle at 85% 100%, rgb(var(--ag-magenta-rgb) / .10), transparent 8rem),
    linear-gradient(145deg, rgb(10 27 49 / .78), rgb(5 13 30 / .90)) !important;
  color: #eaf8ff !important;
  font-weight: 850;
  line-height: 1.1;
  text-decoration: none;
  box-shadow:
    0 3px 7px rgb(0 0 0 / .28),
    0 12px 28px rgb(0 0 0 / .22),
    0 0 16px rgb(var(--ag-search-neon-rgb) / .045),
    inset 0 1px 0 rgb(255 255 255 / .08),
    inset 0 -9px 17px rgb(0 0 0 / .08) !important;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body.ag-app-shell :where(
  [data-ops-reset-filters],
  [data-rg-reset],
  [data-command-reset],
  [data-glossary-reset],
  [data-glossary-clear-path],
  [data-glossary-empty-reset],
  [data-glossary-empty-clear-filters],
  [data-compare-reset],
  [data-exam-catalog-clear],
  [data-search-term-refine-clear],
  [data-practice-clear-filters],
  [data-labs-reset]
):is(:hover, :focus-visible) {
  transform: translateY(-1px);
  outline: none;
  border-color: rgb(var(--ag-search-neon-rgb) / .48) !important;
  background:
    radial-gradient(circle at 20% 0, rgb(var(--ag-search-neon-rgb) / .15), transparent 9rem),
    radial-gradient(circle at 85% 100%, rgb(var(--ag-magenta-rgb) / .15), transparent 9rem),
    linear-gradient(145deg, rgb(12 34 60 / .88), rgb(10 16 39 / .94)) !important;
  box-shadow:
    0 4px 8px rgb(0 0 0 / .31),
    0 16px 34px rgb(0 0 0 / .27),
    0 0 20px rgb(var(--ag-search-neon-rgb) / .09),
    0 0 28px rgb(var(--ag-magenta-rgb) / .06),
    inset 0 1px 0 rgb(255 255 255 / .10) !important;
}

body.ag-app-shell .operational-glass-reset > span:first-child {
  display: grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .18);
  border-radius: .55rem;
  background: rgb(var(--ag-search-neon-rgb) / .06);
  color: rgb(202 246 255);
  font-size: 1.05rem;
  line-height: 1;
}

/* The finder is a stable two-column grid at wide sizes. Removing the sticky
   filter panel prevents the filter and results cards from visually colliding. */
body.ag-app-shell .operational-runbook-workbench {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-template-columns: minmax(17rem, .34fr) minmax(0, 1fr) !important;
  align-items: start !important;
  gap: clamp(1rem, 2vw, 1.35rem) !important;
  padding: clamp(1.1rem, 2.35vw, 1.6rem) !important;
  background:
    radial-gradient(circle at 4% 105%, rgb(var(--ag-search-neon-rgb) / .10), transparent 24rem),
    radial-gradient(circle at 96% 105%, rgb(var(--ag-magenta-rgb) / .09), transparent 24rem),
    linear-gradient(145deg, rgb(7 19 38 / .82), rgb(3 9 23 / .93)) !important;
}

body.ag-app-shell .operational-runbook-workbench::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: auto 8% -5rem;
  height: 8rem;
  border-radius: 50%;
  background: linear-gradient(90deg, rgb(var(--ag-search-neon-rgb) / .16), rgb(var(--ag-magenta-rgb) / .13));
  filter: blur(34px);
  pointer-events: none;
}

body.ag-app-shell .operational-runbook-filters,
body.ag-app-shell .operational-runbook-results {
  position: relative !important;
  top: auto !important;
  min-width: 0;
  height: auto !important;
  margin: 0 !important;
  padding: clamp(1rem, 1.8vw, 1.25rem) !important;
  overflow: visible !important;
  border-color: rgb(var(--ag-search-neon-rgb) / .20) !important;
  background:
    radial-gradient(circle at 8% 100%, rgb(var(--ag-search-neon-rgb) / .065), transparent 16rem),
    radial-gradient(circle at 92% 100%, rgb(var(--ag-magenta-rgb) / .055), transparent 16rem),
    linear-gradient(145deg, rgb(5 17 34 / .78), rgb(2 8 20 / .89)) !important;
  box-shadow:
    0 3px 7px rgb(0 0 0 / .30),
    0 18px 42px rgb(0 0 0 / .25),
    0 0 18px rgb(var(--ag-search-neon-rgb) / .04),
    inset 0 1px 0 rgb(255 255 255 / .06),
    inset 0 -16px 28px rgb(0 0 0 / .09) !important;
}

body.ag-app-shell .operational-runbook-filters > summary {
  padding: .15rem .1rem .85rem !important;
}

body.ag-app-shell .operational-results-heading {
  align-items: center;
  padding: 0 0 1rem;
}

body.ag-app-shell .operational-runbook-search-loading,
body.ag-app-shell .operational-runbook-load-error {
  display: grid;
  gap: .65rem;
  padding: 1.15rem;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .18);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 0 100%, rgb(var(--ag-search-neon-rgb) / .075), transparent 13rem),
    linear-gradient(145deg, rgb(5 17 34 / .72), rgb(2 8 20 / .82));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .05);
}

body.ag-app-shell .operational-runbook-load-error > button {
  width: fit-content;
  min-height: 2.6rem;
  padding: .55rem .85rem;
  border: 1px solid rgb(var(--ag-search-neon-rgb) / .28);
  border-radius: .85rem;
  background: linear-gradient(145deg, rgb(13 42 68 / .72), rgb(var(--ag-violet-deep-rgb) / .22));
  color: #eefaff;
  font-weight: 850;
  cursor: pointer;
}

@media (max-width: 980px) {
  body.ag-app-shell .operational-runbook-workbench {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 680px) {
  body.ag-app-shell .operational-runbook-search,
  body.ag-app-shell .operational-runbook-workbench,
  body.ag-app-shell .reference-hub-sidecar {
    padding: .95rem !important;
  }

  body.ag-app-shell .operational-search-entry {
    grid-template-columns: 1fr !important;
  }

  body.ag-app-shell .operational-search-entry > button[type="submit"] {
    width: 100%;
    min-width: 0;
    margin: 0;
  }

  body.ag-app-shell .operational-results-heading {
    display: grid;
    align-items: start;
  }

  body.ag-app-shell .operational-glass-reset {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell :where(
    [data-ops-reset-filters],
    [data-rg-reset],
    [data-command-reset],
    [data-glossary-reset],
    [data-glossary-clear-path],
    [data-glossary-empty-reset],
    [data-glossary-empty-clear-filters],
    [data-compare-reset],
    [data-exam-catalog-clear],
    [data-search-term-refine-clear],
    [data-practice-clear-filters],
    [data-labs-reset]
  ) {
    transition: none;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell :where(
    .reference-hub-sidecar,
    .operational-runbook-search,
    .operational-runbook-workbench,
    .operational-runbook-filters,
    .operational-runbook-results,
    [data-ops-reset-filters],
    [data-rg-reset],
    [data-command-reset],
    [data-glossary-reset],
    [data-glossary-clear-path],
    [data-glossary-empty-reset],
    [data-glossary-empty-clear-filters],
    [data-compare-reset],
    [data-exam-catalog-clear],
    [data-search-term-refine-clear],
    [data-practice-clear-filters],
    [data-labs-reset]
  ) {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    color: CanvasText !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
}

/* ========================================================================== 
   Command-group and Guided Runbook luxury pass
   Stable semantic selectors only; no release/build handshake.
   ========================================================================== */
@media screen {
  /* Command group routes: create a deliberate hierarchy instead of one long
     undifferentiated command wall. */
  body.ag-app-shell.operational-reference-commands-page .azure-command-center-layout {
    gap: clamp(1.15rem, 2.2vw, 1.65rem);
  }

  body.ag-app-shell .is-command-group-route .operational-reference-header {
    padding: clamp(1.25rem, 2.6vw, 1.8rem);
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .22);
    border-radius: 1.35rem;
    background:
      radial-gradient(circle at 4% 0%, rgb(var(--ag-search-neon-rgb) / .10), transparent 21rem),
      radial-gradient(circle at 96% 100%, rgb(var(--ag-magenta-rgb) / .08), transparent 22rem),
      linear-gradient(145deg, rgb(5 18 36 / .83), rgb(2 8 21 / .94));
    box-shadow:
      0 4px 10px rgb(0 0 0 / .30),
      0 24px 58px rgb(0 0 0 / .25),
      0 0 24px rgb(var(--ag-search-neon-rgb) / .05),
      inset 0 1px 0 rgb(255 255 255 / .065),
      inset 0 -20px 35px rgb(0 0 0 / .10);
    backdrop-filter: blur(18px) saturate(126%);
    -webkit-backdrop-filter: blur(18px) saturate(126%);
  }

  body.ag-app-shell .operational-command-group-luxury {
    --ag-container-glow-rgb: var(--ag-search-neon-rgb);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(17rem, .65fr);
    gap: clamp(1.05rem, 2.1vw, 1.5rem);
    align-items: stretch;
    padding: clamp(1.35rem, 2.8vw, 2rem) !important;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .28) !important;
    border-radius: 1.5rem !important;
    background:
      radial-gradient(circle at 0 0, rgb(var(--ag-search-neon-rgb) / .14), transparent 25rem),
      radial-gradient(circle at 100% 100%, rgb(var(--ag-magenta-rgb) / .11), transparent 25rem),
      linear-gradient(140deg, rgb(7 23 44 / .84), rgb(3 10 25 / .95)) !important;
    box-shadow:
      0 5px 12px rgb(0 0 0 / .34),
      0 28px 70px rgb(0 0 0 / .27),
      0 0 0 1px rgb(var(--ag-search-neon-rgb) / .055),
      0 0 30px rgb(var(--ag-search-neon-rgb) / .06),
      inset 0 1px 0 rgb(255 255 255 / .08),
      inset 0 -26px 44px rgb(0 0 0 / .12) !important;
    backdrop-filter: blur(20px) saturate(132%);
    -webkit-backdrop-filter: blur(20px) saturate(132%);
  }

  body.ag-app-shell .operational-command-group-luxury::before,
  body.ag-app-shell .operational-command-group-starters::before,
  body.ag-app-shell .operational-command-library::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: auto 8% -4.6rem;
    height: 7.5rem;
    border-radius: 50%;
    background: linear-gradient(90deg, rgb(var(--ag-search-neon-rgb) / .15), rgb(var(--ag-magenta-rgb) / .12));
    filter: blur(34px);
    pointer-events: none;
  }

  body.ag-app-shell .operational-command-group-copy {
    display: grid;
    align-content: center;
    gap: .75rem;
    min-width: 0;
  }

  body.ag-app-shell .operational-command-group-copy h2 {
    max-width: 18ch;
    margin: 0;
    color: #f8fbff;
    font-family: var(--lux-serif, Georgia, 'Times New Roman', serif);
    font-size: clamp(2rem, 4.2vw, 3.4rem);
    line-height: 1;
    letter-spacing: -.045em;
  }

  body.ag-app-shell .operational-command-group-copy > p:not(.operational-reference-meta) {
    max-width: 64rem;
    margin: 0;
    color: rgb(200 216 234 / .80);
    font-size: clamp(.98rem, 1.35vw, 1.08rem);
    line-height: 1.62;
  }

  body.ag-app-shell .operational-command-group-copy .operational-reference-meta {
    width: fit-content;
    margin: .1rem 0 0;
    padding: .55rem .72rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .16);
    border-radius: .8rem;
    background: rgb(3 12 28 / .55);
    color: rgb(184 207 228 / .76);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
  }

  body.ag-app-shell .operational-command-group-actions {
    margin-top: .15rem;
    gap: .55rem;
  }

  body.ag-app-shell .operational-command-group-actions > a {
    min-height: 2.65rem;
    padding: .62rem .85rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .24);
    border-radius: .85rem;
    background:
      radial-gradient(circle at 12% 0%, rgb(var(--ag-search-neon-rgb) / .09), transparent 8rem),
      linear-gradient(145deg, rgb(8 35 59 / .64), rgb(18 13 45 / .62));
    color: #eaf9ff;
    box-shadow:
      0 7px 18px rgb(0 0 0 / .20),
      inset 0 1px 0 rgb(255 255 255 / .075);
  }

  body.ag-app-shell .operational-command-group-actions > a:hover,
  body.ag-app-shell .operational-command-group-actions > a:focus-visible {
    transform: translateY(-1px);
    border-color: rgb(var(--ag-search-neon-rgb) / .52);
    box-shadow:
      0 10px 24px rgb(0 0 0 / .24),
      0 0 20px rgb(var(--ag-search-neon-rgb) / .10),
      inset 0 1px 0 rgb(255 255 255 / .10);
    outline: none;
  }

  body.ag-app-shell .operational-command-group-snapshot {
    display: grid;
    align-content: start;
    gap: .8rem;
    min-width: 0;
    padding: clamp(1rem, 2vw, 1.3rem);
    border: 1px solid rgb(var(--ag-magenta-rgb) / .22);
    border-radius: 1.2rem;
    background:
      radial-gradient(circle at 100% 0%, rgb(var(--ag-magenta-rgb) / .13), transparent 17rem),
      radial-gradient(circle at 0 100%, rgb(var(--ag-search-neon-rgb) / .075), transparent 16rem),
      linear-gradient(145deg, rgb(10 18 40 / .72), rgb(3 9 23 / .90));
    box-shadow:
      0 4px 9px rgb(0 0 0 / .28),
      0 18px 40px rgb(0 0 0 / .23),
      0 0 22px rgb(var(--ag-magenta-rgb) / .045),
      inset 0 1px 0 rgb(255 255 255 / .065),
      inset 0 -14px 24px rgb(0 0 0 / .10);
    backdrop-filter: blur(16px) saturate(128%);
    -webkit-backdrop-filter: blur(16px) saturate(128%);
  }

  body.ag-app-shell .operational-command-group-snapshot > span {
    color: rgb(201 238 255 / .82);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
  }

  body.ag-app-shell .operational-command-group-snapshot dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
    margin: 0;
  }

  body.ag-app-shell .operational-command-group-snapshot dl > div {
    min-width: 0;
    padding: .78rem .82rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .15);
    border-radius: .9rem;
    background: linear-gradient(145deg, rgb(4 17 35 / .62), rgb(3 9 22 / .74));
    box-shadow:
      0 9px 20px rgb(0 0 0 / .18),
      inset 0 1px 0 rgb(255 255 255 / .045);
  }

  body.ag-app-shell .operational-command-group-snapshot dt,
  body.ag-app-shell .operational-command-group-snapshot dd {
    margin: 0;
  }

  body.ag-app-shell .operational-command-group-snapshot dt {
    color: rgb(167 191 216 / .72);
    font-size: .67rem;
    font-weight: 850;
    letter-spacing: .075em;
    text-transform: uppercase;
  }

  body.ag-app-shell .operational-command-group-snapshot dd {
    margin-top: .25rem;
    overflow-wrap: anywhere;
    color: #f7fbff;
    font-size: clamp(1rem, 1.7vw, 1.25rem);
    font-weight: 900;
    line-height: 1.2;
  }

  body.ag-app-shell .operational-command-group-disclosure {
    grid-column: 1 / -1;
    overflow: hidden;
    margin: 0;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .16);
    border-radius: 1.05rem;
    background: rgb(2 10 24 / .50);
    box-shadow:
      0 12px 28px rgb(0 0 0 / .18),
      inset 0 1px 0 rgb(255 255 255 / .045);
  }

  body.ag-app-shell .operational-command-group-disclosure > summary {
    padding: .9rem 1rem;
    color: #ddf7ff;
    font-weight: 850;
    cursor: pointer;
  }

  body.ag-app-shell .operational-command-group-disclosure[open] > summary {
    border-bottom: 1px solid rgb(var(--ag-search-neon-rgb) / .12);
    background: linear-gradient(90deg, rgb(var(--ag-search-neon-rgb) / .05), rgb(var(--ag-magenta-rgb) / .035));
  }

  body.ag-app-shell .operational-command-group-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
    padding: 1rem;
  }

  body.ag-app-shell .operational-command-group-details > section {
    min-width: 0;
    padding: .9rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .14);
    border-radius: .9rem;
    background:
      radial-gradient(circle at 0 0, rgb(var(--ag-search-neon-rgb) / .055), transparent 12rem),
      linear-gradient(145deg, rgb(5 17 34 / .62), rgb(2 8 20 / .72));
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
  }

  body.ag-app-shell .operational-command-group-details h3 {
    margin: 0 0 .45rem;
    color: #f5faff;
    font-size: .9rem;
  }

  body.ag-app-shell .operational-command-group-details p {
    margin: 0;
    color: rgb(184 205 226 / .75);
    line-height: 1.55;
  }

  body.ag-app-shell .operational-command-group-starters,
  body.ag-app-shell .operational-command-library {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(1.25rem, 2.5vw, 1.75rem) !important;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .22) !important;
    border-radius: 1.35rem !important;
    background:
      radial-gradient(circle at 3% 102%, rgb(var(--ag-search-neon-rgb) / .09), transparent 23rem),
      radial-gradient(circle at 97% 102%, rgb(var(--ag-magenta-rgb) / .075), transparent 24rem),
      linear-gradient(145deg, rgb(5 17 34 / .80), rgb(2 8 20 / .93)) !important;
    box-shadow:
      0 4px 10px rgb(0 0 0 / .30),
      0 24px 58px rgb(0 0 0 / .24),
      0 0 24px rgb(var(--ag-search-neon-rgb) / .045),
      inset 0 1px 0 rgb(255 255 255 / .06),
      inset 0 -22px 38px rgb(0 0 0 / .10) !important;
    backdrop-filter: blur(18px) saturate(124%);
    -webkit-backdrop-filter: blur(18px) saturate(124%);
  }

  body.ag-app-shell .operational-command-group-starters-head {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(18rem, 1.1fr);
    gap: 1rem;
    align-items: end;
    margin-bottom: 1rem;
  }

  body.ag-app-shell .operational-command-group-starters-head h2 {
    margin: .2rem 0 0;
    color: #f8fbff;
    font-size: clamp(1.35rem, 2.3vw, 1.85rem);
  }

  body.ag-app-shell .operational-command-group-starters-head > p {
    margin: 0;
    color: rgb(183 204 225 / .76);
    line-height: 1.55;
  }

  body.ag-app-shell .operational-command-starter-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
  }

  body.ag-app-shell .operational-command-starter-list > button {
    display: grid;
    gap: .4rem;
    min-width: 0;
    min-height: 7rem;
    padding: .95rem 1rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .18);
    border-radius: 1rem;
    background:
      radial-gradient(circle at 0 0, rgb(var(--ag-search-neon-rgb) / .07), transparent 13rem),
      linear-gradient(145deg, rgb(5 17 34 / .68), rgb(2 8 20 / .82));
    color: inherit;
    text-align: left;
    box-shadow:
      0 12px 28px rgb(0 0 0 / .19),
      inset 0 1px 0 rgb(255 255 255 / .05);
  }

  body.ag-app-shell .operational-command-starter-list > button:nth-child(4n + 2),
  body.ag-app-shell .operational-command-starter-list > button:nth-child(4n + 3) {
    border-color: rgb(var(--ag-magenta-rgb) / .18);
    background:
      radial-gradient(circle at 100% 0, rgb(var(--ag-magenta-rgb) / .065), transparent 13rem),
      linear-gradient(145deg, rgb(12 13 38 / .66), rgb(2 8 20 / .82));
  }

  body.ag-app-shell .operational-command-starter-list > button:hover,
  body.ag-app-shell .operational-command-starter-list > button:focus-visible {
    transform: translateY(-1px);
    border-color: rgb(var(--ag-search-neon-rgb) / .48);
    box-shadow:
      0 16px 36px rgb(0 0 0 / .24),
      0 0 22px rgb(var(--ag-search-neon-rgb) / .08),
      inset 0 1px 0 rgb(255 255 255 / .07);
    outline: none;
  }

  body.ag-app-shell .operational-command-starter-list code {
    overflow-wrap: anywhere;
    color: #baf3ff;
    font-size: .88rem;
  }

  body.ag-app-shell .operational-command-starter-list span {
    color: #edf6ff;
    font-weight: 800;
    line-height: 1.4;
  }

  body.ag-app-shell .operational-command-starter-list small {
    color: rgb(164 187 211 / .68);
  }

  body.ag-app-shell .operational-command-library .operational-command-search {
    display: grid;
    gap: .9rem;
    padding: clamp(1rem, 2vw, 1.3rem);
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .17);
    border-radius: 1.1rem;
    background:
      radial-gradient(circle at 0 100%, rgb(var(--ag-search-neon-rgb) / .065), transparent 16rem),
      linear-gradient(145deg, rgb(4 15 31 / .67), rgb(2 8 20 / .79));
    box-shadow:
      0 14px 34px rgb(0 0 0 / .20),
      inset 0 1px 0 rgb(255 255 255 / .05);
  }

  body.ag-app-shell .operational-command-library .operational-tool-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  body.ag-app-shell .operational-command-library .operational-tool-heading h2 {
    margin: 0;
    color: #f8fbff;
    font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  }

  body.ag-app-shell .operational-command-library .operational-tool-heading p {
    margin: 0;
    color: rgb(177 200 223 / .72);
  }

  body.ag-app-shell .operational-command-library .operational-results-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .75rem;
    align-items: center;
    min-height: 3rem;
    padding: .65rem .75rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .13);
    border-radius: .85rem;
    background: rgb(2 10 24 / .50);
  }

  body.ag-app-shell .operational-command-library .operational-results-summary > button {
    min-height: 2.25rem;
    padding: .42rem .7rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .20);
    border-radius: .72rem;
    background: linear-gradient(145deg, rgb(6 28 49 / .72), rgb(24 10 49 / .56));
    color: #e8f8ff;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .055);
  }

  body.ag-app-shell .operational-command-library .azure-command-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
  }

  body.ag-app-shell .operational-command-library .azure-command-briefing-card {
    min-width: 0;
    padding: 1rem;
    border-color: rgb(var(--ag-search-neon-rgb) / .18);
    border-radius: 1rem;
    background:
      radial-gradient(circle at 0 0, rgb(var(--ag-search-neon-rgb) / .065), transparent 14rem),
      linear-gradient(145deg, rgb(5 17 34 / .69), rgb(2 8 20 / .84));
    box-shadow:
      0 14px 30px rgb(0 0 0 / .20),
      inset 0 1px 0 rgb(255 255 255 / .05),
      inset 0 -12px 22px rgb(0 0 0 / .07);
  }

  body.ag-app-shell .operational-command-library .azure-command-briefing-card:nth-child(4n + 2),
  body.ag-app-shell .operational-command-library .azure-command-briefing-card:nth-child(4n + 3) {
    border-color: rgb(var(--ag-magenta-rgb) / .17);
    background:
      radial-gradient(circle at 100% 0, rgb(var(--ag-magenta-rgb) / .055), transparent 14rem),
      linear-gradient(145deg, rgb(12 13 38 / .64), rgb(2 8 20 / .84));
  }

  body.ag-app-shell .operational-command-library .azure-command-card-command code {
    overflow-wrap: anywhere;
    color: #c2f4ff;
    font-size: .84rem;
    line-height: 1.5;
  }

  body.ag-app-shell .operational-command-library .operational-reference-disclosures {
    display: grid;
    gap: .75rem;
    margin-top: 1rem;
  }

  body.ag-app-shell .operational-command-library .operational-reference-disclosures > details,
  body.ag-app-shell .operational-secondary-tool {
    overflow: hidden;
    margin: 0;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .16);
    border-radius: 1rem;
    background:
      radial-gradient(circle at 100% 0, rgb(var(--ag-magenta-rgb) / .035), transparent 15rem),
      linear-gradient(145deg, rgb(4 15 31 / .61), rgb(2 8 20 / .78));
    box-shadow:
      0 12px 28px rgb(0 0 0 / .17),
      inset 0 1px 0 rgb(255 255 255 / .045);
  }

  body.ag-app-shell .operational-command-library .operational-reference-disclosures > details > summary,
  body.ag-app-shell .operational-secondary-tool > summary {
    min-height: 3.15rem;
    padding: .85rem 1rem;
    color: #e7f8ff;
    font-weight: 850;
  }

  body.ag-app-shell .operational-command-library .operational-reference-disclosures > details[open] > summary,
  body.ag-app-shell .operational-secondary-tool[open] > summary {
    border-bottom: 1px solid rgb(var(--ag-search-neon-rgb) / .12);
    background: linear-gradient(90deg, rgb(var(--ag-search-neon-rgb) / .045), rgb(var(--ag-magenta-rgb) / .03));
  }

  body.ag-app-shell .operational-command-library :where(
    .operational-reference-chip-grid,
    .operational-reference-prose,
    .azure-glossary-command-flow-grid,
    .azure-glossary-command-legend-grid
  ) {
    padding: 1rem;
  }

  /* Smart runbook search support and recent searches. */
  body.ag-app-shell .operational-runbook-search-assist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
    padding: clamp(1rem, 2vw, 1.3rem);
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .18);
    border-radius: 1.15rem;
    background:
      radial-gradient(circle at 0 100%, rgb(var(--ag-search-neon-rgb) / .075), transparent 18rem),
      radial-gradient(circle at 100% 100%, rgb(var(--ag-magenta-rgb) / .065), transparent 18rem),
      linear-gradient(145deg, rgb(5 17 34 / .70), rgb(2 8 20 / .84));
    box-shadow:
      0 4px 9px rgb(0 0 0 / .28),
      0 18px 42px rgb(0 0 0 / .22),
      inset 0 1px 0 rgb(255 255 255 / .055),
      inset 0 -16px 28px rgb(0 0 0 / .08);
    backdrop-filter: blur(16px) saturate(124%);
    -webkit-backdrop-filter: blur(16px) saturate(124%);
  }

  body.ag-app-shell .operational-runbook-search-assist > div {
    min-width: 0;
    padding: .95rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .14);
    border-radius: .95rem;
    background: linear-gradient(145deg, rgb(4 16 32 / .62), rgb(2 8 20 / .72));
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
  }

  body.ag-app-shell .operational-runbook-smart-search {
    background:
      radial-gradient(circle at 100% 0, rgb(var(--ag-magenta-rgb) / .08), transparent 15rem),
      linear-gradient(145deg, rgb(13 13 39 / .58), rgb(2 8 20 / .72)) !important;
  }

  body.ag-app-shell .operational-runbook-assist-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: .8rem;
    flex-wrap: wrap;
  }

  body.ag-app-shell .operational-runbook-assist-head > div {
    display: grid;
    gap: .25rem;
  }

  body.ag-app-shell .operational-runbook-assist-head strong {
    color: #f4faff;
    line-height: 1.35;
  }

  body.ag-app-shell .operational-runbook-assist-head small {
    max-width: 38rem;
    color: rgb(178 200 223 / .74);
    line-height: 1.5;
  }

  body.ag-app-shell [data-ops-clear-recents] {
    min-height: 2.3rem;
    padding: .45rem .68rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .18);
    border-radius: .72rem;
    background: linear-gradient(145deg, rgb(6 27 48 / .64), rgb(var(--ag-violet-deep-rgb) / .16));
    color: #e7f8ff;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .05);
  }

  body.ag-app-shell .operational-runbook-recent-list {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
    margin-top: .75rem;
  }

  body.ag-app-shell .operational-runbook-recent-list > button {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 2.35rem;
    max-width: 100%;
    padding: .45rem .7rem;
    border: 1px solid rgb(var(--ag-search-neon-rgb) / .18);
    border-radius: 999px;
    background:
      radial-gradient(circle at 0 0, rgb(var(--ag-search-neon-rgb) / .08), transparent 7rem),
      linear-gradient(145deg, rgb(5 22 40 / .64), rgb(16 10 39 / .58));
    color: #eaf8ff;
    box-shadow:
      0 7px 16px rgb(0 0 0 / .16),
      inset 0 1px 0 rgb(255 255 255 / .05);
  }

  body.ag-app-shell .operational-runbook-recent-list > button span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.ag-app-shell .azure-runbook-card-exams,
  body.ag-app-shell .azure-runbook-hero-exams {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
  }

  body.ag-app-shell .azure-runbook-card-exams {
    grid-column: 1 / -1;
    margin-top: .15rem;
  }

  body.ag-app-shell .azure-runbook-card-exams > span,
  body.ag-app-shell .azure-runbook-hero-exams > :is(span, a) {
    min-height: 1.8rem;
    display: inline-flex;
    align-items: center;
    padding: .25rem .5rem;
    border: 1px solid rgb(var(--ag-magenta-rgb) / .18);
    border-radius: 999px;
    background: rgb(var(--ag-magenta-rgb) / .06);
    color: #f1eaff;
    font-size: .7rem;
    font-weight: 850;
    text-decoration: none;
  }

  body.ag-app-shell .azure-runbook-card-exams > span:first-child,
  body.ag-app-shell .azure-runbook-hero-exams > span:first-child {
    padding-left: 0;
    border: 0;
    background: transparent;
    color: rgb(178 201 224 / .67);
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  body.ag-app-shell .azure-runbook-hero-exams {
    margin-top: .85rem;
    padding: .7rem .8rem;
    border: 1px solid rgb(var(--ag-magenta-rgb) / .16);
    border-radius: .85rem;
    background:
      radial-gradient(circle at 100% 0, rgb(var(--ag-magenta-rgb) / .07), transparent 12rem),
      rgb(12 8 30 / .37);
  }

  body.ag-app-shell .azure-runbook-hero-exams small {
    width: 100%;
    color: rgb(177 199 221 / .68);
    line-height: 1.45;
  }

  /* Runbook detail spacing contract and dark-glass enforcement. This removes
     legacy light islands such as Cross-links and generated command-group cards. */
  body.ag-app-shell.operational-reference-runbooks-page .azure-runbooks-shell {
    display: grid;
    gap: clamp(1.15rem, 2.2vw, 1.55rem);
    padding-block: clamp(1.1rem, 2.4vw, 1.75rem) clamp(3rem, 6vw, 5rem);
  }

  body.ag-app-shell.operational-reference-runbooks-page .operational-runbook-detail {
    gap: clamp(1.1rem, 2.2vw, 1.5rem) !important;
    padding-inline: clamp(1rem, 2.3vw, 1.55rem);
  }

  body.ag-app-shell.operational-reference-runbooks-page :where(
    .azure-runbook-detail-hero,
    .azure-runbook-glance,
    .azure-runbook-detail-nav,
    .azure-runbook-detail-section,
    .azure-runbook-next-path
  ) {
    margin: 0;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-runbook-detail-hero {
    padding: clamp(1.4rem, 3vw, 2rem) !important;
    border-radius: 1.4rem;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-runbook-glance,
  body.ag-app-shell.operational-reference-runbooks-page .azure-runbook-next-path {
    padding: clamp(1.15rem, 2.4vw, 1.55rem) !important;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-runbook-detail-nav {
    padding: .7rem;
    border-radius: 1rem;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-runbook-detail-section > summary {
    padding: clamp(1rem, 2vw, 1.25rem) clamp(1.05rem, 2.2vw, 1.35rem) !important;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-runbook-detail-section-body {
    display: grid;
    gap: clamp(1rem, 2vw, 1.3rem);
    padding: clamp(1rem, 2.2vw, 1.4rem) !important;
  }

  body.ag-app-shell.operational-reference-runbooks-page :where(
    .azure-ops-section,
    .azure-ops-phase,
    .azure-ops-check-panel,
    .azure-ops-command-card,
    .azure-ops-query-card,
    .azure-ops-output-pattern-grid > article,
    .azure-ops-risk-grid > article,
    .azure-ops-input-grid > article,
    .azure-ops-linked-resources,
    .azure-ops-linked-grid > div,
    .azure-ops-link-card,
    .azure-runbook-exam-card,
    .azure-runbook-next-grid > a
  ) {
    color-scheme: dark;
    border: 1px solid rgb(var(--ag-container-glow-rgb, var(--ag-search-neon-rgb)) / .18) !important;
    background:
      radial-gradient(circle at 5% 0%, rgb(var(--ag-container-glow-rgb, var(--ag-search-neon-rgb)) / .065), transparent 16rem),
      radial-gradient(circle at 96% 100%, rgb(var(--ag-magenta-rgb) / .045), transparent 17rem),
      linear-gradient(145deg, rgb(5 17 34 / .72), rgb(2 8 20 / .87)) !important;
    color: #e8f2ff !important;
    box-shadow:
      0 3px 7px rgb(0 0 0 / .27),
      0 14px 32px rgb(0 0 0 / .20),
      0 0 18px rgb(var(--ag-container-glow-rgb, var(--ag-search-neon-rgb)) / .035),
      inset 0 1px 0 rgb(255 255 255 / .05),
      inset 0 -14px 24px rgb(0 0 0 / .075) !important;
    backdrop-filter: blur(14px) saturate(120%);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
  }

  body.ag-app-shell.operational-reference-runbooks-page :where(
    .azure-ops-section,
    .azure-ops-phase,
    .azure-ops-check-panel,
    .azure-ops-command-card,
    .azure-ops-query-card,
    .azure-ops-output-pattern-grid > article,
    .azure-ops-risk-grid > article,
    .azure-ops-input-grid > article,
    .azure-ops-linked-resources,
    .azure-ops-linked-grid > div
  ) {
    padding: clamp(.95rem, 1.9vw, 1.2rem) !important;
    border-radius: 1rem !important;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-linked-resources {
    --ag-container-glow-rgb: var(--ag-magenta-rgb);
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-linked-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: .9rem;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-linked-grid > div {
    display: grid;
    align-content: start;
    gap: .65rem;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-linked-grid h4 {
    margin: 0;
    color: #eef8ff;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-link-card {
    display: grid;
    gap: .32rem;
    margin: 0 !important;
    padding: .85rem .9rem !important;
    text-decoration: none;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-link-card strong {
    margin: 0;
    color: #c9f2ff !important;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-link-card span,
  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-section-copy,
  body.ag-app-shell.operational-reference-runbooks-page :where(.azure-ops-section, .azure-ops-phase) p {
    color: rgb(190 209 228 / .76) !important;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-link-card:hover,
  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-link-card:focus-visible {
    transform: translateY(-1px);
    border-color: rgb(var(--ag-magenta-rgb) / .45) !important;
    box-shadow:
      0 18px 38px rgb(0 0 0 / .24),
      0 0 22px rgb(var(--ag-magenta-rgb) / .08),
      inset 0 1px 0 rgb(255 255 255 / .07) !important;
    outline: none;
  }

  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-grid-section {
    gap: 1rem;
  }

  body.ag-app-shell.operational-reference-runbooks-page :where(
    .azure-ops-command-list,
    .azure-ops-query-grid,
    .azure-ops-output-pattern-grid,
    .azure-ops-risk-grid,
    .azure-ops-input-grid,
    .azure-runbook-exam-card-grid,
    .azure-runbook-next-grid
  ) {
    gap: .85rem;
  }

  body.ag-app-shell.operational-reference-runbooks-page :where(
    .azure-ops-section-head h3,
    .azure-ops-linked-grid h4,
    .azure-ops-link-card strong
  ) {
    text-shadow: 0 0 18px rgb(var(--ag-search-neon-rgb) / .04);
  }
}

@media screen and (max-width: 1050px) {
  body.ag-app-shell .operational-command-group-luxury {
    grid-template-columns: 1fr;
  }

  body.ag-app-shell .operational-command-group-details,
  body.ag-app-shell .operational-command-group-starters-head {
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 820px) {
  body.ag-app-shell .operational-command-starter-list,
  body.ag-app-shell .operational-command-library .azure-command-gallery,
  body.ag-app-shell .operational-runbook-search-assist,
  body.ag-app-shell.operational-reference-runbooks-page .azure-ops-linked-grid {
    grid-template-columns: 1fr;
  }

  body.ag-app-shell .operational-command-library .operational-results-summary {
    grid-template-columns: 1fr auto;
  }

  body.ag-app-shell .operational-command-library .operational-results-summary > span:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

@media screen and (max-width: 620px) {
  body.ag-app-shell .operational-command-group-luxury,
  body.ag-app-shell .operational-command-group-starters,
  body.ag-app-shell .operational-command-library,
  body.ag-app-shell.operational-reference-runbooks-page .operational-runbook-detail {
    padding-inline: 1rem !important;
  }

  body.ag-app-shell .operational-command-group-snapshot dl {
    grid-template-columns: 1fr;
  }

  body.ag-app-shell .operational-command-library .operational-results-summary {
    grid-template-columns: 1fr;
  }

  body.ag-app-shell .operational-command-library .operational-results-summary > span:nth-child(2),
  body.ag-app-shell .operational-command-library .operational-results-summary > button {
    grid-column: auto;
    grid-row: auto;
  }

  body.ag-app-shell .operational-command-library .operational-results-summary > button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell :where(
    .operational-command-group-actions > a,
    .operational-command-starter-list > button,
    .operational-reference-runbooks-page .azure-ops-link-card,
    .operational-runbook-recent-list > button
  ) {
    transition: none !important;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell :where(
    .operational-command-group-luxury,
    .operational-command-group-snapshot,
    .operational-command-group-disclosure,
    .operational-command-group-starters,
    .operational-command-library,
    .operational-runbook-search-assist,
    .operational-reference-runbooks-page .azure-ops-section,
    .operational-reference-runbooks-page .azure-ops-link-card
  ) {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    color: CanvasText !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
}

@media screen {
  body.ag-app-shell .operational-runbook-search-assist:has(.operational-runbook-recent[hidden]) {
    grid-template-columns: 1fr;
  }
}

/* Resource Graph KQL library — page-scoped premium glass treatment.
   This deliberately changes only /reference/resource-graph and preserves the rest of the visual system. */
body.ag-app-shell.azure-resource-graph-page {
  --rg-cyan: 83 218 255;
  --rg-blue: 72 124 255;
  --rg-violet: 135 82 255;
  --rg-magenta: 219 73 255;
  --rg-panel: 4 15 34;
  --rg-panel-deep: 1 8 22;
  --rg-line: 112 226 255;
}

body.ag-app-shell.azure-resource-graph-page .site-main {
  position: relative;
  overflow: clip;
}

body.ag-app-shell.azure-resource-graph-page .site-main::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 5rem 0 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 11% 13%, rgb(var(--rg-blue) / .12), transparent 34rem),
    radial-gradient(circle at 91% 9%, rgb(var(--rg-magenta) / .12), transparent 37rem),
    radial-gradient(circle at 53% 61%, rgb(var(--rg-cyan) / .05), transparent 42rem);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-shell {
  padding: clamp(1.4rem, 3vw, 2.8rem) 0 clamp(3.5rem, 8vw, 7rem);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-frame {
  width: min(92vw, 1280px);
  max-width: 1280px;
  gap: clamp(1rem, 2vw, 1.45rem);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero,
body.ag-app-shell.azure-resource-graph-page .resource-graph-why-panel,
body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel,
body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-kit,
body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-library {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgb(var(--rg-line) / .3);
  border-radius: clamp(1.35rem, 2.5vw, 2rem);
  background:
    radial-gradient(circle at 5% 0%, rgb(var(--rg-cyan) / .13), transparent 27rem),
    radial-gradient(circle at 100% 4%, rgb(var(--rg-magenta) / .11), transparent 30rem),
    linear-gradient(145deg, rgb(7 23 47 / .9), rgb(2 10 26 / .97));
  box-shadow:
    0 30px 78px rgb(0 0 0 / .33),
    0 0 0 1px rgb(112 226 255 / .045),
    0 0 32px rgb(var(--rg-cyan) / .075),
    0 0 54px rgb(var(--rg-violet) / .055),
    inset 0 1px 0 rgb(255 255 255 / .075),
    inset 0 -28px 54px rgb(0 0 0 / .12);
  backdrop-filter: blur(18px) saturate(1.08);
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero::before,
body.ag-app-shell.azure-resource-graph-page .resource-graph-why-panel::before,
body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel::before,
body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-kit::before,
body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-library::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(105deg, transparent 0 22%, rgb(255 255 255 / .035) 43%, transparent 58%),
    repeating-linear-gradient(90deg, rgb(255 255 255 / .018) 0 1px, transparent 1px 4.75rem);
  opacity: .78;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero::after,
body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-library::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  box-shadow:
    inset 0 0 0 1px rgb(255 255 255 / .025),
    inset 0 0 38px rgb(var(--rg-cyan) / .025);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  align-items: center;
  gap: clamp(1.25rem, 4vw, 3rem);
  padding: clamp(1.6rem, 4vw, 3.35rem);
  border-bottom: 1px solid rgb(var(--rg-line) / .3);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-copy,
body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual {
  position: relative;
  z-index: 1;
  min-width: 0;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero h1 {
  max-width: 15ch;
  margin: .25rem 0 .8rem;
  color: #fbfdff;
  font-family: var(--lux-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(3rem, 6.15vw, 5.75rem);
  line-height: .91;
  letter-spacing: -.058em;
  text-wrap: balance;
  text-shadow:
    0 18px 46px rgb(0 0 0 / .48),
    0 0 30px rgb(var(--rg-cyan) / .09);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-lede {
  max-width: 58rem;
  margin: 0;
  color: rgb(222 235 248 / .86);
  font-size: clamp(1rem, 1.25vw, 1.13rem);
  line-height: 1.68;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-lede strong {
  color: #c8f5ff;
  font-weight: 900;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin-top: clamp(1.25rem, 2.5vw, 1.8rem);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-grid article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .65rem;
  align-items: start;
  min-width: 0;
  padding: .85rem;
  border: 1px solid rgb(var(--rg-line) / .15);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--rg-cyan) / .08), transparent 12rem),
    rgb(2 10 27 / .48);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgb(var(--rg-cyan) / .34);
  border-radius: .7rem;
  color: #a9f0ff;
  background: rgb(var(--rg-blue) / .13);
  box-shadow: 0 0 18px rgb(var(--rg-cyan) / .08);
  font-size: 1.1rem;
  font-weight: 900;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-grid strong {
  display: block;
  margin-bottom: .18rem;
  color: #f5fbff;
  font-size: .91rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-grid p {
  margin: 0;
  color: rgb(186 205 225 / .72);
  font-size: .78rem;
  line-height: 1.46;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-links {
  margin-top: 1rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-links a {
  min-height: 2.6rem;
  padding-inline: .95rem;
  border-color: rgb(var(--rg-cyan) / .25);
  background: linear-gradient(145deg, rgb(12 34 67 / .62), rgb(6 16 38 / .78));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .04);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual {
  display: grid;
  justify-items: center;
  align-self: stretch;
  min-height: 21rem;
  margin: 0;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual::before {
  content: "";
  position: absolute;
  inset: 8% 2% 13%;
  border-radius: 50%;
  background: radial-gradient(circle, rgb(var(--rg-violet) / .19), transparent 65%);
  filter: blur(22px);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual img {
  position: relative;
  width: min(100%, 38rem);
  height: auto;
  align-self: center;
  filter: drop-shadow(0 24px 44px rgb(0 0 0 / .28));
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual figcaption {
  position: absolute;
  right: 1rem;
  bottom: .55rem;
  padding: .42rem .7rem;
  border: 1px solid rgb(var(--rg-cyan) / .22);
  border-radius: 999px;
  color: rgb(205 240 250 / .78);
  background: rgb(3 14 35 / .68);
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-why-panel {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr);
  gap: clamp(1.25rem, 3vw, 2.4rem);
  align-items: center;
  padding: clamp(1.25rem, 3vw, 2rem);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-why-copy h2,
body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-head h2 {
  max-width: 22ch;
  margin: .28rem 0 .55rem;
  color: #f8fcff;
  font-family: var(--lux-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(1.8rem, 3.2vw, 3.15rem);
  line-height: 1;
  letter-spacing: -.04em;
  text-wrap: balance;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-why-copy p,
body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-head p {
  max-width: 65rem;
  margin: 0;
  color: rgb(190 208 228 / .76);
  line-height: 1.64;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-steps li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .7rem;
  align-items: start;
  min-width: 0;
  padding: .85rem;
  border: 1px solid rgb(var(--rg-line) / .14);
  border-radius: 1rem;
  background: rgb(2 10 27 / .48);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-steps li > span {
  display: grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 999px;
  color: #f8fdff;
  background: linear-gradient(135deg, rgb(var(--rg-blue) / .86), rgb(var(--rg-magenta) / .72));
  box-shadow: 0 0 18px rgb(var(--rg-violet) / .19);
  font-size: .78rem;
  font-weight: 950;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-steps strong {
  display: block;
  color: #f4f9ff;
  font-size: .88rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-steps small {
  display: block;
  margin-top: .2rem;
  color: rgb(174 195 218 / .7);
  font-size: .76rem;
  line-height: 1.42;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-steps code {
  color: #baf3ff;
  font-size: .72rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel {
  gap: .8rem;
  padding: clamp(1rem, 2.4vw, 1.5rem);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-heading > div {
  display: grid;
  gap: .18rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-heading strong {
  color: #f7fbff;
  font-size: 1.1rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-heading p {
  max-width: 36rem;
  margin: 0;
  color: rgb(180 201 224 / .72);
  font-size: .86rem;
  line-height: 1.48;
  text-align: right;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel .search-workspace-form {
  width: 100%;
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr) auto;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel .search-workspace-form button {
  min-width: 9.25rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-safety-note {
  margin: 0;
  color: rgb(180 202 225 / .73);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-safety-note strong {
  color: #baf2ff;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-quick-actions {
  gap: .55rem;
  padding: .25rem .2rem .15rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-quick-actions button {
  min-height: 2.45rem;
  padding-inline: .82rem;
  border-color: rgb(var(--rg-line) / .2);
  background:
    linear-gradient(145deg, rgb(9 31 60 / .68), rgb(3 13 31 / .82));
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .035),
    0 8px 20px rgb(0 0 0 / .12);
  color: rgb(220 243 252 / .87);
  font-size: .82rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-quick-actions button:hover,
body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-quick-actions button:focus-visible {
  border-color: rgb(var(--rg-cyan) / .58);
  background: linear-gradient(145deg, rgb(var(--rg-blue) / .28), rgb(var(--rg-violet) / .18));
  box-shadow: 0 0 22px rgb(var(--rg-cyan) / .09);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-kit {
  display: grid;
  gap: 1.1rem;
  padding: clamp(1.15rem, 3vw, 2rem);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 1rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-kql-building-blocks {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .42rem;
  max-width: 34rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-kql-building-blocks span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 2rem;
  padding: .35rem .58rem;
  border: 1px solid rgb(var(--rg-line) / .16);
  border-radius: 999px;
  color: rgb(186 208 228 / .7);
  background: rgb(3 14 33 / .56);
  font-size: .72rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-kql-building-blocks code {
  color: #baf4ff;
  font-weight: 850;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .72rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: .72rem;
  min-width: 0;
  padding: .9rem;
  border: 1px solid rgb(var(--rg-line) / .17);
  border-radius: 1.1rem;
  background:
    radial-gradient(circle at 0 0, rgb(var(--rg-cyan) / .075), transparent 13rem),
    linear-gradient(155deg, rgb(9 27 53 / .76), rgb(2 9 24 / .9));
  box-shadow:
    0 16px 38px rgb(0 0 0 / .2),
    inset 0 1px 0 rgb(255 255 255 / .04);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card:hover,
body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card:focus-within {
  transform: translateY(-2px);
  border-color: rgb(var(--rg-cyan) / .38);
  box-shadow:
    0 22px 48px rgb(0 0 0 / .26),
    0 0 25px rgb(var(--rg-cyan) / .055),
    inset 0 1px 0 rgb(255 255 255 / .055);
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card > div {
  display: grid;
  gap: .25rem;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card > div span {
  color: #8feaff;
  font-size: .65rem;
  font-weight: 950;
  letter-spacing: .1em;
  text-transform: uppercase;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card > div strong {
  color: #f6fbff;
  font-size: .92rem;
  line-height: 1.25;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card pre {
  min-width: 0;
  min-height: 9.6rem;
  max-height: 12.5rem;
  margin: 0;
  padding: .78rem;
  overflow: auto hidden;
  border: 1px solid rgb(var(--rg-line) / .12);
  border-radius: .78rem;
  background: rgb(1 7 20 / .78);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .025),
    inset 0 12px 25px rgb(0 0 0 / .12);
  color: #dff8ff;
  font-size: .72rem;
  line-height: 1.55;
  scrollbar-gutter: stable;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card code {
  white-space: pre;
  color: inherit;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card button {
  justify-self: start;
  min-height: 2.25rem;
  padding: .38rem .68rem;
  border: 1px solid rgb(var(--rg-cyan) / .28);
  border-radius: .72rem;
  color: #dff9ff;
  background: linear-gradient(145deg, rgb(20 66 102 / .58), rgb(29 25 76 / .64));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .045);
  cursor: pointer;
  font-size: .74rem;
  font-weight: 900;
}

body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card button:hover,
body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card button:focus-visible {
  outline: none;
  border-color: rgb(var(--rg-cyan) / .62);
  box-shadow: 0 0 20px rgb(var(--rg-cyan) / .09), inset 0 1px 0 rgb(255 255 255 / .08);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-library {
  gap: 1rem;
  padding: clamp(1.1rem, 3vw, 1.85rem);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-filters {
  padding: 0 .1rem;
  border: 0;
  border-radius: 1rem;
  background: rgb(2 10 27 / .38);
  box-shadow: inset 0 0 0 1px rgb(var(--rg-line) / .11);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-filters > summary {
  padding: .82rem 1rem;
  color: #d8f8ff;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-filters[open] > :not(summary) {
  padding: 0 1rem 1rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-filters .azure-resource-graph-area-grid {
  gap: .48rem;
  margin: 0;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-filters [data-rg-area] {
  border-color: rgb(var(--rg-line) / .18);
  background: rgb(6 24 49 / .58);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .03);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-filters [data-rg-area][aria-pressed="true"] {
  border-color: rgb(var(--rg-cyan) / .58);
  background: linear-gradient(145deg, rgb(var(--rg-blue) / .28), rgb(var(--rg-violet) / .22));
  box-shadow: 0 0 20px rgb(var(--rg-cyan) / .08), inset 0 1px 0 rgb(255 255 255 / .055);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-results-head {
  align-items: end;
  padding: .3rem .15rem 1rem;
  border-bottom-color: rgb(var(--rg-line) / .16);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-results-head h2 {
  margin: .2rem 0 0;
  color: #f8fcff;
  font-family: var(--lux-serif, Georgia, "Times New Roman", serif);
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  line-height: 1;
  letter-spacing: -.038em;
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-results-head > button {
  min-height: 2.5rem;
  padding: .45rem .8rem;
  border: 1px solid rgb(var(--rg-line) / .2);
  border-radius: .78rem;
  color: #d8f7ff;
  background: rgb(6 22 46 / .66);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .78rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto auto;
  gap: .78rem;
  min-width: 0;
  min-height: 0;
  padding: .92rem;
  border: 1px solid rgb(var(--rg-line) / .17);
  border-radius: 1.12rem;
  background:
    radial-gradient(circle at 4% 0%, rgb(var(--rg-cyan) / .085), transparent 17rem),
    radial-gradient(circle at 100% 100%, rgb(var(--rg-violet) / .065), transparent 17rem),
    linear-gradient(150deg, rgb(8 27 53 / .76), rgb(2 9 24 / .93));
  box-shadow:
    0 18px 44px rgb(0 0 0 / .22),
    0 0 0 1px rgb(255 255 255 / .012),
    inset 0 1px 0 rgb(255 255 255 / .045),
    inset 0 -18px 36px rgb(0 0 0 / .09);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 0 44%, rgb(255 255 255 / .025) 52%, transparent 61%);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card:hover,
body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card:focus-within,
body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card:target {
  transform: translateY(-2px);
  border-color: rgb(var(--rg-cyan) / .38);
  box-shadow:
    0 24px 54px rgb(0 0 0 / .28),
    0 0 28px rgb(var(--rg-cyan) / .06),
    0 0 42px rgb(var(--rg-violet) / .045),
    inset 0 1px 0 rgb(255 255 255 / .06);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card header {
  display: grid;
  gap: .42rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card h3 {
  margin: 0;
  color: #f8fcff;
  font-size: 1.06rem;
  line-height: 1.2;
  letter-spacing: -.018em;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card header > p {
  max-width: none;
  margin: 0;
  color: rgb(187 207 228 / .74);
  font-size: .79rem;
  line-height: 1.48;
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-top {
  gap: .35rem;
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-top span,
body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-top strong,
body.ag-app-shell.azure-resource-graph-page .operational-best-match,
body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-meta span {
  min-height: 1.45rem;
  padding: .18rem .48rem;
  border-color: rgb(var(--rg-line) / .2);
  background: rgb(6 42 68 / .48);
  color: #b9f1ff;
  font-size: .58rem;
  line-height: 1.15;
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-top strong {
  border-color: rgb(74 222 128 / .24);
  background: rgb(22 101 52 / .2);
  color: #baf7d0;
}

body.ag-app-shell.azure-resource-graph-page .operational-best-match {
  border-color: rgb(var(--rg-magenta) / .28);
  background: rgb(91 33 182 / .2);
  color: #efc8ff;
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-meta {
  gap: .32rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-query-box {
  gap: .5rem;
  padding: .68rem;
  border-color: rgb(var(--rg-line) / .14);
  border-radius: .85rem;
  background:
    linear-gradient(150deg, rgb(1 10 25 / .78), rgb(1 7 18 / .9));
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .025),
    inset 0 -18px 30px rgb(0 0 0 / .09);
}

body.ag-app-shell.azure-resource-graph-page .operational-query-box-head strong {
  color: #c7f5ff;
  font-size: .72rem;
  letter-spacing: .025em;
}

body.ag-app-shell.azure-resource-graph-page .operational-query-box-head button {
  color: #86e8ff;
  font-size: .69rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-query-box pre {
  min-width: 0;
  max-height: 9.5rem;
  margin: 0;
  padding: .62rem;
  overflow: auto hidden;
  border: 1px solid rgb(var(--rg-line) / .085);
  border-radius: .62rem;
  background: rgb(0 5 16 / .74);
  color: #dff7ff;
  white-space: pre;
  overflow-wrap: normal;
  font-size: .69rem;
  line-height: 1.52;
  scrollbar-gutter: stable;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-details {
  margin-top: -.05rem;
  border: 1px solid rgb(var(--rg-line) / .12);
  border-radius: .82rem;
  background: rgb(2 10 25 / .36);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-details > summary {
  padding: .65rem .7rem;
  color: #c8eff8;
  font-size: .74rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-details[open] > :not(summary) {
  padding: 0 .7rem .7rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-detail-grid {
  grid-template-columns: 1fr;
  gap: .65rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-detail-grid section {
  min-width: 0;
  padding: .66rem;
  border: 1px solid rgb(var(--rg-line) / .1);
  border-radius: .72rem;
  background: rgb(2 10 24 / .46);
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-detail-grid h4,
body.ag-app-shell.azure-resource-graph-page .operational-reference-link-list h4 {
  color: #d8f8ff;
  font-size: .73rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-resource-detail-grid p,
body.ag-app-shell.azure-resource-graph-page .operational-resource-detail-grid li,
body.ag-app-shell.azure-resource-graph-page .operational-reference-link-list a {
  font-size: .72rem;
  line-height: 1.48;
}

body.ag-app-shell.azure-resource-graph-page .operational-reference-link-list {
  margin-top: .6rem;
}

body.ag-app-shell.azure-resource-graph-page .operational-reference-actions.azure-resource-graph-actions {
  align-self: end;
  gap: .36rem;
  margin-top: auto;
}

body.ag-app-shell.azure-resource-graph-page .operational-reference-actions.azure-resource-graph-actions :is(button, a) {
  min-height: 2rem;
  padding: .32rem .56rem;
  border-color: rgb(var(--rg-line) / .18);
  background: rgb(6 25 50 / .52);
  color: rgb(218 242 251 / .86);
  font-size: .64rem;
  font-weight: 850;
}

body.ag-app-shell.azure-resource-graph-page .operational-reference-actions.azure-resource-graph-actions :is(button, a):hover,
body.ag-app-shell.azure-resource-graph-page .operational-reference-actions.azure-resource-graph-actions :is(button, a):focus-visible {
  border-color: rgb(var(--rg-cyan) / .52);
  background: linear-gradient(145deg, rgb(var(--rg-blue) / .24), rgb(var(--rg-violet) / .18));
  box-shadow: 0 0 18px rgb(var(--rg-cyan) / .075);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-show-more {
  min-width: 13rem;
  margin: .25rem auto 0;
  border-color: rgb(var(--rg-cyan) / .34);
  background: linear-gradient(135deg, rgb(16 136 210 / .9), rgb(71 86 222 / .88));
  box-shadow:
    0 14px 34px rgb(26 114 206 / .22),
    0 0 24px rgb(var(--rg-cyan) / .08),
    inset 0 1px 0 rgb(255 255 255 / .13);
}

body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-empty {
  padding: 1.2rem;
  border-color: rgb(var(--rg-line) / .18);
  background: rgb(2 10 26 / .55);
}

/* Luxurious horizontal scrollbars for KQL code. */
body.ag-app-shell.azure-resource-graph-page :is(.resource-graph-starter-card pre, .operational-query-box pre) {
  scrollbar-width: thin;
  scrollbar-color: rgb(113 104 255 / .9) rgb(3 14 33 / .85);
}

body.ag-app-shell.azure-resource-graph-page :is(.resource-graph-starter-card pre, .operational-query-box pre)::-webkit-scrollbar {
  height: 10px;
}

body.ag-app-shell.azure-resource-graph-page :is(.resource-graph-starter-card pre, .operational-query-box pre)::-webkit-scrollbar-track {
  margin-inline: .35rem;
  border: 1px solid rgb(var(--rg-line) / .08);
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgb(3 16 36 / .92), rgb(8 19 48 / .92), rgb(3 16 36 / .92));
  box-shadow: inset 0 1px 4px rgb(0 0 0 / .5);
}

body.ag-app-shell.azure-resource-graph-page :is(.resource-graph-starter-card pre, .operational-query-box pre)::-webkit-scrollbar-thumb {
  min-width: 3.2rem;
  border: 2px solid rgb(3 14 33 / .94);
  border-radius: 999px;
  background:
    linear-gradient(90deg, #2bc7ef 0%, #6a66ff 48%, #cf52ec 100%);
  box-shadow:
    0 0 7px rgb(var(--rg-cyan) / .34),
    0 0 13px rgb(var(--rg-violet) / .24),
    inset 0 1px 0 rgb(255 255 255 / .45);
}

body.ag-app-shell.azure-resource-graph-page :is(.resource-graph-starter-card pre, .operational-query-box pre)::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(90deg, #57e2ff 0%, #8a74ff 48%, #ec70ff 100%);
  box-shadow:
    0 0 10px rgb(var(--rg-cyan) / .5),
    0 0 18px rgb(var(--rg-magenta) / .28),
    inset 0 1px 0 rgb(255 255 255 / .55);
}

@media (max-width: 1160px) {
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(270px, .7fr);
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-grid {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-purpose-grid article {
    padding: .72rem;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-why-panel {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual {
    min-height: 14rem;
    max-height: 22rem;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual img {
    width: min(100%, 34rem);
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-why-panel {
    gap: 1.15rem;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-head {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-kql-building-blocks {
    justify-content: flex-start;
    max-width: none;
  }
}

@media (max-width: 700px) {
  body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-frame {
    width: min(94vw, 680px);
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero h1 {
    font-size: clamp(2.55rem, 13vw, 4.2rem);
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual {
    min-height: 12rem;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual figcaption {
    position: static;
    margin-top: -.4rem;
    text-align: center;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-steps,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-grid,
  body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-card-grid {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-search-heading {
    display: grid;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-search-heading p {
    text-align: left;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel .search-workspace-form {
    grid-template-columns: 1fr;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel .search-workspace-form button {
    width: 100%;
  }
  body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-results-head {
    display: grid;
    align-items: start;
  }
  body.ag-app-shell.azure-resource-graph-page .azure-resource-graph-results-head > button {
    justify-self: start;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card pre,
  body.ag-app-shell.azure-resource-graph-page .operational-query-box pre {
    font-size: .66rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card,
  body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card {
    transition: none;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card:hover,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card:focus-within,
  body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card:hover,
  body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card:focus-within {
    transform: none;
  }
}

@media (forced-colors: active) {
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-why-panel,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-kit,
  body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-library,
  body.ag-app-shell.azure-resource-graph-page .resource-graph-starter-card,
  body.ag-app-shell.azure-resource-graph-page .operational-resource-graph-card {
    border: 1px solid CanvasText;
    background: Canvas;
    box-shadow: none;
    backdrop-filter: none;
  }
  body.ag-app-shell.azure-resource-graph-page .resource-graph-hero-visual {
    display: none;
  }
}

/* Keep the Resource Graph search content stacked; the legacy three-column form
   layout is intentionally replaced by the same full-width search treatment used elsewhere. */
body.ag-app-shell.azure-resource-graph-page .resource-graph-search-panel {
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
}