.lesson57-page{font-size:16px}.lesson57-content{max-width:900px;margin:0 auto}.lesson57-breadcrumb{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:15px;margin:18px 0;color:#64748b}.lesson57-breadcrumb a{text-decoration:none}.lesson57-hero{padding:28px 0 24px;border-bottom:1px solid #e5e7eb}.lesson57-label{font-size:15px;font-weight:800;letter-spacing:.08em}.lesson57-hero h1{font-size:46px;line-height:1.08;margin:10px 0 14px}.lesson57-hero p{font-size:18px;line-height:1.65;max-width:800px}.lesson57-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;font-size:15px}.lesson57-objectives{margin:28px 0;padding:24px;border:1px solid #dbe3ec;border-radius:16px;background:#f8fafc}.lesson57-objectives h2,.lesson57-section h2{font-size:28px;line-height:1.25;margin:0 0 14px}.lesson57-objectives li,.lesson57-body p,.lesson57-body li{font-size:16px;line-height:1.7}.lesson57-section{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:32px 0;border-bottom:1px solid #e5e7eb}.lesson57-number{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;border:1px solid #cbd5e1}.lesson57-body h3{font-size:21px;margin:18px 0 8px}.lesson57-callout{display:flex;gap:12px;padding:18px 20px;border-left:4px solid #64748b;background:#f8fafc;border-radius:10px;margin:18px 0}.lesson57-callout strong,.lesson57-callout span{font-size:16px;line-height:1.65}.lesson57-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}.lesson57-card{border:1px solid #dbe3ec;border-radius:14px;padding:20px;background:#fff}.lesson57-card span,.lesson57-stage span{display:block;font-size:15px;font-weight:800;letter-spacing:.06em;margin-bottom:7px}.lesson57-card b{font-size:18px}.lesson57-card p{margin-bottom:0}.lesson57-flow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;align-items:stretch;margin:20px 0}.lesson57-flow>div{border:1px solid #dbe3ec;border-radius:12px;padding:14px;background:#fff}.lesson57-flow>b{display:flex;align-items:center;justify-content:center;font-size:20px}.lesson57-flow b{font-size:16px}.lesson57-flow span{display:block;font-size:15px;margin-top:5px;line-height:1.4}.lesson57-stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}.lesson57-stage{border:1px solid #dbe3ec;border-radius:14px;padding:18px;background:#f8fafc}.lesson57-stage h3{margin:0 0 8px;font-size:19px}.lesson57-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.lesson57-check{padding:15px;border:1px solid #dbe3ec;border-radius:12px}.lesson57-check b{font-size:16px}.lesson57-bottom-nav{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:28px 0 50px}.lesson57-bottom-nav a{display:block;padding:15px 16px;border:1px solid #dbe3ec;border-radius:12px;text-decoration:none;font-size:16px;line-height:1.4}.lesson57-bottom-nav a:last-child{text-align:right}.lesson57-code-note{font-size:15px!important;color:#64748b}.lesson57-page code,.lesson57-page pre{font-size:15px}.lesson57-page pre{line-height:1.6;white-space:pre;overflow-x:auto}.lesson57-page :where(p,li,a,button,input,select,textarea,label,small,code,pre,th,td,figcaption,blockquote,dt,dd,span,strong,b,em,i){font-size:max(15px,1em)}
@media(max-width:900px){.lesson57-flow{grid-template-columns:1fr}.lesson57-flow>b{transform:rotate(90deg);min-height:22px}.lesson57-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.lesson57-content{width:100%}.lesson57-hero h1{font-size:36px}.lesson57-hero p{font-size:17px}.lesson57-section{grid-template-columns:1fr;gap:10px}.lesson57-number{width:38px;height:38px}.lesson57-grid,.lesson57-checklist,.lesson57-stage-grid{grid-template-columns:1fr}.lesson57-bottom-nav{grid-template-columns:1fr}.lesson57-bottom-nav a:last-child{text-align:left}}
@media(max-width:480px){.lesson57-hero h1{font-size:32px}.lesson57-hero p,.lesson57-body p,.lesson57-body li,.lesson57-objectives li{font-size:16px}.lesson57-objectives{padding:20px}.lesson57-section{padding:26px 0}}

/* Lesson 57 callout layout fix: prevent flex text from collapsing/overlapping. */
.lesson57-callout{display:block!important;min-width:0!important;overflow-wrap:anywhere!important}
.lesson57-callout strong{display:block!important;margin:0 0 7px!important;line-height:1.45!important}
.lesson57-callout span{display:block!important;min-width:0!important;line-height:1.65!important}
.lesson57-callout strong + span{margin-top:0!important}
