/* 本课局部覆盖；不影响前三课。 */
/* 代码在左侧上下展示，讲解在右侧独立滚动。 */
.slide .canvas-walkthrough { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:24px; align-items:start; }
.slide .canvas-example { min-width:0; }
.slide .canvas-example .code-playground { display:block !important; }
.slide .canvas-example .play-result { margin-top:12px; }
.slide .canvas-explanation { position:sticky; top:16px; box-sizing:border-box; min-width:0; height:520px; max-height:75vh; overflow-y:scroll; overscroll-behavior-y:contain; scrollbar-gutter:stable; scrollbar-color:#6585ab #eaf0f7; padding:18px; border:1px solid #cdd9e6; border-radius:10px; background:#fff; overflow-wrap:anywhere; }
.slide .canvas-explanation::-webkit-scrollbar { width:14px; }
.slide .canvas-explanation::-webkit-scrollbar-track { background:#eaf0f7; }
.slide .canvas-explanation::-webkit-scrollbar-thumb { background:#6585ab; border:3px solid #eaf0f7; border-radius:8px; }
.slide .canvas-explanation:focus-visible { outline:3px solid #1765b5; outline-offset:3px; }
.slide .canvas-explanation > h3 { margin-top:0; }
@media(max-width:820px) { .slide .canvas-walkthrough { grid-template-columns:1fr; } .slide .canvas-explanation { position:static; } }
@media print { .slide .canvas-walkthrough { display:block; } .slide .canvas-explanation { position:static; height:auto; max-height:none; overflow:visible; } }
.slide .concept-layout.with-code { display:block; }
.slide .term-note { margin:22px 0; padding:16px 22px; border-left:4px solid #177f73; background:#f0f8f5; border-radius:10px; }
.slide .term-note h3 { margin:0 0 8px; font-size:23px; }
.slide .term-note p { margin:0; font-size:21px; }
.slide .visible-url { overflow-wrap:anywhere; font-size:18px; }
.slide .code-playground { min-width:0; }
.slide .play-editor textarea,.slide .play-colors { font-size:21px; line-height:1.5; }
.slide .page-nav { position:static; inset:auto; margin-top:28px; clear:both; }
.slide .review-comparison { display:block; }
.slide .review-comparison article { margin:16px 0; }
@media(max-width:820px) { .slide .term-note p {font-size:18px;} .slide .play-editor textarea,.slide .play-colors {font-size:17px;} }
