.teaching-lab{max-width:1300px}.teaching-lab>.controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 26px}.teaching-lab .controls label{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;font-size:16px;min-width:0;max-width:none;gap:3px 8px}.teaching-lab .controls label input{grid-column:1/-1;min-height:32px;height:32px}.teaching-lab .controls label output{white-space:nowrap}.teaching-lab input[type=range]{width:100%;accent-color:var(--accent)}.teaching-lab [data-value]{font-variant-numeric:tabular-nums;font-weight:600}.teaching-lab canvas.teaching-scene{display:block;width:100%;max-width:1000px;height:auto;aspect-ratio:auto;background:var(--panel);image-rendering:auto;border:1px solid var(--line);touch-action:none}.teaching-scene:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.phong-components{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:1100px}.phong-components canvas{width:100%;height:auto;image-rendering:auto;max-width:none;border:0}.phong-components figcaption{text-align:center;font-size:16px}.material-presets{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.teaching-caption{font-size:15px;color:var(--muted);line-height:1.5;max-width:1000px}.teaching-result{display:block;margin:18px 0;padding:14px 18px;background:var(--panel);border-left:3px solid var(--accent);white-space:pre-wrap;font-size:18px;line-height:1.6;font-variant-numeric:tabular-nums}.component-select{display:flex;gap:14px;align-items:center;font-size:17px;margin-bottom:20px}.component-select select{font:inherit;background:var(--paper);color:var(--ink);padding:8px;max-width:100%}.camera-controls{margin-top:12px;font-size:16px}.camera-controls summary,.teaching-answer summary{cursor:pointer;padding:12px 0;min-height:44px}.camera-controls .controls{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:16px}.quantity-table{margin-top:24px}.quantity-table table{font-size:18px}.quantity-table th,.quantity-table td{padding:12px 14px}.quantity-table th[scope=row]{min-width:170px}.quantity-table th span{display:block;font-size:.88em;font-weight:400;color:var(--muted)}.quantity-table td:nth-child(2){white-space:nowrap}.quantity-table .katex{font-size:1.1em}.teaching-answer{margin-top:24px;border-top:1px solid var(--line);font-size:20px}.teaching-answer summary{font-weight:600}.teaching-answer dl{display:grid;grid-template-columns:130px 1fr;gap:10px 20px;margin:16px 0}.teaching-answer dt{font-weight:650}.teaching-answer dd{margin:0}.teaching-answer .tex-equation{font-size:23px}.related-example{font-size:18px}.related-example span{color:var(--muted)}.supplement main{max-width:1300px;padding-bottom:60px}.supplement header{position:static}.supplement .intro{font-size:20px;padding-top:40px}.supplement .slide{min-height:0}.supplement .tutorial{font-size:22px}
.irradiance-status{font-size:24px;font-variant-numeric:tabular-nums;color:var(--accent);margin:16px 0}.irradiance-scale{display:flex;justify-content:space-between;width:300px;max-width:100%;font-size:14px;margin:12px 0 28px;padding-top:12px;background:linear-gradient(90deg,hsl(225 78% 28%),hsl(160 78% 44%),hsl(100 78% 58%),hsl(40 78% 73%)) no-repeat;background-size:100% 8px}
.phong-legend{display:flex;gap:22px;flex-wrap:wrap;font-size:17px;margin:18px 0}.phong-legend span:before{content:'';display:inline-block;width:26px;height:3px;margin-right:8px;vertical-align:middle;background:currentColor}.phong-legend .ambient{color:var(--muted)}.phong-legend .diffuse{color:var(--brdf-diffuse)}.phong-legend .specular{color:var(--brdf-specular)}.phong-legend .total{color:var(--brdf-mixed)}.phong-polar{display:block;width:100%;max-width:1000px;height:auto;color:var(--ink)}.phong-polar text{font:16px 'Segoe UI',Arial,sans-serif;fill:var(--ink)}.phong-polar path{fill:none;stroke-width:2.7}.phong-polar .polar-grid{stroke:var(--line);stroke-width:1}.phong-polar .polar-ambient{stroke:var(--muted);stroke-dasharray:3 3}.phong-polar .polar-diffuse{stroke:var(--brdf-diffuse)}.phong-polar .polar-specular{stroke:var(--brdf-specular)}.phong-polar .polar-total{stroke:var(--brdf-mixed)}.phong-polar .polar-incoming{stroke:var(--brdf-in);stroke-dasharray:5 5}.phong-polar .polar-reflection{stroke:var(--brdf-out);stroke-width:1.5}
@media(max-width:760px){.teaching-lab>.controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}.teaching-lab .controls label{font-size:14px}.teaching-lab input[type=range]{width:100%}.phong-components{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.teaching-result{font-size:16px;overflow-wrap:anywhere}.component-select{display:block}.component-select select{display:block;margin-top:8px}.teaching-answer{font-size:18px}.teaching-answer dl{grid-template-columns:1fr;gap:6px}.teaching-answer dd{margin-bottom:12px}.quantity-table table{font-size:16px}.quantity-table th,.quantity-table td{padding:9px}.teaching-caption{font-size:14px}.supplement .tutorial{font-size:20px}.related-example{font-size:16px}}
@media(min-width:1101px){.teaching-topic{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:36px;align-content:start;align-items:start}.teaching-topic>.eyebrow,.teaching-topic>h2{grid-column:1/-1}.teaching-topic>.content{grid-column:1;grid-row:3;font-size:24px}.teaching-topic>.key-block{grid-column:1;grid-row:4;font-size:21px}.teaching-topic>.teaching-answer{grid-column:1;grid-row:5;font-size:21px}.teaching-topic>.key-block>h3,.teaching-topic>.key-block>p{font-size:21px}.teaching-topic>.teaching-lab{grid-column:2;grid-row:3/span 5;border:0;margin:0;padding:0}.teaching-topic .tex-equation{font-size:24px}.teaching-topic .teaching-result{font-size:16px}.teaching-topic .teaching-caption{font-size:14px}.teaching-topic .controls{grid-template-columns:repeat(3,minmax(0,1fr))}.teaching-topic .controls label{font-size:15px}.teaching-topic .phong-components{grid-template-columns:repeat(4,minmax(0,1fr))}.teaching-topic .phong-components canvas{max-width:230px}}
@media print{.teaching-topic{display:block!important}.teaching-lab .controls,.teaching-lab button,.material-presets,.camera-controls,.component-select{display:none}.teaching-scene{max-height:100mm;width:auto!important}.teaching-result{font-size:12px}.teaching-answer{font-size:15px}.quantity-table table{font-size:13px}.phong-components canvas{max-height:48mm}.teaching-caption{font-size:12px}.teaching-answer dl{margin:8px 0;gap:4px 12px}}