.lesson{max-width:var(--max-width-wide);padding:var(--space-5) var(--space-6) var(--space-16);margin:0 auto}@media (max-width:768px){.lesson{padding-inline:var(--space-4)}}.lesson__crumbs{align-items:center;gap:var(--space-2) var(--space-5);font-size:var(--text-sm);color:var(--color-text-muted);flex-wrap:wrap;display:flex}.lesson__crumbs a{font-weight:var(--weight-semibold);color:var(--color-text-secondary);text-decoration:none}.lesson__crumbs a:hover{color:var(--color-text-primary)}.lesson__crumbs i{padding:0 var(--space-1);opacity:.6;font-style:normal}.player{aspect-ratio:16/9;border-radius:var(--radius-lg);background:var(--shadow-grey);box-shadow:var(--shadow-lg);color:inherit;text-decoration:none;display:block;position:relative;overflow:hidden}.player__video,.player__embed{background:var(--shadow-grey);border:0;width:100%;height:100%;display:block}.player--short .player__embed,.player--short .player__poster,.player--short .player__video{aspect-ratio:9/16;width:auto;height:100%;margin:0 auto}.player__poster{background:var(--shadow-grey);cursor:pointer;border:0;width:100%;height:100%;padding:0;display:block;position:relative}.player__poster img{object-fit:cover}.player__play{width:72px;height:72px;transition:transform var(--duration-fast) var(--ease-out);background:#fffdf5f2;border-radius:50%;place-items:center;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 6px 18px #00000059}.player__play:before{content:"";border-left:22px solid var(--shadow-grey);border-top:14px solid #0000;border-bottom:14px solid #0000;margin-left:7px}.player__poster:hover .player__play,.player__poster:focus-visible .player__play{transform:translate(-50%,-50%)scale(1.08)}.player--link{background:0 0}.player--link .vframe>.vframe__play{width:72px;height:72px}.player--link .vframe>.vframe__play:before{border-top-width:14px;border-bottom-width:14px;border-left-width:22px;margin-left:7px}.player--link:hover .vframe__play{transform:scale(1.08)}.player__cap{z-index:5;border-radius:var(--radius-pill);color:var(--lemon-chiffon);font-size:var(--text-xs);font-weight:var(--weight-semibold);background:#221d23bf;padding:3px 10px;position:absolute;top:10px;right:10px}.prose{color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.prose>*+*{margin-top:var(--space-3)}.prose p{margin:0}.prose h2,.prose h3,.prose h4{margin:var(--space-6) 0 var(--space-2);color:var(--color-text-primary);line-height:var(--leading-snug)}.prose h2{font-size:var(--text-lg)}.prose h3{font-size:var(--text-md)}.prose h4{font-size:var(--text-base)}.prose ul,.prose ol{padding-left:var(--space-5);margin:0}.prose li+li{margin-top:var(--space-1)}.prose li::marker{color:var(--color-text-accent)}.prose a{color:var(--color-link);font-weight:var(--weight-medium)}.prose strong,.prose b{color:var(--color-text-primary)}.prose blockquote{margin:var(--space-4) 0;padding:var(--space-3) var(--space-4);border-left:3px solid var(--color-border-yellow);border-radius:0 var(--radius-md) var(--radius-md) 0;background:var(--color-bg-overlay)}.prose code{border-radius:var(--radius-sm);background:var(--color-bg-muted);padding:1px 6px;font-size:.9em}.prose pre{padding:var(--space-4);border-radius:var(--radius-md);background:var(--shadow-grey);color:var(--lemon-chiffon);overflow-x:auto}.prose pre code{background:0 0;padding:0}.prose img{border-radius:var(--radius-md);max-width:100%;height:auto;display:block}.prose figure{margin:var(--space-4) 0}.prose figcaption{margin-top:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted);text-align:center}.prose hr{border:0;border-top:1px solid var(--color-border);margin:var(--space-6) 0}.prose table{border-collapse:collapse;width:100%;font-size:var(--text-sm)}.prose th,.prose td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);text-align:left}.lesson-skeleton{gap:var(--space-6);max-width:760px;padding-block:var(--space-6);flex-direction:column;display:flex}.lesson-skeleton__player{aspect-ratio:16/9;border-radius:var(--radius-lg);background:var(--color-bg-muted)}.lesson-skeleton__lines{gap:var(--space-3);flex-direction:column;display:flex}.lesson-skeleton__lines i{border-radius:var(--radius-sm);background:var(--color-bg-muted);height:18px;display:block}.lesson-skeleton__lines i:first-child{width:90%;height:36px}.lesson-skeleton__lines i:last-child{width:50%}.nudge{width:min(480px, calc(100vw - 2 * var(--space-4)));border:1px solid var(--color-border);border-radius:var(--radius-xl);background:var(--color-bg-base);color:var(--color-text-primary);box-shadow:var(--shadow-xl);padding:0}.nudge::backdrop{background:#0000008c}.nudge__body{gap:var(--space-3);padding:var(--space-8) var(--space-6) var(--space-6);flex-direction:column;display:flex}.nudge h2{font-size:var(--text-xl);letter-spacing:-.02em;margin:0}.nudge p{color:var(--color-text-secondary);margin:0}.nudge .kicker{color:var(--color-text-muted)}.nudge__actions{gap:var(--space-3);margin-top:var(--space-3);flex-wrap:wrap;display:flex}@media (prefers-reduced-motion:no-preference){.nudge[open]{animation:.2s ease-out nudge-in}}@keyframes nudge-in{0%{opacity:0;transform:translateY(8px)}}.lesson__head{gap:var(--space-3);padding-block:var(--space-5) var(--space-6);flex-direction:column;display:flex}.lesson__chips{align-items:center;gap:var(--space-2);font-size:var(--text-sm);flex-wrap:wrap;display:flex}.lesson__head h1{letter-spacing:-.025em;max-width:900px;margin:0;font-size:clamp(1.75rem,3.4vw,2.5rem)}.lesson__subtitle{font-size:var(--text-md);color:var(--color-text-secondary)}.level-chip{border:1px solid var(--color-text-primary);border-radius:var(--radius-pill);background:var(--color-bg-base);color:var(--color-text-primary);font-size:11px;font-weight:var(--weight-bold);padding:1px 8px}.lesson__layout{gap:var(--space-8);grid-template-columns:minmax(0,1fr) 360px;align-items:start;display:grid}@media (max-width:960px){.lesson__layout{grid-template-columns:1fr}}.lesson__main{gap:var(--space-5);flex-direction:column;min-width:0;display:flex}.lesson__main h2,.lesson__side h2{font-size:var(--text-lg);margin:0}.lesson__links{align-items:center;gap:var(--space-4);font-size:var(--text-sm);flex-wrap:wrap;display:flex}.lesson__read{gap:var(--space-4);padding:var(--space-6);background:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);flex-direction:column;display:flex}@media (max-width:768px){.lesson__read{padding:var(--space-5);border-radius:var(--radius-lg)}}.lesson__why{padding:var(--space-3) var(--space-4);border-left:3px solid var(--bright-amber);border-radius:0 var(--radius-md) var(--radius-md) 0;background:var(--color-bg-overlay);color:var(--color-text-secondary)}.lesson__why strong{color:var(--color-text-primary)}.keep-going{gap:var(--space-3);flex-direction:column;display:flex}.keep-going__links{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));display:grid}.keep-going__links a{padding:var(--space-4);background:var(--color-bg-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text-primary);transition:border-color var(--duration-fast);flex-direction:column;gap:4px;text-decoration:none;display:flex}.keep-going__links a:hover{border-color:var(--color-text-primary)}.keep-going__links .keep-going__thumb{aspect-ratio:16/9;margin-bottom:var(--space-2);border-radius:var(--radius-md);background:var(--tone-bg);display:block;position:relative;overflow:hidden}.keep-going__thumb img{object-fit:cover}.keep-going__links small{font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted)}.keep-going__links b{line-height:1.35}.keep-going__links span{font-size:var(--text-sm);color:var(--color-text-secondary)}.lesson__side{top:calc(var(--navbar-height) + var(--space-5));gap:var(--space-4);flex-direction:column;display:flex;position:sticky}@media (max-width:960px){.lesson__side{position:static}}.side-card{gap:var(--space-3);padding:var(--space-5);background:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;display:flex}.side-card>.text-secondary{font-size:var(--text-sm)}.side-card__row{gap:var(--space-2);flex-wrap:wrap;display:flex}.side-card__note{font-size:var(--text-sm);text-align:center}.side-card__done{align-items:center;gap:var(--space-3);font-size:var(--text-md);display:flex}.side-card__done span{background:var(--emerald);width:32px;height:32px;color:var(--white);font-weight:var(--weight-bold);border-radius:50%;flex:none;place-items:center;display:grid}.quiz__head{justify-content:space-between;align-items:baseline;gap:var(--space-2);display:flex}.quiz__head .text-muted,.quiz__prev{font-size:var(--text-sm)}.quiz__q{gap:var(--space-2);border:0;flex-direction:column;margin:0;padding:0;display:flex}.quiz__q legend{margin-bottom:var(--space-2);font-size:var(--text-md);font-weight:var(--weight-bold);line-height:var(--leading-snug);padding:0}.quiz__opt{align-items:center;gap:var(--space-3);min-height:48px;padding:var(--space-2) var(--space-3);text-align:left;border:1.5px solid var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-bg-base);color:var(--color-text-primary);font:inherit;font-size:var(--text-sm);cursor:pointer;transition:border-color var(--duration-fast), background var(--duration-fast);display:flex}.quiz__opt:hover:not(:disabled){border-color:var(--color-text-primary)}.quiz__opt:disabled{cursor:default}.quiz__letter{border:1.5px solid var(--color-text-primary);width:28px;height:28px;font-size:var(--text-xs);font-weight:var(--weight-bold);border-radius:50%;flex:none;place-items:center;display:grid}.quiz__opt.is-right{border:2px solid var(--color-text-primary);background:var(--color-success-bg);color:var(--color-success-text);font-weight:var(--weight-semibold)}.quiz__opt.is-wrong{border:2px solid var(--color-text-primary);background:var(--color-danger-bg);color:var(--color-danger-text)}.quiz__explain{padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-bg-overlay);font-size:var(--text-sm);color:var(--color-text-secondary)}.quiz__explain.is-right{background:var(--color-success-bg)}.quiz__explain b{color:var(--color-text-primary)}.quiz__score{font-size:var(--text-2xl);font-weight:var(--weight-bold)}.quiz .btn{align-self:flex-start}
