/* v185: chest project phases, keyboard sequences, responsive illustrations */
.bb-chest-project{overflow-wrap:anywhere}
.bb-chest-phase-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0 30px}
.bb-chest-phase-grid>div{border:1px solid #d1a167;border-radius:16px;background:linear-gradient(180deg,#fff9ed,#f4dfbb);padding:15px 10px;text-align:center;box-shadow:inset 0 0 0 2px #fff1d6}
.bb-chest-phase-grid>div>span{display:grid;place-items:center;margin:0 auto 10px;width:39px;height:39px;border-radius:50%;background:#672866;border:2px solid #dfb071;color:#ffe1b4;font:700 1.1rem Georgia,serif}
.bb-chest-phase-grid strong{display:block;color:#68235d;font:700 1.12rem/1.22 Georgia,serif}
.bb-chest-phase-grid small{display:block;color:#715266;margin-top:5px;font:.91rem/1.42 Georgia,serif}
.bb-chest-phase-heading{color:#6b275f;margin:30px 0 14px;padding-bottom:12px;border-bottom:2px solid #d4ab78;font:700 clamp(1.55rem,2.7vw,2.05rem)/1.13 'Cormorant Garamond',Georgia,serif}
.bb-around .bb-chest-steps{margin-top:15px;margin-bottom:22px;gap:19px}
.bb-around .bb-chest-steps li{line-height:1.68}
.bb-around .bb-chest-steps li>strong:first-child{color:#5c2053}
.bb-chest-keygrid{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 9px}
.bb-chest-keygrid>div{display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap;border:1px solid #d3a36b;border-radius:12px;background:linear-gradient(135deg,#fff9ec,#f2deb6);padding:8px 10px;box-shadow:inset 0 0 0 2px #fff6e8}
.bb-chest-keygrid kbd{margin:0}
.bb-around .bb-chest-project .bb-helper-figure{margin:18px auto 24px}
.bb-around .bb-chest-project .bb-helper-figure img{width:100%;height:auto}
.bb-around .bb-chest-project .bb-helper-figure__link{background:#282831}
@media(max-width:840px){.bb-chest-phase-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
@media(max-width:580px){.bb-chest-phase-grid{grid-template-columns:1fr 1fr}.bb-chest-phase-grid>div{padding:12px 8px}.bb-chest-phase-grid strong{font-size:.97rem}.bb-chest-phase-grid small{font-size:.78rem}.bb-chest-phase-heading{margin-top:23px}.bb-chest-keygrid>div{flex:1 1 120px}}

/* Keep the numbered chest steps continuous across four phases. */
.bb-chest-steps[start="5"]{counter-reset:step 4}
.bb-chest-steps[start="9"]{counter-reset:step 8}
.bb-chest-steps[start="13"]{counter-reset:step 12}