@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--paper:#f4f1e9;--ink:#292e29;--muted:#64675e;--line:#d7d5ca;--yellow:#e7ad3d;--green:#3d594b;--body-size:17px;color-scheme:light;font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--paper);font-size:var(--body-size);line-height:1.6;scroll-behavior:smooth;scroll-padding-top:30px}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,a,select,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.4;cursor:default}button,a,input,select,summary{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--green)}[hidden]{display:none!important}.wrap{width:min(1320px,calc(100% - 96px));margin-inline:auto}.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:700;margin:0 0 20px}.masthead{display:flex;align-items:center;justify-content:space-between;min-height:104px;border-bottom:1px solid var(--line)}.wordmark{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;letter-spacing:.09em;text-decoration:none}.aperture-icon{font-size:31px;line-height:1}.brand-note{font-size:10px;font-weight:500;letter-spacing:.1em;border-left:1px solid var(--line);padding-left:16px;margin-left:7px}.masthead nav{display:flex;gap:30px;font-size:13px}.masthead nav a{text-decoration:none}.masthead nav a:hover{text-decoration:underline}.home-link{color:var(--muted)}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:40px 70px;padding-top:68px}.dot{display:inline-block;background:var(--green);width:7px;height:7px;border-radius:50%;margin-right:7px}.hero h1{font-family:Manrope,sans-serif;font-size:clamp(70px,7.9vw,112px);font-weight:500;letter-spacing:-.07em;line-height:1.04;margin:29px 0 28px}em{font-family:Georgia,serif;font-weight:400}h1 em{letter-spacing:-.06em}.intro{font-size:22px;line-height:1.45;margin:0 0 18px}.hero-detail{color:var(--muted);max-width:410px;font-size:17px;line-height:1.65}.start-link{display:flex;justify-content:space-between;align-items:center;gap:35px;width:260px;font-weight:600;font-size:14px;padding:14px 0;border-bottom:1px solid var(--ink);text-decoration:none;margin-top:26px}.start-link span{font-size:27px;font-weight:400}.hero-diagram{align-self:center;padding:32px 30px 22px;background:#eeeadf;transform:rotate(2deg)}.diagram-label{font-size:10px;letter-spacing:.15em}.hero-diagram svg{display:block;width:100%;margin-top:12px}.hero-diagram text{font:10px monospace;letter-spacing:.1em}.diagram-bottom{display:flex;justify-content:space-between;font:9px monospace;letter-spacing:.08em;border-top:1px solid #d0cbbc;padding-top:20px}.hero-footer{grid-column:1/-1;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:21px 0;font-size:10px;letter-spacing:.1em;margin-top:14px}.learning{padding-block:70px 90px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px}h2{font-family:Manrope,sans-serif;font-size:clamp(34px,3.5vw,49px);font-weight:500;line-height:1.2;letter-spacing:-.045em;margin:0}h2 em{letter-spacing:-.03em}.section-heading .eyebrow{margin-bottom:15px}.section-heading>p{font-size:14px;color:var(--muted);margin:0 0 5px}.lesson-nav{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:25px;border-bottom:1px solid var(--line);margin-bottom:30px}.lesson-nav a{display:flex;gap:9px;align-items:center;text-decoration:none;border:1px solid var(--line);border-radius:3px;padding:10px 13px;font-size:10px;color:var(--muted)}.lesson-nav a span{font-size:13px;color:var(--ink)}.lesson-nav a[aria-current="step"]{background:var(--ink);border-color:var(--ink);color:#bbbeb5}.lesson-nav a[aria-current="step"] span{color:var(--paper)}.lesson-nav a:hover{border-color:var(--ink)}.workbench{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:50px;align-items:start}.viewfinder{position:relative;background:#bbcecc;overflow:hidden;aspect-ratio:4/3}.viewfinder>canvas{width:100%;height:100%;display:block}.viewfinder-top,.viewfinder-bottom{display:flex;justify-content:space-between;position:absolute;left:23px;right:23px;color:white;font:10px monospace;letter-spacing:.08em;text-shadow:0 1px 5px #000}.viewfinder-top{top:20px}.viewfinder-bottom{bottom:20px}.viewfinder-top i{display:inline-block;width:6px;height:6px;background:var(--yellow);border-radius:50%;margin-right:5px}.focus-mark{position:absolute;left:50%;top:50%;width:38px;height:38px;border:1px solid #ffffffe0;transform:translate(-50%,-50%);clip-path:polygon(0 0,30% 0,30% 6%,6% 6%,6% 30%,0 30%,0 0,100% 0,100% 30%,94% 30%,94% 6%,70% 6%,70% 0,100% 0,100% 100%,70% 100%,70% 94%,94% 94%,94% 70%,100% 70%,100% 100%,0 100%,0 70%,6% 70%,6% 94%,30% 94%,30% 100%,0 100%)}.simulation-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;font-size:11px;color:var(--muted)}button{border:1px solid var(--line);background:transparent;color:var(--ink);padding:8px 12px;border-radius:3px;font-size:13px;min-height:42px}button:hover{border-color:var(--ink)}.simulation-caption button{padding:3px 10px;min-height:34px;font-size:11px}.simulation-caption button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.model-note{font-size:12px;line-height:1.6;color:var(--muted);min-height:39px;margin:12px 0 24px}.controls{display:grid;gap:23px}.control-title{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:500;gap:10px}.control-title output{font:600 18px Manrope,sans-serif;letter-spacing:-.025em}.control input[type=range]{width:100%;display:block;accent-color:var(--ink);margin:15px 0 8px;height:22px;cursor:pointer}.range-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.reset-row{display:flex;justify-content:end}.reset-row button{font-size:11px;min-height:34px}.scene-feedback{font-size:13px;margin:20px 0 0;border-left:2px solid var(--yellow);padding-left:13px;min-height:45px}.lesson-content{min-width:0}.lesson .eyebrow{color:var(--green);margin:0 0 10px}.lesson h3{font-family:Manrope,sans-serif;letter-spacing:-.05em;font-size:38px;font-weight:500;line-height:1.2;margin:0 0 14px}.lesson p{font-size:17px;line-height:1.7;margin:14px 0}.lesson .lesson-lead{font-family:Georgia,serif;font-style:italic;font-size:23px;line-height:1.4;margin-bottom:20px}.lesson dl{margin:22px 0;padding:19px 0;border-block:1px solid var(--line);font-size:16px}.lesson dt{font-weight:700;margin-bottom:4px}.lesson dt:not(:first-child){margin-top:15px}.lesson dd{margin:0;color:var(--muted)}.lesson .try{background:#e9e7db;padding:16px 20px;font-size:16px}.try strong{display:block;font-size:12px;margin-bottom:4px}.lesson .phone-note{font-size:13px;color:var(--muted);margin-top:23px}.phone-note strong{color:var(--ink);display:block;margin-bottom:4px}.lesson-pagination{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:20px;margin-top:25px;gap:8px}.lesson-pagination span{font:10px monospace;color:var(--muted)}.lesson-pagination button{font-size:12px;border:0;padding-inline:0}.histogram-panel{padding:18px 20px;background:#e9e7db;margin-top:24px}.histogram-panel>div{display:flex;justify-content:space-between;gap:10px;align-items:center}.histogram-panel .eyebrow{margin:0;font-size:10px}.histogram-panel canvas{width:100%;height:70px;margin-top:15px;display:block}#exposure-meter{font:12px monospace}.histogram-labels{font-size:10px;color:var(--muted)}.practice{border-block:1px solid var(--ink);display:grid;grid-template-columns:1fr 1fr;gap:70px;padding-block:45px}.practice h2{font-size:38px}.practice>div>p:last-child{font-size:14px;color:var(--muted);margin-bottom:0}.assignment label{display:block;font-size:12px;font-weight:600;margin-bottom:8px}.assignment select{width:100%;padding:13px 14px;border:1px solid var(--ink);border-radius:2px;background:transparent;color:var(--ink);font-size:15px}.assignment p{font-size:14px}.mission-actions{display:flex;gap:12px;flex-wrap:wrap}.dark-button{background:var(--ink);color:var(--paper);border-color:var(--ink)}#mission-result{font-weight:500;color:var(--green);margin-bottom:0}.field-notes{padding-block:85px 75px}.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 50px;align-items:start}details{border-top:1px solid var(--line)}summary{display:flex;align-items:center;gap:17px;font-size:15px;padding:23px 0;cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}summary>span{font:10px monospace;color:var(--muted)}summary b{margin-left:auto;font-size:22px;font-weight:400}details[open] summary b{transform:rotate(45deg)}details p{font-size:16px;color:var(--muted);margin:0 0 24px 32px}.phone-guide{background:var(--yellow);padding:40px 45px 30px}.phone-guide .eyebrow{margin-bottom:13px}.phone-guide h2{font-size:37px}.phone-guide ol{display:grid;grid-template-columns:1fr 1fr;gap:18px 50px;list-style:none;counter-reset:steps;padding:0;margin:30px 0}.phone-guide li{counter-increment:steps;position:relative;padding-left:30px;font-size:14px}.phone-guide li:before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;top:3px;font:10px monospace}.phone-guide li strong{display:block}.phone-guide-note{border-top:1px solid #292e2930;padding-top:20px;font-size:12px;max-width:900px}.sources{padding-block:60px}.sources h2{font-family:'DM Sans',sans-serif;font-size:19px;font-weight:600;letter-spacing:0}.sources p{font-size:12px;color:var(--muted);max-width:900px}.sources ol{columns:2;font-size:12px;padding-left:18px}.sources li{padding:4px 10px;break-inside:avoid}footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-block:27px;font-size:11px;color:var(--muted)}footer .wordmark{font-size:11px;color:var(--ink)}footer>a:last-child{text-decoration:none}.skip{position:fixed;top:12px;left:20px;opacity:0;pointer-events:none;background:var(--ink);color:white;padding:12px 20px;z-index:10}.skip:focus{opacity:1;pointer-events:auto}.notice{padding:15px;background:#e9e7db}.workbench:not(:has(.simulator:not([hidden]))){display:block}.lesson-content>.lesson:not([hidden])~.lesson:not([hidden]){margin-top:50px}
@media(min-width:1500px){.hero{padding-top:85px}.hero-diagram{max-width:480px;justify-self:end}}
@media(max-width:1050px){.wrap{width:calc(100% - 64px)}.hero{gap:35px}.hero h1{font-size:82px}.brand-note{display:none}.workbench{gap:30px}.lesson h3{font-size:32px}.lesson .lesson-lead{font-size:21px}.lesson p{font-size:17px}.hero-diagram{padding:20px}.practice{gap:35px}.lesson-nav a{padding:9px 10px}}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}.masthead{min-height:78px}.wordmark{font-size:12px;gap:7px}.aperture-icon{font-size:26px}.masthead nav{gap:17px;font-size:12px}.masthead .home-link{display:none}.masthead nav a:first-child{display:none}.hero{grid-template-columns:1fr;padding-top:44px;gap:35px}.hero h1{font-size:clamp(64px,15vw,96px);margin-top:24px}.hero .eyebrow{font-size:10px}.intro{font-size:21px}.hero-detail{font-size:17px}.hero-diagram{display:none}.hero-footer{font-size:8px;gap:18px;margin-top:3px;line-height:1.7}.hero-footer span:last-child{max-width:120px;text-align:right}.learning{padding-block:45px 55px}.section-heading{display:block;margin-bottom:25px}.section-heading>p{margin-top:16px}.section-heading .eyebrow{font-size:10px}.lesson-nav{gap:7px;padding-bottom:20px;margin-bottom:22px}.lesson-nav a{padding:9px 10px;font-size:9px;gap:7px}.lesson-nav a span{font-size:12px}.workbench{grid-template-columns:1fr;gap:33px}.viewfinder-top,.viewfinder-bottom{left:16px;right:16px;font-size:8px}.viewfinder-top{top:15px}.viewfinder-bottom{bottom:15px}.model-note{min-height:0;margin-bottom:20px}.lesson h3{font-size:33px}.lesson p{font-size:17px}.lesson .lesson-lead{font-size:23px}.lesson dl{font-size:16px}.lesson .try{font-size:16px}.lesson .phone-note{font-size:13px}.practice{grid-template-columns:1fr;gap:30px;padding-block:30px}.practice h2{font-size:34px}.mission-actions button{font-size:12px}.field-notes{padding-block:55px 40px}.notes-grid{grid-template-columns:1fr}.notes-grid details:last-child{border-bottom:1px solid var(--line)}summary{font-size:15px;padding-block:21px}.phone-guide{padding:28px 23px 20px}.phone-guide h2{font-size:31px}.phone-guide ol{grid-template-columns:1fr;gap:20px}.sources{padding-block:40px}.sources ol{columns:1}.sources li{padding-block:7px}footer{flex-wrap:wrap;padding-block:23px}footer span{order:3;width:100%}.controls{gap:20px}.scene-feedback{font-size:13px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}}
