: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}.reset-button{width:40px;height:40px;padding:0;background:transparent}.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}.shutter-blackout{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:grid;place-items:center;background:#050607;color:#fff}.shutter-blackout span{padding:7px 10px;border:1px solid #59616d;border-radius:5px;background:#16191e;font:12px ui-monospace,monospace}.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}.manual.auto-mode{border-color:#62d26f;color:#62d26f}.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{touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab}.focus-point:active{cursor:grabbing}.focus-point:before{content:"";position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px}.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;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));align-content:start;gap:18px;padding:8px}.capture-tile{display:flex;flex-direction:column;gap:0;min-width:0;border-radius:2px;padding:0;text-align:left;background:#171717;border-color:#47413a;overflow:hidden}.capture-film-frame{display:block;padding:10px 10px 0;background:#181714}.capture-film-frame img{display:block;width:100%;aspect-ratio:3/2;object-fit:contain;background:#08090b}.capture-caption{display:flex;flex-direction:column;gap:6px;padding:12px 14px 16px;min-width:0;color:#e8dfce}.capture-caption strong{font-size:12px;overflow-wrap:anywhere}.capture-exposure{font:12px ui-monospace,monospace;color:#f5bc91;overflow-wrap:anywhere}.capture-caption .quiz-result{font-size:11px}.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:12px/1.5 ui-monospace,monospace;color:#f5bc91;margin-top:10px;overflow-wrap:anywhere}.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}.about-view{min-height:0;overflow:auto;padding:clamp(20px,4vw,48px);background:#151a21}.about-view[hidden]{display:none}.about-content{max-width:850px;margin:0 auto}.about-eyebrow{color:#ffb779;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.about-view h2{font-size:clamp(28px,4vw,42px);line-height:1.1;margin:12px 0 18px;max-width:700px}.about-intro{font-size:clamp(17px,2vw,21px);line-height:1.5;color:#d6dce5;max-width:700px}.about-view section{border-top:1px solid #3b4858;padding:24px 0;margin-top:28px}.about-view h3{font-size:17px;color:#ffb779;margin:0 0 12px}.about-view section p{font-size:15px;line-height:1.65;color:#d0d7e1;max-width:720px;margin:0 0 12px}.about-view a{color:#ffb779;text-underline-offset:3px}.about-view a:hover{color:#ffd0a6}.viewfinder{border:2px solid #59616d;box-shadow:inset 0 0 0 3px #08090b,0 0 0 1px #08090b}.viewfinder-settings-button{position:absolute;z-index:11;top:8px;right:8px;min-height:32px;background:#101820e8;border-color:#75818f}.camera-settings-menu{position:absolute;top:0;right:0;bottom:0;left:0;z-index:9;overflow:auto;background:#111820;padding:18px 20px;color:#e7ebf1}.camera-settings-menu h3{font-size:17px;padding-right:130px;margin:0 0 12px}.camera-settings-tabs{display:flex;gap:4px;border-bottom:1px solid #52606c;padding-bottom:7px}.camera-settings-tabs button{border:0;background:transparent}.camera-settings-tabs button[aria-pressed=true]{background:#f3934e;color:#20150b}.camera-settings-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;padding-top:12px}.camera-settings-fields label{display:block;min-width:0;font-size:12px;color:#cbd3dc}.camera-settings-fields select{margin-top:4px;min-height:32px;background:#24303c}.camera-display-fields{display:flex;flex-direction:column;gap:12px}.camera-display-fields label{display:flex;align-items:center;gap:10px;font-size:14px}.camera-display-fields input{width:18px;height:18px;accent-color:#f3934e}.camera-display-fields p{font-size:12px;color:#cbd3dc}.settings-open video{visibility:hidden}.viewfinder-grid,.viewfinder-horizon{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}.viewfinder-grid{background:linear-gradient(90deg,transparent 33.2%,#ffffff99 33.33%,transparent 33.5%,transparent 66.5%,#ffffff99 66.67%,transparent 66.8%),linear-gradient(0deg,transparent 33.2%,#ffffff99 33.33%,transparent 33.5%,transparent 66.5%,#ffffff99 66.67%,transparent 66.8%)}.viewfinder-horizon{display:grid;place-items:center}.viewfinder-horizon span{display:block;width:80%;border-top:1px solid #ffcb88;box-shadow:0 1px 2px #000}.viewfinder-histogram{position:absolute;right:8px;bottom:8px;z-index:3;width:140px;padding:5px;border:1px solid #9aa4b1;background:#101820dd;pointer-events:none}.histogram{border-top:1px solid #4b5865;padding-top:8px}.histogram>strong{font-size:10px;letter-spacing:.08em;color:#c9d4e0}.histogram svg{display:block;width:100%;height:64px;margin-top:5px;background:#101820;border:1px solid #5b6773}.histogram-labels{display:flex;justify-content:space-between;font-size:9px;color:#b9c3cf}.histogram p{font-size:10px;color:#c9d4e0;margin-top:5px}.histogram-compact{padding:0;border:0}.histogram-compact svg{height:42px;margin:0}.meter-dial{position:relative;height:52px;margin-top:6px;border-bottom:2px solid #798290;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(16.666% - 1px),#58606b calc(16.666% - 1px),#58606b 16.666%)}.meter-dial i{position:absolute;bottom:0;left:50%;height:45px;width:3px;background:#f3934e;transform-origin:bottom center;transition:transform .15s ease}.meter-dial i:after{content:"";position:absolute;top:-3px;left:-3px;width:9px;height:9px;border-radius:50%;background:#f3934e}.screen-reader-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.shutter-curtains{position:absolute;top:0;right:0;bottom:0;left:0;z-index:7;overflow:hidden;pointer-events:none}.shutter-curtain-top,.shutter-curtain-bottom{position:absolute;left:0;width:100%;height:50%;background:repeating-linear-gradient(0deg,#111821 0,#111821 19%,#3e4a58,#111821 21%);transition:transform .22s ease-in-out}.shutter-curtain-top{top:0}.shutter-curtain-bottom{bottom:0}.shutter-opening .shutter-curtain-top,.shutter-open .shutter-curtain-top{transform:translateY(-100%)}.shutter-opening .shutter-curtain-bottom,.shutter-open .shutter-curtain-bottom{transform:translateY(100%)}.shutter-curtains em{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:4px 7px;background:#101820dc;color:#fff;font:10px ui-monospace,monospace;white-space:nowrap}@media(max-width:599px){.camera-settings-menu{padding:12px}.camera-settings-menu h3{font-size:14px}.camera-settings-fields{gap:6px;grid-template-columns:1fr 1fr}.camera-settings-fields label{font-size:10px}.camera-settings-fields select{min-height:28px;font-size:10px}.camera-settings-tabs button{min-height:30px}.viewfinder-settings-button{top:4px;right:4px;font-size:10px;min-height:28px}.viewfinder-histogram{width:90px}}@media(prefers-reduced-motion:reduce){.meter-dial i,.shutter-curtain-top,.shutter-curtain-bottom{transition:none}.shutter-curtains{display:none}}.scene-actions{display:flex;align-items:center;gap:6px}.camera-settings-button{min-height:32px;background:#242c36;color:#f1f2f4}.viewfinder-meter{position:absolute;z-index:4;right:7px;top:50%;transform:translateY(-50%);width:27px;height:40%;min-height:95px;max-height:180px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px 3px;border:1px solid #b3bdc7;border-radius:4px;background:#101820d9;color:#fff;font:700 14px ui-monospace,monospace;pointer-events:none}.viewfinder-meter-scale{position:relative;flex:1;width:7px;border-radius:4px;background:linear-gradient(#fff 0 45%,transparent 45% 55%,#fff 55% 100%)}.viewfinder-meter-scale i{position:absolute;left:-9px;width:24px;height:2px;background:#ffad6e;box-shadow:0 0 0 1px #161616;transition:top .15s ease}.viewfinder-histogram{right:42px}.scene-actions .reset-button{flex:0 0 40px}@media(max-width:599px){.camera-settings-button{font-size:11px;padding:5px 7px}.viewfinder-meter{right:3px;width:22px;font-size:11px;min-height:70px}.viewfinder-meter-scale i{left:-7px;width:20px}.viewfinder-histogram{right:30px}}@media(prefers-reduced-motion:reduce){.viewfinder-meter-scale i{transition:none}}.viewfinder-meter{right:0;background:transparent;border:0;text-shadow:0 1px 2px #000,0 0 2px #000}.viewfinder-meter-scale{box-shadow:0 0 1px 1px #111}.viewfinder-meter-scale i{top:50%;left:-27px;width:34px;height:2px;transform-origin:right center;box-shadow:0 0 0 1px #111,0 1px 2px #111;transition:transform .15s ease}.viewfinder-meter-scale i:after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;border-radius:50%;background:#ffad6e}.viewfinder-histogram{right:38px}@media(max-width:599px){.viewfinder-meter{right:0}.viewfinder-meter-scale i{left:-22px;width:28px}.viewfinder-histogram{right:28px}}.shutter-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;list-style:none;margin:0;padding:0}.shutter-stages li{padding:7px 3px;border:1px solid #52606c;border-radius:4px;text-align:center;color:#bfcbd6;font-size:11px}.shutter-stages li.current{background:#f3934e;border-color:#f3934e;color:#20150b;font-weight:700}.mechanics-heading{display:flex;align-items:center;gap:12px}.mechanics-heading .shutter-button{margin-left:auto}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}@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}}.capture-actions{display:flex;align-items:center;justify-content:center;flex:0 0 auto;padding:2px 0}@media(max-width:599px){.capture-actions{padding:4px 0}.app-header{gap:12px;padding:0 12px}.version{font-size:9px}.scene-picker{gap:8px}.view-navigation{width:100%;flex-wrap:wrap}.view-navigation button{flex:1 1 28%;min-width:0}.about-view{overflow:visible;padding:24px 16px}.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}.settings-panel input[type=range],.focus-panel input[type=range],.timeline input[type=range]{min-height:44px}input[type=range]::-webkit-slider-thumb{width:28px;height:28px}input[type=range]::-moz-range-thumb{width:28px;height:28px}.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}.mechanics-panel p{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-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}.mechanics-timing{display:flex;align-items:center;gap:8px;font-size:12px;color:#e0e7ef;cursor:pointer}.mechanics-timing input{width:16px;height:16px;accent-color:#f3934e}.mechanics-view .mechanics-timing-note{margin:0;color:#91a0b2;font-size:11px;line-height:1.45}.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}.mode-controls{display:grid;grid-template-columns:minmax(0,1fr) 90px;gap:8px;align-items:end}.mode-controls label{min-width:0}.lenses-view{min-height:0;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:16px;background:#151a21}.lenses-view[hidden]{display:none}.lens-heading{display:flex;justify-content:space-between;gap:12px}.lenses-view p,.lenses-view label,.lenses-view summary{font-size:13px;line-height:1.5;color:#c5ced9}.lenses-view h3{margin:4px 0}.lens-controls{display:flex;flex-wrap:wrap;align-items:end;gap:12px}.lens-controls>label{flex:1;min-width:min(220px,100%)}.lenses-view input:not([type=range]),.lenses-view select{display:block;width:100%;min-width:0;padding:8px;background:#222831;border:1px solid #57616f;border-radius:5px;color:#fff}.lenses-view button{min-height:40px}.lenses-view button[aria-pressed=true]{background:#f3934e;color:#20150b}.lens-fields,.lens-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.lens-fields{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}.lens-comparison figure{margin:0;min-width:0}.lens-comparison figcaption{margin-top:10px;overflow-wrap:anywhere}.lens-stage{position:relative;max-width:900px;width:fit-content;margin:auto;line-height:0}.lens-stage img{display:block;max-width:100%;max-height:60vh;width:auto;height:auto}.lens-stage .lens-focus-box{position:absolute;min-height:0;min-width:0;padding:0;background:transparent;border:2px solid #ffb36d;border-radius:2px;touch-action:none}.lens-stage .lens-focus-box:hover{background:#ffb36d22}.lens-focus-box:after{content:"";position:absolute;top:-12px;right:-12px;bottom:-12px;left:-12px}.lens-lesson{display:flex;flex-direction:column;gap:12px}.lens-notice{padding:12px;border:1px solid #dc9d5e;border-radius:6px}.lenses-view a,.capture-detail a{color:#ffb36d}.lenses-view>*,.lens-lesson>*{flex-shrink:0}.lenses-view strong{overflow-wrap:anywhere}@media(max-width:599px){.lenses-view{padding:12px;overflow:visible}.lens-comparison{grid-template-columns:1fr}.lens-controls>*{max-width:100%}.view-navigation button{padding:7px 5px;font-size:11px;gap:3px}.view-navigation button svg{width:14px}.lens-heading{flex-wrap:wrap}}.lens-stage .lens-focus-box:focus-visible{outline:none;border-color:#fff;box-shadow:0 0 0 2px #10121580}.lens-focal-choice{display:block;width:min(100%,320px)}.lens-concept-view{grid-template-columns:minmax(0,1fr)}.sound-choice{display:flex;align-items:center;gap:5px;font-size:11px;color:#cbd3dc}.sound-choice select{max-width:110px;min-height:32px;font-size:11px}.shutter-curtain-top,.shutter-curtain-bottom{transition-duration:35ms}.triangle-learn{min-height:0;overflow:auto;background:#151a21;padding:clamp(16px,3vw,36px)}.triangle-learn-inner{max-width:1180px;margin:auto}.triangle-intro h2{font-size:clamp(26px,3vw,38px)}.triangle-intro p,.triangle-lesson p,.triangle-caption{color:#c9d2dc;font-size:14px;line-height:1.5}.triangle-intro p{margin-top:8px}.triangle-layout{display:grid;grid-template-columns:minmax(270px,.8fr) minmax(0,1.2fr);gap:18px;margin-top:22px}.triangle-lesson,.triangle-demo{border:1px solid #3b4858;border-radius:12px;background:#202a35;padding:22px;min-width:0}.triangle-lesson{display:flex;flex-direction:column}.triangle-lesson progress{width:100%;height:7px;accent-color:#f3934e;margin:8px 0 24px}.triangle-progress{font-size:12px!important;color:#ffb779!important}.triangle-lesson h3{font-size:clamp(20px,2.4vw,28px);margin:0 0 12px}.triangle-lesson p{max-width:44ch}.triangle-nav{display:flex;justify-content:space-between;gap:10px;margin-top:auto;padding-top:24px}.triangle-nav button{min-height:42px}.triangle-demo{display:flex;flex-direction:column;align-items:center}.triangle-diagram{display:block;width:min(100%,480px);height:auto;overflow:visible}.triangle-outline{fill:#17202a;stroke:#f3934e;stroke-width:3}.triangle-light{fill:#ffca83;opacity:.65;transition:opacity .3s}.triangle-opening{fill:#090e14;stroke:#fff3d8;stroke-width:2;transition:r .3s}.triangle-diagram text{fill:#eef3f7;font-size:13px;font-weight:700}.triangle-preview{position:relative;width:min(100%,380px);height:68px;border-radius:8px;background:linear-gradient(90deg,#526d83,#a5c6d3);overflow:hidden;transition:filter .3s}.triangle-subject{position:absolute;left:48%;bottom:0;width:15px;height:43px;border-radius:8px 8px 0 0;background:#172432}.triangle-motion{position:absolute;left:52%;top:28px;height:7px;border-radius:8px;background:#f4bd88aa;transition:width .3s}.triangle-caption{font-size:11px;margin-top:10px;text-align:center}.triangle-effects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}.triangle-effects>div{border:1px solid #3b4858;border-radius:8px;background:#202a35;padding:15px;min-width:0}.triangle-effects .is-focused{border-color:#f3934e}.triangle-effects strong{display:block;color:#ffb779;font:19px ui-monospace,monospace}.triangle-effects span{display:block;color:#c5ced9;font-size:12px;line-height:1.4;margin-top:7px}.triangle-controls{display:flex;flex-wrap:wrap;align-items:end;gap:14px;margin-top:18px;border-top:1px solid #3b4858;padding-top:18px}.triangle-controls label{flex:1;min-width:145px;font-size:13px}.triangle-controls select,.triangle-controls button{min-height:42px}@media(max-width:800px){.triangle-layout{grid-template-columns:1fr}.triangle-effects{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.triangle-learn{padding:14px}.triangle-lesson,.triangle-demo{padding:15px}.triangle-effects{grid-template-columns:1fr}.triangle-diagram text{font-size:11px}}@media(prefers-reduced-motion:reduce){.triangle-light,.triangle-opening,.triangle-preview,.triangle-motion{transition:none}}.triangle-background{position:absolute;left:10%;bottom:0;width:72%;height:34px;background:linear-gradient(135deg,transparent 18%,#3d6574 18% 24%,transparent 24% 44%,#3d6574 44% 55%,transparent 55% 70%,#3d6574 70% 78%,transparent 78%);transition:filter .3s}.triangle-noise{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(#15202b 1px,transparent 1px);background-size:5px 5px;transition:opacity .3s;pointer-events:none}@media(prefers-reduced-motion:reduce){.triangle-background,.triangle-noise{transition:none}}.meter{padding:12px;border:1px solid #697382;border-radius:8px;background:#161a20}.meter>div:first-child>span{font-size:11px;font-weight:600;letter-spacing:.035em;color:#d9e0e9}.meter strong{font-size:22px;white-space:nowrap}.meter strong small{font-size:11px}.meter .meter-track{height:22px;margin:14px 12px 0;border-bottom:2px solid #c1c9d5;background:none}.meter .meter-tick{position:absolute;bottom:0;width:2px;height:12px;background:#a9b4c3;transform:translate(-50%)}.meter .meter-zero{height:20px;width:3px;background:#f3f5f8}.meter .meter-track i{top:-2px;width:5px;height:26px;background:#ffac69;transform:translate(-50%);border-radius:2px;box-shadow:0 0 0 1px #161a20}.meter .meter-track i:before{content:"";position:absolute;left:-4px;top:-5px;border-left:6.5px solid transparent;border-right:6.5px solid transparent;border-top:6px solid #ffac69}.meter .meter-labels{position:relative;display:block;height:22px;margin:6px 12px 0}.meter .meter-labels span{position:absolute;transform:translate(-50%);font:600 13px ui-monospace,monospace;color:#edf1f6}.meter p{font-size:11px;line-height:1.45;margin:6px 0 0}.settings-panel .meter{margin:4px 0 10px;flex-shrink:0}.meter>div:first-child{gap:6px;flex-wrap:wrap}.meter>div:first-child>span{font-size:10px;white-space:nowrap}
