/* Approved third chapter: two story frames, then a wide explainer.
   Uses the existing comic's print theme and type, no new dependencies.
   DESIGN_VARIANCE 8 / MOTION_INTENSITY 2 / VISUAL_DENSITY 6.
   Copy follows the user-approved wording; no new lock-in or pricing section. */
.community-chapter{border-top:5px solid var(--ink);margin-top:10px;padding:32px 16px 38px;scroll-margin-top:84px;outline:none}
.community-chapter:focus-visible{outline:3px solid var(--yellow);outline-offset:-3px}
.community-heading{margin-bottom:32px}
.community-heading h2{font-size:clamp(29px,3.3vw,49px);line-height:1.07;letter-spacing:-.055em;margin:0;font-weight:900}
.community-heading h2 span{background:linear-gradient(transparent 83%,var(--yellow) 83%,var(--yellow) 96%,transparent 96%);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.community-pair{display:grid;grid-template-columns:1fr 1.08fr;gap:24px;align-items:start;padding:0 4px}
.growth-frame{border:3px solid var(--ink);box-shadow:4px 5px 0 var(--ink);background:var(--paper);transform:rotate(-.7deg);min-width:0}
.gm-frame{transform:rotate(.6deg);margin-top:14px}
.growth-art{aspect-ratio:4/3;border-bottom:3px solid var(--ink);overflow:hidden;background:#313629}
.growth-art img{width:100%;height:100%;object-fit:cover;display:block;object-position:center 42%}
.gm-frame .growth-art{aspect-ratio:4/3}
.growth-copy{padding:20px 24px 25px}
.growth-copy h3{font-family:Cocoa,Onest,sans-serif;font-weight:400;font-size:clamp(21px,2vw,28px);line-height:1.15;margin:0 0 15px;display:inline-block;background:var(--yellow);border:2px solid var(--ink);padding:7px 10px;transform:rotate(-1deg)}
.growth-copy p{font-size:clamp(14px,1.25vw,17px);line-height:1.65;margin:0;max-width:60ch}
.growth-copy .gm-entry-note,.lockin-heading .gm-entry-note,.lockin-narration .gm-entry-note{margin-top:18px;color:var(--ink);font-size:14px;line-height:1.5}
.gm-entry-note strong{background:var(--yellow);padding:2px 4px;font-weight:850;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.bank-explainer{display:grid;grid-template-columns:1.12fr 1fr;gap:0;margin-top:34px;border:3px solid var(--ink);box-shadow:4px 5px 0 var(--ink);background:var(--paper)}
.bank-visual{display:flex;flex-direction:column;min-width:0;border-right:3px solid var(--ink);background:#e8dec8}
.bank-visual>img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;display:block;flex:1;min-height:0}
.bank-route{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:0;padding:14px 12px;gap:16px;background:var(--yellow);border-top:3px solid var(--ink);font-family:Cocoa,Onest,sans-serif;font-size:clamp(17px,1.6vw,24px);line-height:1.15;text-align:center}
.bank-route li{position:relative;align-content:center}
.bank-route li+li:before{content:'→';position:absolute;left:-15px;top:50%;transform:translateY(-50%);font-family:Onest,Arial,sans-serif;font-size:20px}
.bank-copy{padding:28px 28px 30px;min-width:0}
.bank-copy h3{font-size:clamp(25px,2.3vw,34px);line-height:1.1;letter-spacing:-.045em;margin:0 0 20px;font-weight:850}
.bank-copy p{font-size:clamp(14px,1.15vw,16px);line-height:1.55;margin:0 0 16px}
.reward strong{white-space:nowrap;font-weight:850;box-shadow:inset 0 -.45em var(--yellow);font-size:1.2em}
.bank-copy .channel-instruction{color:#42453b;font-size:14px}
.channel-button{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:50px;padding:13px 16px;text-decoration:none;color:var(--ink);background:var(--yellow);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-size:15px;font-weight:800;white-space:nowrap;transition:transform .16s ease,box-shadow .16s ease}
.channel-button span{font-size:23px;line-height:1}
.channel-button:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.channel-button:active{transform:translate(2px,2px);box-shadow:none}
@media(min-width:768px) and (max-width:1023px){.community-chapter{padding-inline:10px}.community-pair{gap:17px}.growth-copy{padding:17px}.growth-copy h3{font-size:20px}.bank-copy{padding:20px}.bank-copy h3{font-size:26px}.bank-visual>img{object-position:42% center}.channel-button{font-size:13px;padding-inline:10px;gap:10px}.bank-route{font-size:16px;padding-inline:8px}}
@media(max-width:767px){
  .community-chapter{padding:26px 10px 30px;margin-top:8px;scroll-margin-top:8px;border-top-width:4px}
  .community-heading{margin-bottom:26px}.community-heading h2{font-size:clamp(27px,7.8vw,39px)}
  .community-pair{grid-template-columns:1fr;gap:28px;padding-inline:3px}.gm-frame{margin-top:0}
  .growth-frame{border-width:2px;box-shadow:3px 4px 0 var(--ink)}.growth-art,.gm-frame .growth-art{aspect-ratio:4/3;border-bottom-width:2px}
  .growth-copy{padding:18px 16px 21px}.growth-copy h3{font-size:21px;max-width:100%}.growth-copy p{font-size:14px}
  .bank-explainer{grid-template-columns:1fr;border-width:2px;box-shadow:3px 4px 0 var(--ink);margin-top:30px}
  .bank-visual{border-right:0;border-bottom:2px solid var(--ink)}.bank-visual>img{flex:none;aspect-ratio:16/9;width:100%;height:auto;object-fit:contain}
  .bank-route{border-top-width:2px;font-family:Onest,sans-serif;font-weight:800;font-size:12px;padding:13px 9px;gap:16px}
  .bank-copy{padding:22px 17px 24px}.bank-copy h3{font-size:27px}.bank-copy p{font-size:14px}.bank-copy .channel-instruction{font-size:13px}
  .channel-button{font-size:13px;padding-inline:12px;gap:8px}
}
@media(prefers-reduced-motion:reduce){.channel-button{transition:none}}