#c7 .subhead{margin-top:32px}
#c7 .annotation{font-size:12px!important;color:var(--muted)!important;max-width:70em!important;margin:12px 0 26px!important}
#c7 .decision{margin:34px 0 0;display:grid;grid-template-columns:1.2fr 1fr;gap:28px;border-top:1px solid var(--line);padding-top:18px}
#c7 .decision span{font-size:12px;color:var(--accent);font-weight:700}
#c7 .decision p{font-size:14px;margin:8px 0 0;max-width:none}
#c7 .depth{border-top:1px solid var(--line);margin-top:24px}
#c7 .depth summary{cursor:pointer;padding:16px 0;font-size:14px;font-weight:600;min-height:48px}
#c7 .depth>div{padding:5px 0 16px}
#c7 .depth>div>p{font-size:14px}
#c7 .depth[open] summary{color:var(--accent)}
#c7 .checks{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:30px 0}
#c7 .checks article{border-top:1px solid var(--line);padding-top:18px}
#c7 .checks span{font-size:12px;color:var(--accent)}
#c7 .checks h3{margin-top:8px}
#c7 .checks p{font-size:14px;margin:0}
#c7 .incident{border-left:2px solid var(--accent);background:rgba(46,91,76,.045);padding:24px;margin:30px 0}
#c7 .incident-label{color:var(--accent)!important;font-size:12px!important;font-weight:700}
#c7 .incident-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px}
#c7 .incident-grid b{font-size:13px}
#c7 .incident-grid p{font-size:14px;margin:8px 0 0}
#c7 .gates{display:grid;grid-template-columns:repeat(7,1fr);list-style:none;padding:0;margin:22px 0 10px;gap:8px;counter-reset:g}
#c7 .gates li{font-size:12px;text-align:center;padding:16px 4px;border:1px solid var(--line);counter-increment:g}
#c7 .gates li:before{content:counter(g);display:block;font:24px Georgia,serif;color:var(--accent);margin-bottom:10px}
/* Final approved source05/v13,06/lab-v4 without examples,07/v8. */
body.rrh-compact #c5,body.rrh-compact #c6{padding-top:12px;min-height:0}
body.rrh-compact #c5 .ch-grid,body.rrh-compact #c6 .ch-grid{display:block}
body.rrh-compact #c5 .chapter-top,body.rrh-compact #c6 .chapter-top{margin-bottom:20px}
/*01: block-based before/after paths, without timeline rails. */
body.rrh-compact #c1 .need-flow{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px;flex:none}
body.rrh-compact #c1 .flow-lane h5{border:0;padding:0;margin-bottom:13px;font-size:14px}
body.rrh-compact #c1 .flow-lane ol{display:grid;grid-template-rows:none;gap:12px;flex:none}
body.rrh-compact #c1 .flow-lane ol:before,body.rrh-compact #c1 .flow-lane li:before{display:none}
body.rrh-compact #c1 .flow-lane li{padding:14px 16px;min-height:52px;background:#EAE5DC;border:0;border-radius:5px;font:500 14px/1.7 var(--sans)}
body.rrh-compact #c1 .flow-lane.after li{background:#E1E9E1;color:var(--accent)}
body.rrh-compact #c1 .chat-phone{display:block;width:100%;padding:6px;border-radius:27px;background:#1A1A17;overflow:hidden;line-height:0}
body.rrh-compact #c1 .chat-phone img{display:block;width:100%;height:auto;max-height:none;border-radius:21px}
/*02: no connectors; move whole three-column group down and open up each item. */
body.rrh-compact #c2{padding-top:12px;padding-bottom:50px}
body.rrh-compact #c2 .map-wires{display:none}
body.rrh-compact #c2 .product-map{grid-template-columns:minmax(0,.82fr) 210px minmax(0,1.25fr);gap:26px;margin-top:42px;align-items:start;padding-bottom:24px}
body.rrh-compact #c2 .map-callout{padding:12px 0 18px}
body.rrh-compact #c2 .map-callout+.map-callout{margin-top:12px}
body.rrh-compact #c2 .map-callout strong{font-size:19px;line-height:1.6;margin-bottom:7px}
body.rrh-compact #c2 .map-label{margin-bottom:16px}
body.rrh-compact #c2 .ops-decisions>div{padding:17px 0}
body.rrh-compact #c2 .ops-decisions dt{font-size:17px;line-height:1.65;margin-bottom:9px}
body.rrh-compact #c2 .map-backoffice .map-admin{margin-bottom:15px}
/* Transparent nav labels on light and dark chapters. */
.section-nav a span{background:transparent}
.section-nav a[data-on-dark=true]{color:#ADB3AE}.section-nav a[data-on-dark=true] i{background:#737B75}
.section-nav a.on[data-on-dark=true]{color:#8FC2AE}.section-nav a.on[data-on-dark=true] i{background:#7FB29E}
@media(max-width:860px){body.rrh-compact #c2 .product-map{grid-template-columns:minmax(0,1fr) 210px;gap:28px}body.rrh-compact #c2 .map-backoffice{grid-column:1/-1}}
@media(max-width:680px){#c7 .decision,#c7 .checks,#c7 .incident-grid{grid-template-columns:1fr;gap:22px}#c7 .gates{grid-template-columns:repeat(4,1fr)}}
@media(max-width:560px){body.rrh-compact #c2 .product-map{grid-template-columns:1fr;margin-top:30px}body.rrh-compact #c2 .map-front{grid-column:1;width:220px;justify-self:start;margin:0}body.rrh-compact #c2 .map-backoffice{grid-column:1}body.rrh-compact #c1 .need-flow{gap:14px}body.rrh-compact #c1 .flow-lane li{padding:12px;font-size:13px}}

/*07: observable issues share one hierarchy; no separate repair case. */
#c7 .phone-issues{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 34px;margin:28px 0}
#c7 .phone-issues article{padding-top:17px;border-top:1px solid var(--line);min-width:0}
#c7 .phone-issues h3{color:var(--ink);margin:0 0 11px}
#c7 .phone-issues p{font-size:14px!important;line-height:1.85!important;margin:0}
#c7 .phone-issues code{font-family:var(--mono);font-size:12px;overflow-wrap:anywhere}
@media(max-width:680px){#c7 .phone-issues{grid-template-columns:1fr;gap:22px}}

/*01: size the phone to the adjacent story, preserve the screenshot ratio. */
@media(min-width:761px){
 body.rrh-compact #c1 .figure-note.chat>div:first-child{position:relative;min-height:0;align-self:stretch}
 body.rrh-compact #c1 .chat-phone{position:absolute;left:0;top:0;height:100%;width:max-content;max-width:none;box-sizing:border-box}
 body.rrh-compact #c1 .chat-phone img{width:auto;height:100%;max-width:none;object-fit:contain}
}
@media(max-width:760px){
 body.rrh-compact #c1 .figure-note.chat{grid-template-columns:1fr}
 body.rrh-compact #c1 .chat-phone{width:min(240px,100%);margin:0}
 body.rrh-compact #c1 .chat-phone img{width:100%;height:auto}
}

/*02: left and right item titles share the same black serif treatment. */
body.rrh-compact #c2 .map-callout strong,
body.rrh-compact #c2 .ops-decisions dt{font:700 19px/1.6 var(--serif);color:var(--ink);margin:0 0 7px}
body.rrh-compact #c2 .ops-decisions dd{font:400 12px/1.8 var(--sans);color:var(--ink-2);margin:0}
@media(max-width:560px){body.rrh-compact #c2 .ops-decisions dd{font-size:13px}}

/*07: development-to-release sequence with concise role/action labels. */
#c7 .gates.dev-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:22px 0 14px}
#c7 .dev-flow li{padding:16px 12px;text-align:left;min-width:0}
#c7 .dev-flow li:before{font:400 23px/1.2 var(--latin);margin-bottom:10px}
#c7 .dev-flow b{display:block;font:700 16px/1.6 var(--serif);color:var(--ink);margin-bottom:7px}
#c7 .dev-flow span{display:block;font:400 12px/1.8 var(--sans);color:var(--ink-2)}
@media(max-width:680px){#c7 .gates.dev-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#c7 .dev-flow li{padding:14px 11px}}