.camera-page{display:grid;gap:18px;max-width:1500px;margin:0 auto}.camera-heading{display:flex;align-items:end;justify-content:space-between;gap:18px}.camera-heading h2{margin:4px 0 3px;font-size:clamp(27px,4vw,46px);letter-spacing:-.04em}.camera-heading p{margin:0;color:var(--muted)}.camera-eyebrow{color:#65ddc1;font-weight:900;font-size:11px;letter-spacing:.17em}.camera-model{padding:9px 13px;border:1px solid #ffffff24;border-radius:999px;background:#ffffff0b;color:#d9e7f5;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.camera-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px}.camera-view-card,.camera-side>section{border:1px solid #ffffff17;background:linear-gradient(145deg,#10243bf0,#0b192cf5);box-shadow:0 24px 80px #0209145c}.camera-view-card{border-radius:24px;padding:14px}.camera-stage{position:relative;min-height:clamp(300px,52vw,720px);overflow:hidden;border-radius:17px;background:radial-gradient(circle at 50% 45%,#193f56,#07121f 68%);display:grid;place-items:center}.camera-stage img{width:100%;height:100%;position:absolute;inset:0;object-fit:contain;background:#04090f}.camera-placeholder{display:grid;justify-items:center;gap:8px;color:#b9c9d9;text-align:center;padding:30px}.camera-placeholder strong{font-size:20px}.camera-placeholder small{max-width:390px;color:#7890a6}.camera-lens{width:86px;height:86px;border-radius:50%;border:11px solid #29475d;background:radial-gradient(circle at 38% 32%,#6ae3c9 0 4%,#1e5c70 13%,#06111d 55%);box-shadow:0 0 0 1px #76eedb44,0 18px 60px #0008}.camera-live-chip{position:absolute;top:14px;left:14px;padding:7px 10px;border-radius:999px;background:#07111dcc;border:1px solid #fff2;color:#94a8ba;font-size:10px;font-weight:900;letter-spacing:.12em}.camera-status{display:flex;align-items:center;gap:11px;margin:13px 2px 0;padding:12px 13px;border-radius:14px;background:#ffffff09}.camera-status i{display:block;width:10px;height:10px;border-radius:50%;background:#9aacc0;box-shadow:0 0 0 5px #9aacc01a}.camera-status div{display:grid;gap:2px}.camera-status strong{font-size:13px}.camera-status span{color:#94a8ba;font-size:12px}.camera-status.is-live i,.camera-status.is-ready i{background:#63e0bd;box-shadow:0 0 0 5px #63e0bd1d}.camera-status.is-live{background:#40d5aa10}.camera-status.is-pending i{background:#f0bd66;box-shadow:0 0 0 5px #f0bd661b}.camera-status.is-error i{background:#ff7d86;box-shadow:0 0 0 5px #ff7d861b}.camera-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:13px 2px 1px}.camera-actions button{min-height:40px;border:0;border-radius:11px;padding:10px 14px;font-weight:850;cursor:pointer}.camera-actions button:disabled{opacity:.42;cursor:not-allowed}.camera-primary{background:#69e4c4;color:#041811}.camera-secondary{background:#ffffff12;color:#e4eef7;border:1px solid #ffffff1b!important}.camera-actions span{margin-left:auto;color:#8da3b5;font-variant-numeric:tabular-nums;font-size:12px}.camera-side{display:grid;align-content:start;gap:12px}.camera-side>section{border-radius:18px}.camera-metrics{display:grid;grid-template-columns:1fr 1fr;padding:8px}.camera-metrics article{min-height:75px;display:grid;align-content:center;gap:5px;padding:11px;border-radius:13px}.camera-metrics article:nth-child(1),.camera-metrics article:nth-child(2){border-bottom:1px solid #ffffff12}.camera-metrics article:nth-child(odd){border-right:1px solid #ffffff12}.camera-metrics span{color:#7890a6;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.camera-metrics strong{color:#e6f2fb;font-size:15px}.camera-note{padding:16px 17px}.camera-note strong{display:block;margin-bottom:6px;color:#dbe9f4}.camera-note p{margin:0;color:#8ea5b8;font-size:12px;line-height:1.55}.camera-note.camera-setup{border-color:#e3ad5545;background:linear-gradient(145deg,#392b19e8,#172237f2)}.camera-note.camera-setup strong{color:#ffd594}@media(max-width:980px){.camera-layout{grid-template-columns:1fr}.camera-side{grid-template-columns:repeat(3,1fr)}.camera-metrics{grid-column:1/-1}.camera-note.camera-setup{grid-column:1/-1}}@media(max-width:680px){.camera-page{gap:13px}.camera-heading{align-items:start;flex-direction:column}.camera-model{align-self:flex-start}.camera-view-card{padding:8px;border-radius:18px}.camera-stage{min-height:54vw;border-radius:12px}.camera-side{grid-template-columns:1fr}.camera-metrics,.camera-note.camera-setup{grid-column:auto}.camera-actions button{flex:1 1 42%}.camera-actions span{width:100%;margin:2px 0 0;text-align:center}.camera-placeholder{padding:18px}.camera-lens{width:66px;height:66px;border-width:8px}}
