.lesson-page { padding: 3rem 0 5rem; }
.lesson-shell { width: min(1080px, calc(100% - 40px)); margin-inline: auto; }
.lesson-breadcrumb { display: flex; flex-wrap: wrap; gap: .65rem; color: #a9bfcd; font-size: .85rem; margin-bottom: 2.5rem; }
.lesson-page a { color: #b4edf7; text-underline-offset: 4px; }
.lesson-page a:focus-visible { outline: 2px solid #9be1ef; outline-offset: 5px; }
.lesson-kicker { font-size: .72rem; letter-spacing: .14em; font-weight: 700; color: #b7eab5; text-transform: uppercase; }
.lesson-page h1 { max-width: 22ch; margin: 1rem 0 1.25rem; font: 700 clamp(2rem, 4vw, 3.6rem)/1.12 var(--font-body); letter-spacing: -.04em; }
.lesson-deck { max-width: 760px; color: #beced8; font-size: clamp(1.05rem, 1.6vw, 1.2rem); line-height: 1.7; }
.lesson-meta { color: #91aabc; font-size: .85rem; margin-top: 1.4rem; }
.lesson-watch { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(260px, .8fr); gap: 2rem; margin: 2.5rem 0; padding-bottom: 2.5rem; border-bottom: 1px solid #294454; }
.lesson-video { display: block; position: relative; align-self: start; overflow: hidden; border: 1px solid #416276; border-radius: 6px; background: #091723; }
.lesson-video img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; }
.lesson-video span { display: block; padding: 1rem; color: #ddf6fa; font-weight: 600; }
.lesson-watch h2 { margin: 0 0 .6rem; font-size: 1.3rem; }
.lesson-chapters { list-style: none; margin: 0; padding: 0; }
.lesson-chapters li { border-bottom: 1px solid #263b49; }
.lesson-chapters a { display: grid; grid-template-columns: 3.2rem 1fr; gap: .7rem; padding: .65rem 0; text-decoration: none; line-height: 1.4; }
.lesson-chapters time { color: #97b2c2; font-family: ui-monospace, monospace; }
.lesson-series { margin-top: 1rem; font-size: .82rem; line-height: 1.6; color: #a9bdca; }
.lesson-body { max-width: 800px; }
.lesson-contents { display: flex; flex-wrap: wrap; gap: .65rem 1.2rem; margin-bottom: 2.5rem; font-size: .9rem; }
.lesson-body section { margin-top: 3rem; scroll-margin-top: 110px; }
.lesson-body h2 { font: 700 clamp(1.5rem, 2.5vw, 2rem)/1.3 var(--font-body); letter-spacing: -.025em; margin-bottom: 1rem; }
.lesson-body p, .lesson-body li { color: #bed0da; line-height: 1.8; }
.lesson-body p { margin: 1rem 0; }
.lesson-body ul, .lesson-body ol { padding-left: 1.3rem; }
.lesson-body li + li { margin-top: .65rem; }
.lesson-body strong { color: #eef6fa; }
.lesson-body code { color: #c1f0f7; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .88em; overflow-wrap: anywhere; }
.lesson-body pre { margin: 1.5rem 0; padding: 1.2rem; border: 1px solid #345366; border-left: 3px solid #97dceb; border-radius: 4px; background: #0c1823; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.7; }
.lesson-body pre code { color: #daedf4; }
.lesson-note { border-left: 3px solid #adcda3; padding: .25rem 1rem; background: #14211f; }
.lesson-table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: .94rem; }
.lesson-table th, .lesson-table td { padding: .85rem .6rem; text-align: left; vertical-align: top; border-bottom: 1px solid #2c4353; }
.lesson-table th { color: #e6f2f7; background: #11212e; }
.lesson-table td { color: #bdcfd9; line-height: 1.5; }
.lesson-next { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; }
.lesson-next article { border: 1px solid #355365; border-radius: 5px; padding: 1.4rem; background: #101d28; }
.lesson-next h3 { font-size: 1.2rem; margin: .8rem 0; }
.lesson-next a { font-weight: 600; }
.lesson-sources { font-size: .88rem; border-top: 1px solid #294454; padding-top: 1rem; }
@media (max-width: 760px) {
 .lesson-page { padding-top: 2rem; }
 .lesson-shell { width: calc(100% - 32px); }
 .lesson-watch, .lesson-next { grid-template-columns: minmax(0, 1fr); }
 .lesson-breadcrumb { margin-bottom: 1.7rem; }
 .lesson-body pre { padding: .9rem; font-size: .9rem; }
 .lesson-table { font-size: .83rem; }
 .lesson-table th, .lesson-table td { padding: .75rem .35rem; }
}