/* The mobile opening keeps the migration visible at a readable scale. */
.mobile-migration-route { display: none; }

/* Supporting material stays subordinate to the working migration brief. */
.skill-reference-detail {
  margin-top: 26px;
  border-top: 1px solid #cbd0d1;
}
.skill-reference-detail > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-block: 18px;
  list-style: none;
  cursor: pointer;
  color: #292d33;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
}
.skill-reference-detail > summary::-webkit-details-marker { display: none; }
.skill-reference-detail > summary > span:first-child { min-width: 0; flex: 1; }
.skill-reference-detail > summary > span[aria-hidden] {
  flex: none;
  color: #235ba6;
  font: 300 25px/1 var(--sans);
}
.skill-reference-detail[open] > summary > span[aria-hidden] { transform: none; font-size: 0; }
.skill-reference-detail[open] > summary > span[aria-hidden]::after { content: "−"; font-size: 25px; line-height: 1; }
.skill-reference-detail > summary:focus-visible {
  outline: 3px solid #4d77a6;
  outline-offset: 4px;
}
.skill-reference-detail .resource-list { margin-top: 0; border-top: 0; }
.skill-reference-detail .resource-list > a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 22px;
  align-items: start;
  gap: 16px;
  padding-block: 16px;
}
.skill-reference-detail .resource-list > a > b { margin-left: 0; text-align: right; }
.skill-reference-detail .resource-list small { line-height: 1.65; }

/* The delivery standard is a quiet editorial aside, rather than another card. */
.acceptance-panel {
  background: transparent;
  border: 0;
  border-left: 1px solid #d0d4d4;
  border-radius: 0;
  padding: 0 0 0 28px;
}
.acceptance-top { border: 0; padding-bottom: 0; }
.acceptance-top > span[aria-hidden] { display: none; }
.acceptance-panel h3 { margin-top: 20px; }
.acceptance-panel .delivery-checks {
  display: grid;
  grid-template-columns: 1fr;
  gap: 19px;
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
}
.acceptance-panel .delivery-checks > li {
  display: block;
  border: 0;
  padding: 0;
}
.acceptance-panel .delivery-checks strong {
  display: block;
  color: #292d33;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}
.acceptance-panel .delivery-checks small {
  display: block;
  margin-top: 4px;
  color: #5c6269;
  font-size: 13px;
  line-height: 1.65;
}
.acceptance-panel > a { margin-top: 25px; }

/* Keep the original source marks, with less empty space around each citation. */
.source-group-grid .source-logo { height: 92px; }
.source-group-grid .source-logo img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 65px;
  object-fit: contain;
}
.source-group-grid .source-copy { padding-top: 16px; padding-bottom: 20px; }
.source-group-grid .source-copy h4 { margin-bottom: 9px; }
.source-group-grid .source-arrow { font-size: 18px; top: 8px; }
.advisory-entry > a:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid #235ba6;
  outline-offset: -4px;
  background: #f2f5f9;
}

@media (max-width: 1099px) {
  .acceptance-panel {
    border-left: 0;
    border-top: 1px solid #d0d4d4;
    padding: 25px 0 0;
  }
  .acceptance-panel .delivery-checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 21px 32px;
  }
}

@media (max-width: 960px) {
  .conversion-art { margin: 25px 0 0; max-width: none; padding: 0; }
  .conversion-art > img,
  .conversion-art > .conversion-art-label,
  .conversion-art > figcaption { display: none; }
  .mobile-migration-route {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 19px 20px;
    border-block: 1px solid #42464d;
    color: #edf0f3;
  }
  .route-origin { display: flex; align-items: center; gap: 11px; flex: 1; min-width: 0; }
  .route-origin img { display: block; width: 38px; height: auto; flex: none; }
  .route-origin strong,
  .route-target strong { display: block; font-size: 13px; font-weight: 500; line-height: 1.5; }
  .route-origin strong { max-width: 120px; }
  .route-connector { flex: none; color: #9ab5d3; font: 300 25px/1 var(--sans); }
  .route-target { flex: 1; min-width: 0; }
  .route-target small { display: block; color: #b5bdc8; font-size: 11px; line-height: 1.5; margin-top: 4px; }
}

@media (max-width: 600px) {
  .acceptance-panel .delivery-checks { grid-template-columns: 1fr; gap: 18px; }
  .source-group-grid { display: block; background: transparent; border: 0; border-top: 1px solid #d0d3d4; border-radius: 0; }
  .source-group-grid .advisory-entry { border-bottom: 1px solid #d0d3d4; }
  .source-group-grid .advisory-entry > a {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 19px;
    padding: 19px 5px;
  }
  .source-group-grid .source-logo {
    width: 72px;
    height: 72px;
    padding: 7px;
    margin: 0;
    border: 0;
  }
  .source-group-grid .source-logo.is-dark { padding: 11px; }
  .source-group-grid .source-logo img { max-width: 100%; max-height: 54px; }
  .source-group-grid .source-arrow { display: none; }
  .source-group-grid .source-copy { padding: 0; }
  .source-group-grid .source-type { margin-bottom: 5px; font-size: 10px; line-height: 1.5; }
  .source-group-grid .source-copy h4 { font-size: 19px; line-height: 1.3; margin-bottom: 7px; }
  .source-group-grid .source-copy p:last-child { font-size: 13px; line-height: 1.65; }
}

@media (max-width: 480px) {
  .mobile-migration-route { gap: 12px; padding: 17px 13px; }
  .route-origin { gap: 9px; }
  .route-origin img { width: 32px; }
  .route-origin strong, .route-target strong { font-size: 12px; }
  .route-connector { font-size: 23px; }
  .source-group-grid .advisory-entry > a { gap: 16px; }
}
/* Make the usable brief the next clear action after the architecture comparison. */
.skill-section { border-bottom:1px solid var(--line); }
.skill-layout { align-items:start; }
.skill-intro .section-deck { max-width:470px; }
.agent-start-steps { list-style:none; padding:0; margin:28px 0 0; }
.agent-start-steps li { display:grid; grid-template-columns:28px minmax(0,1fr); gap:14px; padding-block:14px; }
.agent-start-steps li > span { display:flex; justify-content:center; align-items:center; width:25px; height:25px; border:1px solid #b9c2ce; border-radius:50%; color:#235ba6; font:11px/1 var(--mono); margin-top:2px; }
.agent-start-steps h3 { color:var(--ink); font:500 18px/1.4 var(--display); letter-spacing:-.025em; margin:0 0 6px; }
.agent-start-steps p { color:#5c626b; font-size:14px; line-height:1.7; }
.inventory-inputs { padding-top:19px; margin-top:12px; border-top:1px solid var(--line); color:#606873; font-size:13px; line-height:1.75; max-width:470px; }
.skill-intro .skill-provenance { font-size:12px; margin-top:17px; }
.planning-note { display:flex; justify-content:space-between; align-items:baseline; gap:22px; border-top:1px solid var(--line); margin-top:32px; padding-top:23px; }
.planning-note p { font-size:14px; line-height:1.75; color:#535c67; max-width:760px; }
.planning-note a { display:inline-flex; gap:18px; align-items:center; font-size:12px; color:#235ba6; white-space:nowrap; }
#data-handling { scroll-margin-top:100px; }
#data-handling-question:has(#data-handling:target) { border-top-color:#235ba6; }
@media(max-width:960px) { .planning-note { display:block; } .planning-note a { margin-top:14px; } }
@media(max-width:600px) { .agent-start-steps { margin-top:22px; } .agent-start-steps li { padding-block:12px; gap:12px; } .agent-start-steps h3 { font-size:17px; } .agent-start-steps p { font-size:13px; } .inventory-inputs { font-size:12px; margin-top:10px; padding-top:17px; } .planning-note { margin-top:25px; padding-top:20px; } .planning-note p { font-size:13px; } }

/* Separate official warnings share one compact editorial callout. */
.warning-agencies { display:flex; flex-direction:column; align-items:center; gap:12px; }
.warning-agencies a { display:block; flex:none; }
.warning-agencies img { display:block; width:52px; height:52px; object-fit:contain; }
.warning-source-links { display:flex; flex-direction:column; align-items:stretch; gap:8px; }
.warning-source-links .fbi-warning-link { min-height:36px; justify-content:space-between; }
@media(max-width:960px) { .warning-source-links { grid-column:2; flex-direction:row; flex-wrap:wrap; gap:10px 26px; } }
@media(max-width:600px) { .warning-agencies { gap:11px; } .warning-agencies img { width:40px; height:40px; } .warning-source-links { grid-column:1 / -1; gap:8px 24px; } .warning-source-links .fbi-warning-link { min-height:40px; } }

/* Final reading pass: primary actions first, supporting detail on demand. */
.prompt-preview { border-top: 1px solid #d6dadd; }
.prompt-preview > summary,
.outage-detail > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 52px;
  padding-block: 15px;
  list-style: none;
  cursor: pointer;
  color: #30363e;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
}
.prompt-preview > summary::-webkit-details-marker,
.outage-detail > summary::-webkit-details-marker { display: none; }
.prompt-preview > summary > span:first-child,
.outage-detail > summary > span:first-child { flex: 1; min-width: 0; }
.prompt-preview > summary > span[aria-hidden],
.outage-detail > summary > span[aria-hidden] {
  flex: none;
  color: #235ba6;
  font: 300 25px/1 var(--sans);
}
.prompt-preview[open] > summary > span[aria-hidden],
.outage-detail[open] > summary > span[aria-hidden] { font-size: 0; }
.prompt-preview[open] > summary > span[aria-hidden]::after,
.outage-detail[open] > summary > span[aria-hidden]::after { content: '−'; font-size: 25px; line-height: 1; }
.prompt-preview > summary:focus-visible,
.outage-detail > summary:focus-visible {
  outline: 3px solid #4d77a6;
  outline-offset: 4px;
}
.prompt-preview[open] > summary { margin-bottom: 10px; }
.prompt-preview .prompt-label { font-size: 12px; color: #626a73; }
.skill-layout .prompt-preview textarea { height: 260px; margin-bottom: 18px; }
.prompt-panel .prompt-downloads { margin-top: 16px; }
.prompt-panel .copy-prompt { margin-bottom: 20px; }
.agent-start-steps { margin-top: 22px; }
.agent-start-steps li { padding-block: 11px; }
.skill-reference-detail { margin-top: 18px; }
.skill-reference-detail > summary { padding-block: 14px; }

/* Inventory and code share one compact section, with their anchors preserved. */
.migration-details { padding-block: 64px; }
.migration-details .section-heading { margin-bottom: 26px; }
.migration-details .scope-detail { margin-top: 24px; }
.migration-details .scope-detail > summary { min-height: 78px; font-size: 19px; }
.migration-details .domain-note { font-size: 13px; line-height: 1.7; margin-top: 18px; }
.developer-reference { margin-top: 25px; scroll-margin-top: 95px; }
.developer-reference .developer-detail > summary { min-height: 78px; font-size: 19px; }
.developer-reference .code-note { padding-bottom: 24px; }

/* The PHP response is an actionable update, with the outage reporting below it. */
.patch-layout { grid-template-columns: 1.1fr .9fr; gap: 7%; }
.patch-explainer { padding-top: 6px; }
.patch-explainer > .eyebrow { margin-bottom: 18px; font-size: 11px; color: #5c6470; }
.patch-explainer h3 { font: 600 35px/1.18 var(--display); letter-spacing: -.04em; margin-bottom: 19px; max-width: 560px; }
.patch-explainer > p:not(.eyebrow) { font-size: 15px; line-height: 1.75; max-width: 560px; }
.patch-explainer .cms-marks { max-width: 460px; gap: 24px; margin-block: 25px; }
.patch-explainer > .source-link { font-size: 13px; }
.patch-layout .patch-card { background: transparent; border: 0; border-left: 1px solid #cbd0d2; border-radius: 0; padding: 5px 0 0 32px; }
.patch-layout .patch-card h3 { font-size: 28px; line-height: 1.25; margin-bottom: 15px; }
.patch-layout .patch-card > .eyebrow { margin-bottom: 17px; }
.patch-layout .patch-card .version-picker { margin-top: 22px; }
.outage-detail { border-block: 1px solid #cbd0d2; margin-top: 36px; }
.outage-detail > summary { min-height: 78px; font: 500 19px/1.45 var(--display); letter-spacing: -.025em; }
.outage-detail > summary small { display: block; color: #606873; font: 13px/1.7 var(--sans); letter-spacing: 0; margin-top: 5px; }
.outage-detail[open] > summary { border-bottom: 1px solid #d3d7d9; }
.outage-detail-body { padding-block: 24px 27px; }
.outage-detail .news-report {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  grid-template-areas: 'intro logos' 'note logos' 'source logos' 'statement statement';
  align-items: start;
  gap: 17px 7%;
  padding: 0;
}
.outage-detail .news-report > p:not(.report-detail) { grid-area: intro; font-size: 15px; line-height: 1.75; }
.outage-detail .reported-sites { grid-area: logos; margin: 0; padding-block: 3px 0; border: 0; gap: 20px; }
.outage-detail .reported-site + .reported-site { padding-left: 20px; }
.outage-detail .reported-logo { height: 64px; }
.outage-detail .reported-logo img { max-height: 64px; }
.outage-detail .news-report .report-detail { grid-area: note; font-size: 13px; line-height: 1.75; margin: 0; }
.outage-detail .news-report > .source-link { grid-area: source; justify-self: start; margin-top: 2px; }
.outage-detail .official-statement { grid-area: statement; margin-top: 7px; padding-top: 21px; }

/* Filtered result grids should not leave a gray block beside the last result. */
.source-group-grid { background: transparent; }
.directory-heading :is(h2, h3) { font: 600 46px/1.12 var(--display); letter-spacing: -.05em; }
.source-group-heading :is(h3, h4) { display: flex; align-items: center; gap: 13px; font: 500 21px/1.3 var(--display); letter-spacing: -.03em; }
.source-group-heading :is(h3, h4) span { color: #5e5e5e; font: 10px/1 var(--mono); border: 1px solid #c4c4c0; padding: 6px; }
.source-filters button,
.mapping-filters button,
.copy-code { min-height: 44px; }
.incident-source,
.disclosure-row > a { min-height: 44px; }
.menu-toggle { min-width: 44px; min-height: 44px; }
.header-action .header-action-label { font-size: inherit; }
.header-action .header-action-short { display: none; }

/* Use the same expand/collapse cue throughout the page. */
:is(.scope-detail, .developer-detail, .more-disclosures)[open] > summary > span[aria-hidden],
.faq-list details[open] > summary > span[aria-hidden] { transform: none; font-size: 0; }
:is(.scope-detail, .developer-detail, .more-disclosures)[open] > summary > span[aria-hidden]::after,
.faq-list details[open] > summary > span[aria-hidden]::after { content: '−'; font-size: 25px; line-height: 1; }

@media (max-width: 960px) {
  .conversion-hero { grid-template-columns: minmax(0, 1fr); gap: 0; padding-bottom: 28px; }
  .conversion-copy { max-width: 700px; }
  .conversion-title { font-size: clamp(48px, 6.6vw, 64px); }
  .conversion-lead { max-width: 620px; }
  .conversion-explore, .hero-shell .continuity-strip { display: none; }
  .conversion-actions { display: flex; flex-direction: row; align-items: center; gap: 28px; }
  .conversion-actions #copy-hero-prompt { min-height: 44px; padding: 9px 0; gap: 15px; border: 0; background: transparent; color: #d3d8df; }
  .conversion-actions #copy-hero-prompt:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
  .mobile-migration-route { max-width: 620px; border-bottom: 0; padding: 17px 0 1px; }
  .directory-heading :is(h2, h3) { font-size: 40px; }
  .patch-layout { grid-template-columns: 1fr 1fr; gap: 6%; }
  .patch-explainer h3 { font-size: 31px; }
  .patch-explainer .cms-marks { gap: 18px; }
  .patch-layout .patch-card { padding-left: 25px; }
  .patch-layout .patch-card h3 { font-size: 26px; }
  .outage-detail .news-report { grid-template-columns: 1fr; grid-template-areas: 'intro' 'logos' 'note' 'source' 'statement'; gap: 20px; }
  .outage-detail .reported-sites { max-width: 650px; padding-block: 5px 10px; }
}

@media (max-width: 720px) {
  .directory-heading :is(h2, h3) { font-size: 41px; line-height: 1.13; }
  .source-group-heading :is(h3, h4) { font-size: 22px; gap: 12px; }
  .conversion-title { font-size: clamp(44px, 11.5vw, 55px); }
  .conversion-explore,
  .hero-shell .continuity-strip { display: none; }
  .conversion-actions { display: flex; align-items: stretch; flex-direction: column; gap: 7px; max-width: 420px; }
  .conversion-actions .button-primary { width: 100%; }
  .conversion-actions #copy-hero-prompt { align-self: flex-start; justify-content: flex-start; gap: 15px; min-height: 44px; padding: 9px 0; border: 0; background: transparent; color: #d3d8df; }
  .conversion-actions #copy-hero-prompt:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
  .conversion-assurance { margin-top: 13px; font-size: 12px; line-height: 1.7; }
  .conversion-art { margin-top: 22px; }
  .conversion-hero { padding-bottom: 24px; }
  .mobile-migration-route { border-bottom: 0; padding: 17px 10px 1px; }
  .security-comparison td { font-size: 14px; line-height: 1.7; }
  .security-comparison td::before { font-size: 11px; }
  .security-comparison td:last-child { padding: 0; margin-top: 17px; border: 0; background: transparent; }
  .security-comparison td:last-child strong { font-size: 16px; }
  .security-comparison td:last-child > span { font-size: 14px; line-height: 1.7; }
  .security-comparison tr { padding-block: 22px; }
  .migration-details { padding-block: 49px; }
  .migration-details .section-heading { margin-bottom: 22px; }
  .migration-details .scope-detail > summary,
  .developer-reference .developer-detail > summary { min-height: 78px; font-size: 18px; }
  .developer-reference { margin-top: 23px; }
  .patch-layout { grid-template-columns: 1fr; gap: 27px; }
  .patch-explainer h3 { font-size: 31px; }
  .patch-explainer .cms-marks { margin-block: 22px; }
  .patch-layout .patch-card { padding: 25px 0 0; border-left: 0; border-top: 1px solid #cbd0d2; }
  .patch-layout .patch-card h3 { font-size: 27px; }
  .outage-detail { margin-top: 29px; }
  .outage-detail > summary { min-height: 80px; font-size: 18px; gap: 18px; }
  .outage-detail > summary small { font-size: 12px; }
  .outage-detail-body { padding-block: 21px 24px; }
  .outage-detail .news-report > p:not(.report-detail) { font-size: 14px; }
  .outage-detail .reported-sites { gap: 14px; }
  .outage-detail .reported-site + .reported-site { padding-left: 14px; }
  .outage-detail .reported-site > span { font-size: 12px; }
  .outage-detail .reported-site small { font-size: 11px; }
}

@media (max-width: 480px) {
  .directory-heading :is(h2, h3) { font-size: 37px; line-height: 1.15; }
  .source-group-heading :is(h3, h4) { font-size: 21px; gap: 10px; }
  .outage-detail .reported-sites { display: block; padding: 0; }
  .outage-detail .reported-site {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding-block: 15px;
    min-width: 0;
  }
  .outage-detail .reported-site + .reported-site {
    border-left: 0;
    border-top: 1px solid #d4d8d8;
    padding-left: 0;
  }
  .outage-detail .reported-logo { width: 54px; height: 56px; margin: 0; }
  .outage-detail .reported-logo img { max-width: 100%; max-height: 56px; }
  .outage-detail .reported-site > span { font-size: 14px; overflow-wrap: anywhere; }
  .outage-detail .reported-site small { font-size: 12px; }
}

@media (max-width: 600px) {
  .site-header { gap: 8px; }
  .site-header > .header-action {
    display: inline-flex;
    justify-content: center;
    flex: none;
    min-width: 52px;
    min-height: 44px;
    margin-left: auto;
    padding: 9px 10px;
    gap: 0;
    border-color: #4d77a6;
    background: #235ba6;
  }
  .header-action .header-action-label,
  .header-action > span[aria-hidden] { display: none; }
  .header-action .header-action-short { display: inline; font-size: 12px; }
  .site-header .menu-toggle { margin-left: 0; flex: none; }
}

@media (prefers-reduced-motion: reduce) {
  .prompt-preview > summary *,
  .outage-detail > summary * { transition: none; }
}

@media (max-width: 360px) {
  .conversion-title { font-size: clamp(37px, 11.5vw, 41px); letter-spacing: -.065em; }
  .site-header .brand { font-size: 18px; }
  .site-header > .header-action { min-width: 44px; padding-inline: 6px; }
}
