.optical-bench{background:#eaece2;padding:24px 30px 18px}.optics-eyebrow{color:#71816b;letter-spacing:.08em;justify-content:space-between;gap:16px;font-size:12px;display:flex}.lens-object,.lens-views{height:410px}.lens-plan{align-content:center;height:410px}.lens-plan .lens-diagram{max-height:360px}.lens-views [hidden]{display:none}.lens-object .studio{height:100%;min-height:0}.lens-observations{border-bottom:1px solid #758a6826;justify-content:space-around;gap:22px;padding:0 12px 20px;display:flex}.lens-observations>span{color:#687d61;gap:6px;font-size:16px;display:grid}.lens-observations strong{color:#38513f;font-variant-numeric:tabular-nums;font-size:27px;font-weight:500}.lens-observations small{font-size:14px;font-weight:400}.lens-diagram{width:100%;max-height:250px;display:block;overflow:visible}.lens-diagram text{fill:#728068;font-family:inherit;font-size:16px}.optics-explore{grid-template-columns:repeat(3,1fr);align-items:end;gap:24px;padding:24px 0;display:grid}.optics-explore>.btn{grid-column:1/-1;justify-self:center;min-height:44px}.optics-model-note{color:#7a8471;margin:10px 0 0;font-size:16px;line-height:1.75}.aperture-study{background:#e6e9db;grid-template-columns:minmax(0,1fr) 265px;align-items:center;gap:0 24px;padding:22px;display:grid}.aperture-viewfinder{background:#243d32;border-radius:15px;width:100%;max-width:840px;margin:auto;position:relative;overflow:hidden}.aperture-photo{aspect-ratio:3/2;width:100%;height:auto;display:block}.viewfinder-top,.viewfinder-bottom{color:#eee9d1;font-variant-numeric:tabular-nums;text-shadow:0 1px 7px #13291d;justify-content:space-between;gap:12px;font-size:16px;display:flex;position:absolute;left:25px;right:25px}.viewfinder-top{top:18px}.viewfinder-bottom{bottom:18px}.viewfinder-focus{width:68px;height:68px;transition:left .7s,top .7s;position:absolute;transform:translate(-50%,-50%)}.viewfinder-bottom>span:first-child{white-space:nowrap}.viewfinder-bottom>span:last-child{text-align:right}.viewfinder-focus i{opacity:.7;border:solid #e0eac8;width:13px;height:13px;position:absolute}.viewfinder-focus i:first-child{border-width:1px 0 0 1px;top:0;left:0}.viewfinder-focus i:nth-child(2){border-width:1px 1px 0 0;top:0;right:0}.viewfinder-focus i:nth-child(3){border-width:0 0 1px 1px;bottom:0;left:0}.viewfinder-focus i:nth-child(4){border-width:0 1px 1px 0;bottom:0;right:0}.aperture-strip{flex-direction:column;align-items:center;gap:25px;padding:20px 8px;display:flex}.aperture-observation{width:100%}.aperture-study>.optics-model-note,.aperture-explore,.blur-study,.diffraction-note{grid-column:1/-1}.pupil-view{text-align:center;color:#68785f;font-size:14px}.pupil-view svg{width:112px;margin:0 auto 8px;display:block}.aperture-main-number{color:#4d664d;flex-direction:column;justify-content:space-between;align-items:baseline;gap:12px;display:flex}.aperture-main-number strong{font-variant-numeric:tabular-nums;font-size:32px;font-weight:500}.aperture-main-number span{font-size:16px}.depth-scale{background:#cbd2bd;border-radius:7px;height:13px;margin:26px 0 54px;position:relative}.depth-acceptable{background:#6f8b61;border-radius:7px;position:absolute;top:0;bottom:0}.depth-scale i{background:#d9e3ca;border-radius:50%;width:6px;height:6px;position:absolute;top:3px;transform:translate(-50%)}.depth-scale i[data-focused=true]{background:#f6f5d3;box-shadow:0 0 0 2px #eff7d84d}.depth-scale i span{white-space:nowrap;color:#6e7e65;font-size:12px;font-style:normal;position:absolute;top:18px;transform:translate(-35%)}.depth-scale>b{background:#425b43;width:2px;height:26px;position:absolute;top:-7px}.depth-scale i:nth-of-type(odd) span{top:34px}.aperture-observation p{color:#6e7d64;font-size:16px}.aperture-observation p strong{color:#425c42;margin-left:12px;font-weight:500}.aperture-explore{grid-template-columns:1fr 1fr;gap:24px;padding:24px 12px;display:grid}.aperture-explore>.btn{grid-column:1/-1;justify-self:center;min-height:44px}.blur-study{color:#69795e;align-items:center;gap:20px;padding:10px 20px;font-size:16px;display:flex}.blur-study svg{width:75%}.blur-study span{max-width:130px}.diffraction-note{color:#748369;border-top:1px solid #89977c44;justify-content:space-between;gap:15px;padding:18px 22px;font-size:16px;display:flex}.diffraction-note svg{width:180px;max-height:90px}.diffraction-note span{line-height:1.8}.aperture-viewfinder .blur-study,.aperture-viewfinder .diffraction-note{z-index:2;text-align:center;background:#e6e9db;border:0;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;display:flex;position:absolute;inset:0}.aperture-viewfinder .diffraction-note{color:#dde5c6;background:#243d32}.aperture-viewfinder .blur-study svg{width:100%;max-height:170px}.aperture-viewfinder .blur-study span{max-width:none;line-height:1.7}.aperture-viewfinder .diffraction-note svg{width:100%;max-height:210px}.aperture-viewfinder .diffraction-note strong{white-space:nowrap;margin-top:4px;font-size:26px;font-weight:500;display:block}@media (max-width:760px){.optical-bench{padding:20px 12px 16px}.optics-eyebrow{font-size:10px}.lens-object{height:340px;margin:0 -8px}.lens-views,.lens-plan{height:340px}.lens-observations{gap:12px;padding:0 4px 15px}.lens-observations>span{font-size:13px}.lens-observations strong{font-size:24px}.lens-observations small{font-size:11px}.lens-diagram{min-height:170px;margin:5px 0}.lens-diagram text{font-size:20px}.optics-explore{grid-template-columns:1fr;gap:18px;padding:20px 10px}.optics-model-note{font-size:16px}.aperture-study{padding:12px;display:block}.aperture-photo{aspect-ratio:1;object-fit:cover}.aperture-viewfinder{border-radius:12px}.viewfinder-top,.viewfinder-bottom{font-size:13px;left:15px;right:15px}.viewfinder-top{top:12px}.viewfinder-focus{width:44px;height:44px}.viewfinder-bottom{bottom:12px}.aperture-strip{grid-template-columns:75px 1fr;gap:15px;padding:20px 2px 5px;display:grid}.pupil-view svg{width:74px}.pupil-view{font-size:12px}.aperture-main-number{display:block}.aperture-main-number strong{font-size:27px;display:block}.aperture-main-number span{font-size:14px}.aperture-observation p strong{margin:4px 0 0;display:block}.aperture-explore{grid-template-columns:1fr;gap:18px;padding:18px 6px}.blur-study{padding:10px 0;display:block}.blur-study svg{width:100%}.diffraction-note{padding:16px 2px;display:grid}.aperture-viewfinder .blur-study,.aperture-viewfinder .diffraction-note{gap:12px;padding:12px;font-size:16px}.aperture-viewfinder .diffraction-note svg{max-height:110px}}@media (prefers-reduced-motion:reduce){.viewfinder-focus{transition:none}}.optical-bench .optics-eyebrow,.optical-bench .lens-observations>span,.optical-bench .lens-observations small,.optical-bench .control-top,.optical-bench .btn{font-size:16px}.optical-bench .optics-eyebrow{letter-spacing:0}.optical-bench .lens-views,.optical-bench .lens-object,.optical-bench .lens-plan{height:440px}.optical-bench .lens-diagram{min-height:0;max-height:none;margin:0}.optical-bench .lens-ray-field{width:100%;height:310px;display:block}.optical-bench .lens-diagram text{font-size:21px}.optical-bench .lens-plan{align-items:center;display:flex}.optical-bench .lens-plan>.lens-diagram{width:100%}.optical-bench .studio-fallback{justify-content:center}.optical-bench .lens-part-key{color:#425b43;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;padding:0;font-size:16px;list-style:none;display:grid}.optical-bench .lens-part-key li{align-items:baseline;gap:7px;display:flex}.optical-bench .lens-part-key b{color:#45695a;font-weight:500}.optical-bench .lens-outside-image{color:#5c4a63;margin:12px 0 0;font-size:16px;line-height:1.5}@media (max-width:760px){.optical-bench .optics-eyebrow>span:first-child{display:none}.optical-bench .lens-views,.optical-bench .lens-plan{height:365px}.optical-bench .lens-ray-field{aspect-ratio:300/280;height:auto}.optical-bench .lens-diagram text{font-size:22px}.optical-bench .lens-observations{grid-template-columns:1fr 1fr;gap:12px;padding:0 0 14px;display:grid}.optical-bench .lens-observations>span:last-child{grid-column:1/-1}.optical-bench .lens-observations>span:last-child strong{font-size:22px}.optical-bench .optics-explore{padding:20px 0}}.optical-bench .control output{font-size:16px}