:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f1f2f4;background:#101215;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0}html,body,#root{height:100%;overflow:hidden}#root{display:grid;grid-template-rows:48px 48px minmax(0,1fr) 24px}button,select,input{font:inherit}button,select{border:1px solid #40454e;border-radius:6px;background:#272b31;color:#fff;padding:7px 9px;font-size:12px}button{cursor:pointer;font-weight:600}button:not(.capture-tile):not(.focus-point){display:inline-flex;align-items:center;justify-content:center;gap:6px}button:hover{background:#343a42}button:disabled,input:disabled{opacity:.5;cursor:default}:focus-visible{outline:2px solid #ffb36d;outline-offset:2px}input[type=range]{width:100%;accent-color:#f3934e;min-height:26px;cursor:pointer;margin:0}select{width:100%;margin-top:4px}p{line-height:1.4}h1,h2,p{margin:0}h2{font-size:16px;font-weight:600}button{min-height:30px}.app-header{display:flex;align-items:center;gap:24px;border-bottom:1px solid #30343b;padding:0 16px}.brand{display:flex;gap:8px;align-items:center}.brand h1{font-size:23px;letter-spacing:-1px}.brand h1 span,.brand-mark{color:#f3934e}.brand-mark{font-size:28px}.app-purpose{font-size:12px;color:#abb0b9}.version{margin-left:auto;font-size:10px;color:#bac2cd}.scene-picker{display:flex;align-items:center;gap:12px;padding:8px 16px;font-size:12px}.scene-picker select{width:240px;margin:0}.workspace{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 252px 240px;gap:12px;padding:0 12px 10px}.view-panel{min-width:0;min-height:0;display:flex;flex-direction:column;gap:8px}.section-heading{display:flex;justify-content:space-between;gap:8px;align-items:center}.eyebrow{display:block;color:#e6a06a;font-size:9px;letter-spacing:1.3px;margin-bottom:4px}.tag{font-size:10px;color:#bac2cd;margin-left:8px}.mode-tag{font-size:9px;color:#bac2cd;white-space:nowrap}.gear-toggle{align-self:flex-start}.gear-toggle[aria-pressed=true]{border-color:#f3934e;color:#ffb36d}.photo-stage{flex:1;min-height:0;container-type:size;display:flex;align-items:center;justify-content:center;background:#08090b;border-radius:8px}.viewfinder{position:relative;width:min(100cqw,150cqh);aspect-ratio:3/2;background:#08090b;overflow:hidden}.viewfinder canvas{display:block;width:100%;height:100%}.viewfinder canvas[hidden]{visibility:hidden;display:block}.camera-readout{position:absolute;bottom:8px;left:8px;display:flex;gap:12px;background:#101215dd;padding:5px 8px;font:11px ui-monospace,monospace;pointer-events:none}.transport{display:flex;align-items:center;gap:8px}.shutter-button{align-self:center;width:56px;height:56px;flex:0 0 56px;padding:5px;border:2px solid #f3934e;border-radius:50%;background:#101215}.shutter-button span{display:flex;align-items:center;justify-content:center;color:#21160e;width:100%;height:100%;border-radius:50%;background:#f3934e}.shutter-button:hover span{background:#ffb271}.shutter-button:active:not(:disabled) span{transform:scale(.9)}.capture-status,.footnote{font-size:10px;color:#b8c0cc}.timeline{font-size:11px;display:flex;align-items:center;gap:10px;white-space:nowrap}.timeline input{flex:1;min-width:0}.footnote{color:#989faa}.settings-panel,.focus-panel{min-width:0;min-height:0;border:1px solid #353a42;background:#1b1e23;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:8px}.manual{border:1px solid #ef9b5b;color:#ef9b5b;border-radius:4px;padding:5px 7px}.mode-control{font-size:12px}.mode-help{font-size:10px;color:#c8cdd5}.control{display:block;border-bottom:1px solid #343941;padding-bottom:8px}.control>span{font-size:12px;font-weight:600}.control small{float:right;color:#a4acb7;font-size:9px;font-weight:400}.slider-value{display:block;color:#f5bc91;font:20px ui-monospace,monospace;margin-top:5px}.slider-ends{display:flex;justify-content:space-between;font-size:9px!important;color:#bac2cd;font-weight:400!important}.control p{font-size:10px;color:#aeb5bf;margin-top:4px}.meter{margin-top:auto}.meter>div:first-child{display:flex;justify-content:space-between;align-items:center}.meter span{font-size:9px;color:#afb7c2}.meter strong{font:20px ui-monospace,monospace;color:#f3b585}.meter strong small{font-size:10px}.meter-track{height:12px;position:relative;margin-top:8px;border-bottom:1px solid #798290;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(16.666% - 1px),#58606b calc(16.666% - 1px),#58606b 16.666%)}.meter-track i{position:absolute;top:0;width:3px;height:14px;background:#f3934e}.meter-labels{display:flex;justify-content:space-between;margin-top:3px}.meter p{font-size:10px;color:#c8cdd5;margin-top:4px}.focus-points{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.focus-point{position:absolute;transform:translate(-50%,-50%);width:28px;height:28px;min-height:28px;padding:0;border:2px solid white;border-radius:2px;background:transparent;box-shadow:0 0 0 1px #111;pointer-events:auto}.focus-point:hover{background:#fff2}.focus-point[aria-pressed=true]{border-color:#6cff83;box-shadow:0 0 0 1px #123019}.focus-joystick{font-size:12px}.focus-pad{display:grid;width:max-content;grid-template-columns:repeat(3,32px);grid-template-rows:repeat(3,30px);gap:3px;margin:6px auto}.focus-pad button{padding:0;font-size:18px}.focus-pad button:first-child{grid-column:2}.focus-pad button:nth-child(2){grid-column:1;grid-row:2}.focus-pad button:nth-child(3){grid-column:2;grid-row:2}.focus-pad button:nth-child(4){grid-column:3;grid-row:2}.focus-pad button:nth-child(5){grid-column:2;grid-row:3}.focus-actions{display:flex;gap:6px}.focus-actions button{flex:1;padding:6px 4px;font-size:10px;white-space:nowrap}.focus-joystick p{font-size:10px;color:#bac2cd;margin-top:5px}.extra{border-top:1px solid #343941;padding-top:8px}.extra h2{font-size:13px}.extra label{display:block;font-size:11px;margin-top:6px}.extra p{font-size:10px;color:#aeb5bf;margin-top:4px}.reset{margin-top:auto;width:100%;background:transparent}footer{display:flex;justify-content:space-between;border-top:1px solid #30343b;padding:4px 16px;color:#969faa;font-size:10px}.error{background:#432529;padding:12px;color:#ffd7d7;border-radius:8px}.lesson{background:#1b1e23;color:#f1f2f4;border:1px solid #58606b;border-radius:10px;padding:24px;width:min(640px,90vw);max-height:85vh}.lesson::backdrop{background:#0009}.lesson>button{float:right}.lesson-number{color:#f3934e}.lesson h2{margin:10px 0}.lesson p{font-size:14px;margin:14px 0}.lesson summary{cursor:pointer;font-size:13px}@media(max-height:700px){.settings-panel,.focus-panel{padding:8px;gap:6px}.control{padding-bottom:3px}.control p{font-size:9px}.slider-value{font-size:18px;margin-top:2px}.focus-joystick p{font-size:9px}.extra label{margin-top:4px}.extra p{font-size:9px}.app-header .app-purpose{display:none}}@media(max-height:700px){.control p,.slider-ends{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.meter{padding-top:0}.focus-panel{gap:5px}}.scene-picker label{display:flex;align-items:center;gap:12px}.focus-panel{margin:0}.focus-panel:disabled{opacity:.55}.focus-joystick{border:0;padding:0;margin:0;min-width:0}.focus-joystick:disabled{opacity:.55}.camera-view{display:contents}.camera-view[hidden]{display:none}.capture-browser{min-height:0;display:flex;flex-direction:column;padding:12px;gap:12px}.capture-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.capture-toolbar p,.capture-toolbar label{font-size:12px;color:#bac2cd}.capture-toolbar label{width:180px}.capture-grid{min-height:0;overflow:auto;display:grid;align-content:start;gap:10px;padding:4px}.capture-tile{display:flex;flex-direction:column;gap:8px;min-width:0;border-radius:2px;padding:8px;text-align:left;background:#161c24;border-color:#34404d}.capture-tile img{width:100%;aspect-ratio:3/2;object-fit:contain;background:#08090b}.capture-tile span{font:12px ui-monospace,monospace;color:#f5bc91}.capture-empty{padding:32px;color:#bac2cd}.capture-detail{width:min(1000px,90vw);max-height:90vh;overflow:auto;background:#1b1e23;color:#f1f2f4;border:1px solid #58606b;border-radius:8px;padding:16px}.capture-detail::backdrop{background:#000b}.capture-detail>button{float:right}.capture-detail img{display:block;max-width:100%;max-height:65vh;margin:12px auto}.capture-detail p{font-size:13px;margin-top:8px}.view-navigation{display:flex;align-items:center;gap:4px;background:#1b1e23;border:1px solid #40454e;border-radius:8px;padding:3px}.view-navigation button{min-width:110px;border:0;background:transparent;color:#bac2cd}.view-navigation button[aria-pressed=true]{background:#f3934e;color:#1c130b}.view-navigation button:hover{background:#343a42;color:#fff}.view-navigation button[aria-pressed=true]:hover{background:#ffb271;color:#1c130b}.scene-picker{justify-content:space-between;border-bottom:1px solid #30343b;padding-top:4px;padding-bottom:4px}.scene-picker label[hidden]{display:none}button svg{flex-shrink:0}.control>span:first-child{display:flex;align-items:center;gap:6px}.control small{float:none;margin-left:auto}.extra label>svg{vertical-align:middle;margin-right:6px}.sound-toggle{width:32px;height:32px;padding:0;background:transparent;border-color:transparent;color:#bac2cd}.sound-toggle[aria-pressed=false]{color:#8b939f}.scene-picker label{margin-left:auto}.settings-panel,.focus-panel{overflow-y:auto;scrollbar-width:thin}.settings-panel>*{flex-shrink:0}.transport button{white-space:nowrap}.transport .movie-reset{margin-left:auto}@media(max-height:700px){.settings-panel{gap:4px}.settings-panel input[type=range]{min-height:22px}.settings-panel .mode-help{font-size:9px}.settings-panel .shutter-button{width:48px;height:48px;flex-basis:48px}}@media(max-width:1023px),(max-height:559px){html,body{height:auto;min-height:100%;overflow:auto}#root{height:auto;min-height:100dvh;overflow:visible;grid-template-rows:auto auto 1fr auto}.app-header{min-height:48px}.app-purpose{display:none}.scene-picker{flex-wrap:wrap;padding:8px 12px}.scene-picker label{flex:1;justify-content:flex-end;min-width:0}.scene-picker select{width:auto;max-width:240px;min-width:0;flex:1}.workspace{grid-template-columns:repeat(2,minmax(0,1fr));padding-top:12px;align-items:start}.view-panel{grid-column:1/-1}.photo-stage{container-type:normal;flex:none}.viewfinder{width:100%;max-width:960px}.settings-panel,.focus-panel{overflow:visible;padding:12px;gap:10px}.settings-panel input[type=range]{min-height:32px}.settings-panel .mode-help{font-size:11px}.control p,.slider-ends{position:static!important;width:auto!important;height:auto!important;padding:0!important;margin:4px 0 0!important;overflow:visible;clip-path:none;white-space:normal}.meter{margin-top:4px}.capture-grid{overflow:visible}footer{gap:8px;flex-wrap:wrap;min-height:24px}}@media(max-width:599px){.app-header{gap:12px;padding:0 12px}.version{font-size:9px}.scene-picker{gap:8px}.view-navigation{width:100%}.view-navigation button{flex:1;min-width:0}.scene-picker label{flex-basis:100%;justify-content:space-between}.scene-picker select{max-width:none}.workspace{grid-template-columns:minmax(0,1fr);gap:12px}.section-heading{flex-wrap:wrap}.tag{display:block;margin:4px 0 0}.transport{flex-wrap:wrap;gap:6px}.transport button{padding:7px;font-size:11px}button,select{min-height:40px}.sound-toggle{width:40px;height:40px}.focus-point{min-height:28px}.focus-pad{grid-template-columns:repeat(3,40px);grid-template-rows:repeat(3,40px)}.control>span{font-size:14px}.extra label{font-size:13px}.control p,.focus-joystick p,.extra p,.capture-status,.footnote{font-size:12px}.extra input[type=range]{min-height:36px}.capture-toolbar{align-items:stretch;flex-direction:column;gap:12px}.capture-toolbar label{width:100%}.capture-empty{padding:16px}.capture-detail{width:calc(100% - 24px);padding:12px}}.wb-presets{display:flex;gap:4px;margin-top:8px}.wb-presets button{flex:1;min-width:0;padding:4px;font-size:10px}.wb-presets button[aria-pressed=true]{background:#f3934e;border-color:#f3934e;color:#21160e}.view-panel[hidden],.focus-panel[hidden]{display:none}.mechanics-workspace{grid-template-columns:minmax(0,1fr) 252px}.mechanics-panel{min-height:0;overflow:auto;background:#171c23;border:1px solid #353a42;border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:12px}.mechanics-panel p,.mechanics-scrub{font-size:12px;color:#bac2cd}.camera-cutaway{display:block;width:100%;max-height:420px;flex-shrink:0}.camera-cutaway text{fill:#e8edf3;font-size:14px}.mechanics-transport{display:flex;gap:8px}.mechanics-scrub{display:block}.mechanics-panel .footnote{font-size:11px}@media(max-width:1023px),(max-height:559px){.mechanics-workspace{grid-template-columns:minmax(0,1fr)}.mechanics-panel{overflow:visible}}.aperture-opening{transition:r .2s ease}@media(prefers-reduced-motion:reduce){.aperture-opening{transition:none}}.mechanics-views{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px}.mechanics-view{margin:0;min-width:0;background:linear-gradient(145deg,#1e2630,#10161e);border:1px solid #36404d;border-radius:12px;padding:16px}.mechanics-view figcaption{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:center}.mechanics-view figcaption>span{grid-column:1/-1;font-size:9px;letter-spacing:1.5px;color:#96a4b4}.mechanics-view figcaption strong{font-size:15px;font-weight:500}.mechanics-view output{font:16px ui-monospace,monospace;color:#f5bc91}.mechanics-view svg{width:100%;display:block;margin:10px 0}.mechanics-view p{font-size:12px}.mechanics-view p strong{color:#e0e7ef;font-weight:500}.mechanics-view p span{display:block;margin-top:5px;font-size:11px;color:#91a0b2}@media(max-width:700px){.mechanics-views{grid-template-columns:minmax(0,1fr)}.mechanics-view{padding:12px}}.mechanics-notes summary{cursor:pointer;font-size:11px;color:#9daabc}.mechanics-notes p{margin-top:8px}.scene-picker .brand-picker{margin-left:0;flex:0 0 auto;gap:8px}.scene-picker .brand-picker select{width:90px}@media(max-width:599px){.scene-picker .brand-picker{flex:1 0 100%}.scene-picker .brand-picker select{width:auto}}.help-toggle{background:transparent;border-color:transparent}.exposure-help{width:min(680px,calc(100% - 24px));max-height:90dvh;overflow:auto;padding:24px;background:#171d25;color:#eef2f7;border:1px solid #4d5968;border-radius:12px}.exposure-help::backdrop{background:#000b}.help-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.exposure-help h2{font-size:24px;margin:16px 0}.exposure-help p{font-size:14px;line-height:1.6;margin:14px 0;color:#c3cdd8}.exposure-help progress{width:100%;height:6px;accent-color:#f3934e}.exposure-help .help-progress{font-size:12px;margin:8px 0}.help-comparison{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:20px 0}.help-comparison>div,.help-course{padding:18px;border:1px solid #3b4858;border-radius:8px;background:#202a35}.help-comparison span{font-size:15px;color:#ffb779}.help-comparison strong{display:block;margin:8px 0;font-size:18px}.help-comparison p{font-size:12px;margin:0}.help-actions{display:flex;justify-content:space-between;gap:12px;margin-top:24px}.help-primary{background:#f3934e;color:#20150b;border-color:#f3934e}.help-primary:hover{background:#ffb779}.help-course h3{font-size:18px;margin:12px 0}.help-course-icons{display:flex;gap:16px;color:#ffb779}.exposure-help details{margin-top:18px;font-size:14px}.exposure-help summary{cursor:pointer;line-height:1.5}.exposure-help .help-takeaway{border-left:2px solid #f3934e;padding-left:14px}@media(max-width:599px){.app-header .version{display:none}.app-header .help-toggle{margin-left:auto}.exposure-help{padding:16px}.exposure-help h2{font-size:21px}.help-comparison{grid-template-columns:1fr}}.photo-quiz{padding:10px 12px;background:#242d37;border:1px solid #bc8757;border-radius:8px;flex-shrink:0}.quiz-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.photo-quiz strong{font-size:13px}.photo-quiz p,.photo-quiz summary{font-size:12px;line-height:1.4;margin:6px 0}.photo-quiz summary{cursor:pointer}.quiz-result{color:#f3bc8f;font-size:12px}.help-course+.help-course{margin-top:16px}.quiz-view{overflow-y:auto}.quiz-view .photo-stage{min-height:220px;flex-shrink:0}@media(max-width:1023px),(max-height:559px){.quiz-view{overflow:visible}.quiz-view .photo-stage{min-height:0}}.assessment-field{display:block;margin:12px 0;font-size:14px}.assessment-field input{display:block;width:100%;padding:8px;margin-top:6px;border:1px solid #526072;border-radius:5px;background:#111820;color:#fff}.assessment-question{border:1px solid #425065;border-radius:6px;padding:12px;margin:18px 0}.assessment-question legend{font-size:14px;padding:0 4px}.assessment-question label{display:flex;align-items:center;gap:10px;margin:12px 0;font-size:14px}.assessment-question input{accent-color:#f3934e}
