.camera-panel{position:relative}.camera-actions{display:flex;gap:8px;position:absolute;right:14px;top:14px;z-index:8}.camera-actions[hidden]{display:none!important}.camera-actions .camera-icon{position:static!important;display:grid!important;place-items:center;width:44px;height:44px;min-height:44px;padding:10px!important;border:1px solid #ffffff38;border-radius:12px;background:#132e24e8;color:#fff;cursor:pointer;box-shadow:0 3px 14px #0002}.camera-icon svg{width:22px;height:22px}.camera-actions .camera-icon:hover{background:#2d5144}.camera-actions .camera-icon:focus-visible{outline:3px solid #c9d5b9;outline-offset:3px}.camera-live .camera-settings{display:none}.camera-live.camera-options-open .camera-settings{display:block;padding-top:54px}.camera-live .camera-stage{margin-top:0}.camera-live .camera-help{display:none}.camera-live.camera-options-open .camera-help{display:block}.camera-live .camera-live-label{max-width:calc(100% - 130px)}
#app:is(.camera-training:not(.camera-minimized),.camera-expanded) .camera-actions{top:calc(12px + env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}#app:is(.camera-training:not(.camera-minimized),.camera-expanded) .camera-full{display:grid!important}#app:is(.camera-training:not(.camera-minimized),.camera-expanded) .camera-options-open .camera-settings{padding-top:0}
.record-tools{position:absolute;right:16px;bottom:16px;top:auto;z-index:8;display:flex;align-items:center;gap:10px;background:#231b1bd9;padding:6px 7px 6px 12px;border:1px solid #f5a29a33;border-radius:30px;color:#fff;box-shadow:0 5px 24px #0003;max-width:none}.record-tools[hidden]{display:none!important}.record-clock{font-size:12px;font-variant-numeric:tabular-nums;color:#ead7d2}.record-tools:not(.is-recording) .record-clock{display:none}.record-tools .record-button{display:flex;align-items:center;gap:8px;justify-content:center;min-width:75px;height:42px;padding:10px 13px;border:1px solid #eaa39a66;border-radius:24px;background:#a7443e;color:#fff;font-size:11px;font-weight:700;letter-spacing:1.3px}.record-button:hover{background:#bd514a}.record-symbol{display:block;width:13px;height:13px;border-radius:50%;background:#fff}.record-button.is-recording .record-symbol{border-radius:3px;width:12px;height:12px}.record-button:focus-visible{outline:3px solid #ffb5aa;outline-offset:3px}.record-button:disabled{opacity:.55}.record-result{width:min(460px,calc(100% - 28px));max-height:90dvh;overflow:auto;padding:28px;border:1px solid #d9ddd0;border-radius:20px;color:#17382c;background:#f6f7ef;box-shadow:0 24px 80px #0004}.record-result::backdrop{background:#0e201bd9}.record-result h2{font-size:27px;letter-spacing:-.8px}.record-result p{font-size:13px;line-height:1.65;color:#65746a}.record-result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.record-result-actions>*{flex:1;min-height:44px;text-align:center;text-decoration:none;padding:13px 16px;border-radius:12px;font-size:13px}.record-result [hidden]{display:none!important}
@media(max-width:600px){.camera-actions{top:10px;right:10px;gap:6px}.camera-actions .camera-icon{width:40px;height:40px;min-height:40px}.record-tools{bottom:12px;right:12px;padding:5px;gap:7px}.record-tools .record-button{min-width:42px;width:42px;height:42px;padding:10px}.record-label{display:none}.record-tools.is-recording{padding-left:10px}#app.camera-training:not(.camera-minimized) .record-tools{bottom:calc(150px + env(safe-area-inset-bottom))}#app.camera-expanded:not(.camera-training) .record-tools{bottom:calc(94px + env(safe-area-inset-bottom))}.record-result{padding:23px}}
#app.camera-expanded:not(.camera-training) .camera-start{right:auto;width:calc(100% - 160px)}
/* Camera toolbar: settings left; view size and cancel right. */
.camera-actions{left:14px;pointer-events:none}.camera-actions>.camera-icon{pointer-events:auto}.camera-actions .camera-options{margin-right:auto}.camera-actions .camera-cancel{color:#f3c4ba;background:#57372fe8;border-color:#d7998659}.camera-actions .camera-cancel:hover{background:#75483d}.camera-actions .camera-cancel[hidden]{display:none!important}.camera-live .camera-live-label{left:68px;max-width:calc(100% - 190px)}#app.camera-training #abort,#app.camera-training #cancel{display:none!important}#app:is(.camera-training:not(.camera-minimized),.camera-expanded) .camera-actions{left:max(12px,env(safe-area-inset-left))}@media(max-width:600px){.camera-actions{left:10px}.camera-live .camera-live-label{left:56px;font-size:9px;max-width:calc(100% - 156px)}}
/* Identical settings popover in compact and expanded camera views. */
#app .camera-panel.camera-live>.camera-settings{display:none}#app .camera-panel.camera-live.camera-options-open>.camera-settings{display:block;position:absolute;z-index:9;top:calc(64px + env(safe-area-inset-top));left:12px;right:auto;width:min(420px,calc(100% - 24px));max-height:calc(100dvh - 150px);overflow:auto;padding:0;background:#f6f7f1;border-radius:14px;box-shadow:0 12px 24px #0005;color:var(--ink)}#app .camera-panel.camera-live.camera-options-open>.camera-settings .camera-heading,#app .camera-panel.camera-live.camera-options-open>.camera-settings .camera-tools{display:flex;position:static;min-height:0;margin:0;padding:14px;border-radius:0;box-shadow:none;background:transparent;color:var(--ink)}#app .camera-panel.camera-live.camera-options-open>.camera-settings .camera-tools{gap:8px;align-items:center;flex-wrap:wrap}#app .camera-panel.camera-live.camera-options-open>.camera-settings .camera-tools label{flex-basis:100%}#app .camera-panel.camera-live .camera-help{display:none}.camera-actions .camera-icon:disabled{opacity:.45;cursor:wait}
.record-tools .record-library{display:grid;place-items:center;width:34px;height:34px;padding:6px;background:transparent;color:#ead7d2;border:1px solid #ead7d244;border-radius:50%;font-size:20px}.record-tools .record-library[hidden]{display:none!important}.record-clip-label{display:block;font-size:12px;margin-top:16px}.record-clip-select{display:block;width:100%;margin-top:7px;padding:10px;border:1px solid #cbd5c6;border-radius:10px;background:#fff;color:#17382c}