/* /blog/client-api-key-handover · page scoped CSS (prefix pg-cak-). Spacing between shared blocks, the steps on the fig. 01 plate
   and the handover record table of fig. 02 (a shared .cy-table on a plate; the state marks reuse .cy-hex and .cy-rec__rule). */

.pg-cak-title{text-wrap:balance}

/* reading rhythm (as the exemplar /blog/mac-security-questionnaire) */
.pg-cak-sec+.pg-cak-sec{margin-top:104px}
@media (max-width:767px){.pg-cak-sec+.pg-cak-sec{margin-top:72px}}
.pg-cak-chips{margin-top:28px}
.pg-cak-links{margin-top:24px}
.pg-cak-fig{margin-top:44px}
.pg-cak-fig .cy-fig__cap{max-width:68ch}
.pg-cak-callout{margin-top:32px;max-width:684px}
.pg-cak-callout+.pg-cak-callout{margin-top:12px}
.pg-cak-pull{max-width:min(68ch,38em);margin:48px 0 0}
.pg-cak-refs{max-width:60ch;font-size:15px;line-height:1.55;color:var(--s-ink-2)}
.pg-cak-gloss{margin-top:12px}

/* fig. 01: three steps on the plate */
.pg-cak-steps .cy-step__t{font-family:var(--font-display);font-size:24px;letter-spacing:-.03em;line-height:1.2}
.pg-cak-steps .cy-step{padding:20px 0}
/* the old diagram's title sits on the plate as one line (as the fig. 01 question on /blog/checking-and-hardening) */
.pg-cak-plate__q{margin-bottom:12px;font-size:18px;font-weight:500;line-height:1.4;color:var(--s-ink)}
.pg-cak-steps .cy-step__d{max-width:52ch}

/* fig. 02: the handover record */
.pg-cak-table{font-size:15px}
.pg-cak-table th[scope="row"]{font-weight:500}
.pg-cak-table .cy-table__gloss{display:block;margin-top:2px;font-weight:400}
.pg-cak-state{display:inline-grid;grid-template-columns:14px minmax(0,1fr);column-gap:10px;align-items:baseline}
.pg-cak-state>.cy-hex{--hex-w:12px;transform:translateY(1px)}
.pg-cak-state>.cy-rec__rule{transform:translateY(-4px)}
.pg-cak-record__note{margin-top:16px;font-family:var(--font-mono);font-size:13px;line-height:1.5;color:var(--s-ink-3)}
@media (max-width:767px){.pg-cak-record .cy-plate__head{margin-bottom:0;border-bottom:0}}

/* the German pass (29 Sep 2026): the record note wraps in German; keep it to a readable line length */
html[lang^="de"] .pg-cak-record__note{max-width:62ch}
