@font-face{font-family:'Source Serif';src:url('../../assets/fonts/source-serif-4-400-700-latin.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('../../assets/fonts/ibm-plex-mono-400-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:light;--paper:#fffdfa;--surround:#f5f3ed;--ink:#182d33;--muted:#60747a;--teal:#16736e;--soft:#e4f0ed;--rust:#b44f37;--line:#d6dedc;--mono:'IBM Plex Mono',monospace;--serif:'Source Serif',Georgia,serif;color:var(--ink);background:var(--surround);font:16px/1.45 Arial,Helvetica,sans-serif}
*{box-sizing:border-box}body{max-width:1440px;margin:0 auto;padding:24px 32px}h1,h2,h3,p,figure{margin:0}a{color:var(--teal);text-underline-offset:3px}button,input{font:inherit}button{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:8px 11px;font-size:13px;font-weight:600;line-height:1.2;cursor:pointer}button:hover{background:var(--soft);border-color:var(--teal)}button.primary,button[aria-pressed=true]{color:#fff;background:var(--teal);border-color:var(--teal)}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--rust);outline-offset:3px}input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--teal)}input[type=checkbox],input[type=radio]{width:15px;height:15px;flex-shrink:0;margin:0;cursor:pointer}input[type=range]{display:block;width:100%;height:20px;margin:6px 0 0;cursor:pointer}[hidden]{display:none!important}fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-size:12px;font-weight:600;color:var(--muted)}.site-header,footer{display:flex;gap:24px;justify-content:space-between;font-size:14px}.site-header{padding-bottom:18px;border-bottom:1px solid var(--line)}.page-title{margin:28px 0}.page-title h1{font:600 clamp(32px,4vw,48px)/1.15 var(--serif);letter-spacing:-.025em}.page-title p{margin-top:12px;color:var(--muted);font-size:17px}.tabs{display:flex;align-items:center;gap:8px;margin-bottom:12px}.tabs button{font-size:14px;padding:10px 14px}.tabs a{margin-left:auto;font-size:13px;white-space:nowrap}.lab-shell{display:grid;grid-template-columns:242px minmax(0,1fr);gap:12px;min-height:520px}.controls,.results{border:1px solid var(--line);border-radius:9px;min-width:0;background:var(--paper)}.controls{padding:18px 16px}.controls h2{font-size:16px;line-height:1.3;margin-bottom:18px}.lambda-control label{display:block;font-size:13px}.lambda-control output{float:right;font:500 14px/1.3 var(--mono);color:var(--teal)}.range-labels{display:flex;justify-content:space-between;align-items:center;gap:4px;font-size:10px;color:var(--muted)}.range-labels button{border:0;background:transparent;padding:4px 0;font-size:10px;color:var(--teal);text-decoration:underline;text-underline-offset:2px}.parameter-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;margin-top:24px}.parameter-controls legend{margin-bottom:12px}.parameter-controls label,.check-row,.camera-choice label{display:flex;align-items:center;gap:7px;font-size:13px;cursor:pointer}.check-row{margin-top:22px;font-size:12px}.actions{display:grid;grid-template-columns:1fr 1fr 1.18fr;gap:5px;margin-top:24px}.actions button{padding:9px 5px;font-size:12px;white-space:nowrap}.reset-row{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-top:10px}.reset-row button{font-weight:400;padding:6px 8px;font-size:11px}.reset-row span{color:var(--muted);font-size:10px;text-align:right}.control-note{font-size:12px;color:var(--muted);line-height:1.5;margin-top:20px}.results{display:flex;flex-direction:column;overflow:hidden}.result-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);min-height:44px;flex-shrink:0}.result-heading h2{font-size:15px;font-weight:600}.result-heading>span{font:11px var(--mono);color:var(--muted);white-space:nowrap}.training-results{display:flex;flex-direction:column;flex:1;min-height:0}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line)}.metric{padding:12px 16px;min-width:0;display:grid;grid-template-columns:1fr auto;column-gap:10px;align-items:center;border-right:1px solid var(--line)}.metric:last-child{border-right:0}.metric span{font-size:11px;color:var(--muted);grid-column:1/-1;line-height:1.25}.metric strong{font:400 24px/1.4 var(--mono);color:var(--ink);font-variant-numeric:tabular-nums}.metric small{font-size:10px;color:var(--muted);white-space:nowrap}.metric.total{background:var(--soft)}.metric.total strong{color:var(--teal)}.image-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:18px 20px 12px;flex:1;min-height:0}.image-grid figure{display:flex;flex-direction:column;align-items:center;min-width:0;min-height:0}.image-grid figcaption{width:100%;max-width:240px;text-align:left;margin-bottom:8px}figcaption{font-size:13px;font-weight:600;line-height:1.25}figcaption span{font-weight:400;font-size:10px;display:block;color:var(--muted);margin-top:3px}.image-grid canvas{display:block;width:min(100%,240px);max-height:240px;aspect-ratio:1;object-fit:contain;background:#09171d;border-radius:4px;image-rendering:auto}.residual-scale{display:flex;align-items:center;gap:5px;width:min(100%,170px);margin-top:5px;font:9px var(--mono);color:var(--muted)}.residual-scale i{height:4px;flex:1;background:linear-gradient(90deg,#07151b,#16736e,#e7af65,#ffecc8);border-radius:2px}.training-bottom{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;padding:12px 20px 14px;border-top:1px solid var(--line);align-items:center;flex-shrink:0;min-height:108px}.loss-arithmetic>span{font-size:11px;font-weight:600;color:var(--muted)}.loss-arithmetic p{font:12px/1.65 var(--mono);margin:5px 0;color:var(--teal);white-space:nowrap}.loss-arithmetic small{display:block;font-size:11px;line-height:1.35;color:var(--muted)}.history-figure{min-width:0}.history-figure figcaption,.view-history figcaption{font-size:11px;display:flex;justify-content:space-between;gap:8px}.history-figure figcaption span,.view-history figcaption span{display:inline;margin:0;font-size:10px}.history-figure svg{display:block;width:100%;height:70px;overflow:visible}.scope{font-size:12px;color:var(--muted);margin-top:12px;padding:9px 12px;border-left:3px solid var(--teal);background:var(--soft);line-height:1.4}.camera-choice{display:flex;flex-direction:column;gap:12px}.camera-choice legend{margin-bottom:12px}.camera-hint{padding:12px;background:var(--soft);color:var(--teal);font-size:12px;line-height:1.45;margin-top:18px;border-radius:5px}.reference-note{font-size:10px;color:var(--muted);margin-top:5px;padding-left:22px}.multiview-results{display:flex;flex-direction:column;flex:1;min-height:0}.center-metric strong{font-size:15px;letter-spacing:-.04em;white-space:nowrap}.center-metric{grid-template-columns:1fr}.center-metric small{display:none}.geometry-grid{display:grid;grid-template-columns:.95fr 1.1fr;flex:1;min-height:0}.geometry-panel{padding:18px 18px 12px;display:flex;flex-direction:column;min-width:0;min-height:0}.geometry-figure{flex:1;display:flex;flex-direction:column;min-height:0}.geometry-figure svg{flex:1;display:block;width:100%;min-height:0;max-height:300px}.legend{display:flex;gap:13px;flex-wrap:wrap;font-size:10px;color:var(--muted);margin-top:3px}.legend span{display:flex;align-items:center;gap:5px}.legend span:before{content:'';display:block;width:10px;height:10px;border-radius:50%;background:var(--teal)}.legend .rust:before{background:transparent;border:2px solid var(--rust)}.legend .gray:before{width:14px;height:0;border-top:1.5px dashed #98a8a6;border-radius:0;background:transparent}.geometry-note{font-size:11px;line-height:1.4;color:var(--muted);margin-top:8px;min-height:30px}.camera-panel{padding:14px 16px 12px;border-left:1px solid var(--line);display:flex;flex-direction:column;min-width:0;min-height:0}.camera-columns,.camera-row{display:grid;grid-template-columns:minmax(74px,1.05fr) minmax(40px,.75fr) minmax(40px,.75fr) minmax(48px,.62fr);align-items:center;gap:8px}.camera-columns{font-size:10px;color:var(--muted);margin-bottom:6px;text-align:center}.camera-columns span:first-child{text-align:left}.camera-row{min-height:86px;padding:6px 0;border-top:1px solid var(--line)}.camera-label{font-size:12px;font-weight:600;line-height:1.3}.camera-label small{display:block;font-size:10px;color:var(--muted);font-weight:400;margin-top:4px}.camera-label em{display:inline-block;font-size:9px;font-style:normal;line-height:1.35;margin-top:5px;padding:2px 5px;border-radius:3px;background:var(--soft);color:var(--teal)}.camera-row.held-out .camera-label em{background:#f5e9df;color:var(--rust)}.camera-row.inactive .camera-label em{background:#eee;color:#637473}.camera-row canvas{width:100%;max-height:82px;aspect-ratio:1;object-fit:contain;border-radius:3px;display:block;background:#09171d}.camera-loss{font:11px var(--mono);text-align:center}.view-history{border-top:1px solid var(--line);padding-top:8px;margin-top:auto}.view-history svg{display:block;width:100%;height:62px}.teal-text{color:var(--teal);font-weight:400}.rust-text{color:var(--rust);font-weight:400}svg text{font-family:Arial,Helvetica,sans-serif;fill:var(--muted)}.explanation{margin-top:42px}.explanation>h2{font:600 30px/1.2 var(--serif);margin-bottom:24px}.explanation-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 40px}.explanation-grid h3,.experiment h3{font-size:16px;margin-bottom:8px;line-height:1.3}.explanation-grid p,.experiment p{font-size:15px;line-height:1.7;color:var(--muted)}.experiment{margin-top:28px;padding:20px 22px;background:var(--soft);border-radius:6px}.experiment p{color:#315655}footer{margin-top:38px;border-top:1px solid var(--line);padding-top:20px;justify-content:flex-start;flex-wrap:wrap;font-size:12px}.screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.load-error{border:1px solid var(--rust);background:#fff3ed;color:var(--rust);padding:16px;margin-top:12px}
/* Live-slide frames use the same lab at a compact fixed height. */
.embedded body{max-width:none;margin:0;padding:6px;height:100dvh;display:flex;flex-direction:column;gap:6px}.embedded .site-header,.embedded .page-title,.embedded .explanation,.embedded footer{display:none}.embedded .tabs{margin:0;flex-shrink:0;min-height:29px}.embedded .tabs button{font-size:12px;padding:6px 11px}.embedded .tabs a{font-size:11px}.embedded .lab-shell{height:auto;min-height:0;flex:1;grid-template-columns:224px minmax(0,1fr);gap:8px}.embedded .controls{padding:11px 12px;overflow:auto;scrollbar-width:thin}.embedded .controls h2{font-size:13px;margin-bottom:11px}.embedded .lambda-control label{font-size:11px}.embedded .lambda-control output{font-size:12px}.embedded input[type=range]{height:16px;margin-top:3px}.embedded .range-labels,.embedded .range-labels button{font-size:9px}.embedded .parameter-controls{margin-top:13px;gap:9px 10px}.embedded .parameter-controls legend{font-size:11px;margin-bottom:9px}.embedded .parameter-controls label,.embedded .camera-choice label{font-size:11px}.embedded .check-row{margin-top:13px;font-size:10px;gap:6px}.embedded input[type=checkbox],.embedded input[type=radio]{width:13px;height:13px}.embedded .actions{margin-top:13px;gap:4px}.embedded .actions button{font-size:10px;padding:7px 4px}.embedded .reset-row{margin-top:7px}.embedded .reset-row button{font-size:10px;padding:5px 7px}.embedded .reset-row span{font-size:9px}.embedded .control-note{margin-top:11px;font-size:10px;line-height:1.4}.embedded .result-heading{padding:7px 12px;min-height:30px}.embedded .result-heading h2{font-size:12px}.embedded .result-heading>span{font-size:10px}.embedded .metric{padding:6px 12px;column-gap:6px}.embedded .metric span{font-size:10px}.embedded .metric strong{font-size:19px;line-height:1.35}.embedded .metric small{font-size:9px}.embedded .image-grid{gap:14px;padding:9px 14px 5px}.embedded .image-grid figcaption{font-size:11px;margin-bottom:5px;max-width:175px}.embedded .image-grid figcaption span{font-size:9px;margin-top:2px}.embedded .image-grid canvas{width:auto;height:100%;max-width:100%;max-height:165px;min-height:0;flex:1;aspect-ratio:1;object-fit:contain}.embedded .residual-scale{margin-top:3px;font-size:8px;max-width:135px;flex-shrink:0}.embedded .training-bottom{padding:6px 14px 7px;gap:14px;min-height:74px;grid-template-columns:1.25fr 1fr}.embedded .loss-arithmetic>span{font-size:10px}.embedded .loss-arithmetic p{font-size:10px;margin:4px 0;line-height:1.3}.embedded .loss-arithmetic small{font-size:9px;line-height:1.35}.embedded .history-figure figcaption{font-size:10px}.embedded .history-figure figcaption span{font-size:8px}.embedded .history-figure svg{height:48px}.embedded .scope{padding:5px 8px;margin:0;font-size:10px;line-height:1.25;flex-shrink:0}.embedded .camera-choice{gap:9px}.embedded .camera-choice legend{font-size:11px;margin-bottom:8px}.embedded .camera-hint{padding:8px;font-size:10px;margin-top:12px;line-height:1.4}.embedded .reference-note{font-size:9px;margin-top:4px;padding-left:19px}.embedded .center-metric strong{font-size:13px;line-height:1.95}.embedded .geometry-panel{padding:10px 12px 8px}.embedded .geometry-figure figcaption{font-size:11px}.embedded .geometry-figure figcaption span{font-size:9px;margin-top:2px}.embedded .geometry-figure svg{max-height:205px}.embedded .legend{font-size:9px;gap:9px;margin-top:0}.embedded .legend span:before{width:8px;height:8px}.embedded .legend .gray:before{width:12px;height:0}.embedded .geometry-note{font-size:9px;line-height:1.35;min-height:22px;margin-top:5px}.embedded .camera-panel{padding:7px 12px 6px}.embedded .camera-columns,.embedded .camera-row{grid-template-columns:minmax(65px,1.2fr) minmax(35px,.8fr) minmax(35px,.8fr) minmax(40px,.65fr);gap:7px}.embedded .camera-columns{font-size:9px;margin-bottom:4px}.embedded .camera-row{min-height:58px;padding:4px 0}.embedded .camera-label{font-size:10px}.embedded .camera-label small{font-size:9px;margin-top:1px}.embedded .camera-label em{font-size:8px;padding:1px 4px;margin-top:2px}.embedded .camera-row canvas{max-height:53px}.embedded .camera-loss{font-size:10px}.embedded .view-history{padding-top:5px}.embedded .view-history figcaption{font-size:9px}.embedded .view-history figcaption span{font-size:9px}.embedded .view-history svg{height:42px}
@media(min-width:1600px){.image-grid canvas{max-height:260px;width:min(100%,260px)}}
@media(max-width:1000px){body{padding:22px}.lab-shell{grid-template-columns:218px minmax(0,1fr)}.metric{padding-inline:12px}.metric strong{font-size:20px}.metric small{display:none}.image-grid{gap:12px;padding-inline:14px}.training-bottom{gap:10px;padding-inline:14px;grid-template-columns:1fr}.loss-arithmetic p{font-size:11px}.history-figure svg{height:58px}.geometry-grid{grid-template-columns:1fr}.geometry-figure svg{height:230px;flex:auto}.geometry-panel{padding-bottom:14px}.camera-panel{border-left:0;border-top:1px solid var(--line)}.camera-row{min-height:68px}.camera-row canvas{max-height:72px}.camera-columns,.camera-row{grid-template-columns:1.2fr .8fr .8fr .6fr}.embedded .lab-shell{grid-template-columns:200px minmax(0,1fr)}.embedded .geometry-grid{grid-template-columns:.9fr 1.1fr}.embedded .geometry-figure svg{height:auto;flex:1}.embedded .camera-panel{border-top:0;border-left:1px solid var(--line)}.embedded .metric small{display:none}.embedded .training-bottom{grid-template-columns:1.2fr 1fr}.embedded .loss-arithmetic p{font-size:9px}.embedded .camera-columns,.embedded .camera-row{grid-template-columns:minmax(58px,1fr) minmax(30px,.8fr) minmax(30px,.8fr) minmax(34px,.6fr);gap:5px}}
@media(max-width:700px){body{padding:16px}.site-header{font-size:12px;gap:12px}.page-title{margin:24px 0}.page-title h1{font-size:35px}.page-title p{font-size:15px}.tabs{flex-wrap:wrap}.tabs button{font-size:12px;padding:9px 10px;flex:1}.tabs a{display:none}.lab-shell,.embedded .lab-shell{grid-template-columns:1fr;min-height:0;gap:10px}.controls{padding:15px}.controls h2{margin-bottom:12px}.controls section{display:grid;grid-template-columns:1fr 1fr;column-gap:20px;align-items:start}.controls section>h2{grid-column:1/-1}.lambda-control{grid-column:1}.parameter-controls{grid-column:2;grid-row:2/4;margin-top:0;gap:9px}.check-row{grid-column:1;margin-top:10px;font-size:11px}.actions{grid-column:1/-1;margin-top:14px}.actions button{padding:10px}.reset-row{grid-column:1/-1}.control-note{grid-column:1/-1;margin-top:10px}.controls .camera-choice{grid-column:1;gap:12px}.camera-hint{grid-column:2;grid-row:2/4;margin-top:0}.reference-note{grid-column:1}.results{min-height:490px}.result-heading{padding:10px 12px}.result-heading h2{font-size:13px}.result-heading>span{font-size:9px}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric{padding:9px 10px}.metric span{font-size:9px;min-height:23px}.metric strong{font-size:18px}.image-grid{gap:9px;padding:13px 10px;flex:initial}.image-grid figcaption{font-size:11px}.image-grid figcaption span{font-size:8px}.image-grid canvas{width:100%;max-height:none}.residual-scale{font-size:8px}.training-bottom{grid-template-columns:1fr;gap:10px;flex:1}.loss-arithmetic p{font-size:12px;white-space:normal}.loss-arithmetic small{font-size:10px}.history-figure svg{height:80px}.scope{font-size:11px}.center-metric strong{font-size:10px;line-height:2.5}.geometry-grid,.embedded .geometry-grid{grid-template-columns:1fr}.geometry-panel{padding:15px}.geometry-figure svg{height:245px;max-height:none;flex:initial}.camera-panel{padding:12px 15px}.camera-row{min-height:80px}.camera-row canvas{max-height:90px}.geometry-note{font-size:11px}.legend{font-size:10px}.camera-columns,.camera-row{grid-template-columns:1.15fr .8fr .8fr .6fr;gap:10px}.view-history{margin-top:10px;padding-top:10px}.view-history svg{height:80px}.explanation{margin-top:30px}.explanation>h2{font-size:26px}.explanation-grid{grid-template-columns:1fr;gap:23px}.explanation-grid p,.experiment p{font-size:14px}.experiment{padding:17px}.explanation-grid h3,.experiment h3{font-size:15px}footer{gap:14px 22px}.embedded body{height:auto;min-height:100dvh;overflow:auto}.embedded .controls{overflow:visible}.embedded .results{min-height:440px}.embedded .image-grid canvas{height:auto;width:100%;max-height:none;flex:initial}.embedded .training-bottom{grid-template-columns:1fr}.embedded .loss-arithmetic p{font-size:11px}.embedded .history-figure svg{height:65px}.embedded .geometry-figure svg{height:235px;flex:initial;max-height:none}.embedded .camera-panel{border-left:0;border-top:1px solid var(--line)}.embedded .camera-row{min-height:76px}.embedded .camera-row canvas{max-height:72px}.embedded .view-history svg{height:60px}.embedded .parameter-controls{margin-top:0}.embedded .camera-hint{margin-top:0}.embedded .control-note{font-size:10px}.embedded .scope{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.pixel-inspector{margin-top:36px;border-top:1px solid var(--line);padding-top:27px}.inspector-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:18px}.inspector-heading h2{font:600 26px/1.25 var(--serif)}.inspector-heading p{font-size:13px;color:var(--muted);margin-top:7px}.pixel-controls{display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:wrap;max-width:230px}.pixel-controls label{display:flex;gap:5px;align-items:center;font-size:12px}.pixel-controls input{width:57px;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--ink);padding:6px;font:12px var(--mono)}.pixel-controls>span{font-size:10px;color:var(--muted);width:100%}.pixel-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:6px;background:var(--paper)}.pixel-table{width:100%;border-collapse:collapse;font-size:12px;min-width:820px;text-align:left}.pixel-table th,.pixel-table td{padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap}.pixel-table th{font-weight:600}.pixel-table thead{background:var(--soft);font-size:11px;color:var(--teal)}.pixel-table tbody td{font:11px var(--mono)}.pixel-table tr:last-child td,.pixel-table tr:last-child th{border-bottom:0}.pixel-table .background-row{background:#f5f3ed}.rgb-swatch{display:inline-block;width:14px;height:14px;border:1px solid var(--line);border-radius:3px;vertical-align:middle;margin-right:9px}.pixel-summary{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:24px;padding:15px 0}.pixel-summary span{display:block;font-size:11px;color:var(--muted);margin-bottom:5px}.pixel-summary strong{font:12px var(--mono)}.inspector-note{font-size:12px;color:var(--muted);line-height:1.55}.inspectable{cursor:crosshair}.embedded .pixel-inspector{display:none}
@media(max-width:700px){.pixel-inspector{margin-top:27px;padding-top:22px}.inspector-heading{display:block}.inspector-heading h2{font-size:23px}.pixel-controls{margin-top:15px;max-width:none}.pixel-controls>span{width:auto}.pixel-summary{grid-template-columns:1fr;gap:13px}.pixel-summary strong{font-size:11px}.pixel-table{min-width:750px;font-size:11px}.pixel-table td,.pixel-table th{padding:9px 10px}}
.numerical-note{font-size:12px;line-height:1.65;color:var(--muted);margin-top:19px}.numerical-note strong{color:var(--ink);font-weight:600}
@media(max-width:700px){
  html:not(.embedded) .view-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  html:not(.embedded) .view-metrics>.metric:nth-child(2){border-right:0}
  html:not(.embedded) .view-metrics .center-metric{grid-column:1/-1;grid-template-columns:minmax(0,1fr) auto;border-top:1px solid var(--line);border-right:0}
  html:not(.embedded) .view-metrics .center-metric span{min-height:0;margin-bottom:4px}
  html:not(.embedded) .view-metrics .center-metric strong{font-size:16px;line-height:1.5;letter-spacing:0}
  html:not(.embedded) .view-metrics .center-metric small{display:block;font-size:10px}
}