/* Classroom diagrams and source-backed tutorial views. */
.lecture-image{display:block;width:100%;max-height:355px;object-fit:contain;margin:8px auto 12px}
.columns .lecture-image{max-height:320px}.prediction{border-left:4px solid var(--blue);padding:18px 22px;background:#e4ecff;font-size:23px;margin:18px 0}
.network-rail{display:flex;gap:10px;align-items:center;justify-content:center;margin:30px 0;flex-wrap:wrap}.network-node{padding:22px 16px;background:white;border-top:4px solid var(--teal);font-size:21px;font-weight:650;min-width:145px}.network-node small{display:block;font:15px/1.5 var(--mono);margin-top:9px;color:var(--muted)}
.timeline{display:grid;grid-template-columns:1fr;gap:24px;margin:24px 0}.timeline>div{border-left:3px solid var(--teal);padding:4px 24px}.timeline strong{font-size:25px}.timeline p{margin:7px 0 0}
.shift-scenes{display:flex;gap:32px;margin:15px 0}.shift-scenes>div{width:50%;height:220px;background:white;border:1px solid var(--line);position:relative;overflow:hidden}.shift-scenes img{position:absolute;width:160px;height:160px;object-fit:cover;left:25px;top:10px}.shift-scenes>div+div img{left:auto;right:25px;top:50px}
.starts-diagram{display:flex;gap:8px;margin:25px 0}.starts-diagram span{width:90px;padding:22px;text-align:center;background:white;border:1px solid var(--line);font:26px var(--mono)}.starts-diagram span:nth-child(-n+3){border-bottom:5px solid var(--teal)}
.kernel-gallery,.rgb-gallery{display:flex;align-items:center;justify-content:space-around;gap:24px;flex-wrap:wrap;margin:24px 0}.rgb-gallery img{width:22%;height:240px;object-fit:contain}
.filter-bank{display:flex;align-items:center;gap:50px;margin:22px 0}.bank-input{font:26px var(--mono);border:2px solid var(--blue);padding:40px 25px}.bank-paths{display:grid;gap:12px;flex:1}.bank-paths>div{padding:12px 20px;border-left:4px solid var(--teal);background:white;font-size:21px}
.feature-gallery{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.feature-gallery.six{display:grid;grid-template-columns:repeat(3,1fr)}.feature-gallery.sixteen{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.heat-tile{display:flex;flex-direction:column;align-items:center;padding:5px;min-width:0}.heat-tile canvas{image-rendering:pixelated;max-width:100%;background:white;border:1px solid var(--line)}.heat-tile .cap{margin:7px 0 0;font-size:11px;letter-spacing:.015em;text-transform:none;font-family:var(--mono)}.selected-map{outline:2px solid var(--teal);border-radius:4px}
.digit-summary{text-align:center}.digit-summary .heat-tile{margin:auto}.digit-bars{padding:4px 0}.digit-bar{display:grid;grid-template-columns:24px 1fr 75px;align-items:center;gap:12px;margin:7px 0;font:16px var(--mono)}.digit-bar>div{background:#e4e8ef;height:20px}.digit-bar i{height:100%;display:block;background:var(--teal)}.digit-bar output{text-align:right}
.learning-plot{display:block;width:100%;height:280px;font:17px var(--ui)}.pca-plot{display:block;width:100%;height:340px;font:18px var(--mono)}.residual-diagram{width:100%;height:245px;display:block;font:26px var(--ui)}.photo-lab-result .photo-pair{align-items:start}.photo-lab-result .equation{font-size:14px;text-align:center;line-height:1.3}.photo-lab-result .note{font-size:13px}
.tutorial-list{display:grid;gap:12px}.tutorial-list a{display:block;padding:12px 18px;border-left:3px solid var(--teal);background:white;text-decoration:none}.tutorial-list strong{display:block;font-size:21px}.tutorial-list span{display:block;font-size:16px;color:var(--muted);margin-top:4px}
.overview-chapter h3{margin-top:24px;font-size:17px}.overview-chapter ol{margin:0}.overview-chapter a{font-size:14px;line-height:1.65}.present [data-build].is-pending{visibility:hidden;opacity:0}.present [data-build]{transition:opacity .16s ease}.present #counter{min-width:104px;text-align:center}.present .frame>h2{font-size:37px}.present .frame>.lead{font-size:21px;max-width:1100px;color:var(--muted)}.present .frame .equation.big{font-size:25px;line-height:1.6}.present .frame .timeline p{font-size:21px}.present .frame .network-rail{margin:22px 0}.present .frame .network-node{min-width:135px;padding:18px 13px;font-size:20px}.present .frame .network-node small{font-size:14px}.present .frame .mnist-panel{padding:12px 18px;margin:6px 0}.present .frame .mnist-panel .controls{margin-bottom:14px}.present .frame .mnist-panel .equation{font-size:17px}.present .frame .mnist-panel .note{font-size:14px;margin:10px 0 0}.present .frame .mnist-panel .controls label{font-size:12px}.present .frame .mnist-panel table{font-size:16px}.present .frame .mnist-panel th,.present .frame .mnist-panel td{padding:5px 12px}.present .frame .lecture-image{max-height:380px}.present .frame .columns .lecture-image{max-height:320px}.present .frame .photo-lab-result .note{font-size:13px;margin:4px 0}.present .frame .photo-lab-result .equation{font-size:14px;margin:7px 0;padding:6px}.present .frame .photo-lab-result .photo-pair{gap:30px}.present #mnist-curves .panel,.present #features-pca .panel{margin:4px 0;padding:12px 18px}.present #mnist-curves .learning-plot{height:260px}.present #mnist-curves .equation{font-size:16px}.present #features-pca .pca-plot{height:355px}.present #mnist-original .lecture-image{max-height:345px}.present #question .lead{display:none}.present #question h1{font-size:53px}.present #question .columns{grid-template-columns:.9fr 1.1fr}.present #question .lecture-image{max-height:420px}.present #tutorial-photos .panel{padding:10px 18px}.present #rgb-intro .rgb-gallery img{height:235px}.present #transfer-evidence .lecture-image{max-height:345px}.present #transfer-evidence>p:last-of-type{font-size:18px}
@media(max-width:700px){.network-rail{gap:8px}.network-node{min-width:110px;padding:12px;font-size:16px}.network-node small{font-size:12px}.network-rail .arrow{font-size:17px}.starts-diagram{gap:4px}.starts-diagram span{width:40px;padding:12px 4px;font-size:20px}.rgb-gallery img{width:44%;height:auto}.filter-bank{flex-direction:column;gap:16px}.bank-input{padding:16px}.bank-paths{width:100%}.bank-paths>div{font-size:16px}.feature-gallery.six{gap:6px}.feature-gallery.sixteen{gap:3px}.heat-tile{padding:2px}.heat-tile .cap{font-size:9px}.feature-gallery canvas{width:100%!important;height:auto!important}.learning-plot{height:220px}.pca-plot{height:260px}.photo-pair canvas{max-width:100%;height:auto!important}.shift-scenes img{width:110px;height:110px;left:10px}.shift-scenes>div+div img{right:10px}.shift-scenes>div{height:185px}.prediction{font-size:20px}.present .network-rail{flex-wrap:nowrap}.present .network-node{min-width:130px}.present .filter-bank{flex-direction:row}.present .feature-gallery.six{gap:12px}.present .feature-gallery.sixteen{gap:7px}.present .feature-gallery canvas{width:revert!important}.present .rgb-gallery img{width:22%}.present .photo-pair canvas{height:220px!important}}
@media print{.frame{break-before:page;break-inside:avoid;border:0;min-height:700px}.frame [data-build]{visibility:visible!important;opacity:1!important}.controls{display:none!important}.lecture-image{max-height:350px}.notes{display:none!important}.feature-gallery{break-inside:avoid}}

.present .frame .heat-tile .cap{margin:5px 0 0;line-height:1.3;font-size:11px}.present .frame .feature-gallery.sixteen{gap:6px}.present .frame .feature-gallery.sixteen .heat-tile{padding:4px}

.present .frame .flat-gallery{grid-template-columns:repeat(8,1fr);gap:8px}.present .frame .flat-gallery .heat-tile .cap{font-size:10px}
