.camera-demo-cover{margin-bottom:56px;scroll-margin-top:100px}
.camera-demo{--camera-cycle:27s;margin:32px auto 0;overflow:hidden;border:1px solid #2d3c4c;border-radius:12px;background:#0e1621;color:#edf3fa}
.camera-window-bar{display:flex;justify-content:space-between;padding:7px 16px;background:#202b37;color:#8596a5;font-size:12px}
.camera-window{display:grid;grid-template-columns:280px minmax(0,1fr)}
.camera-sidebar{background:#17232f;border-right:1px solid #101923}
.camera-search{height:76px;display:flex;align-items:center;gap:20px;padding:16px;color:#8ba0b1}
.camera-search>span:first-child{font-size:22px}
.camera-search>span:last-child{flex:1;padding:8px 16px;border-radius:24px;background:#243342;font-size:15px}
.camera-chat-item{display:flex;align-items:center;gap:12px;padding:18px 14px;position:relative}
.camera-chat-selected{background:#29435c}
.camera-avatar{display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;border-radius:50%;background:#328fd4;color:#fff;font-size:21px}
.camera-avatar-purple{background:#8456c7;font-size:17px}
.camera-avatar-green{background:#4fad6b}
.camera-avatar-orange{background:#c88747}
.camera-chat-preview{min-width:0;flex:1}
.camera-chat-preview strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:500}
.camera-chat-preview>span,.camera-preview-updates{display:block;margin-top:5px;color:#97adbf;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.camera-chat-item time{position:absolute;right:12px;top:6px;color:#97adbf;font-size:10px}
.camera-preview-updates{display:grid;color:#b7d4ed}
.camera-preview-updates span{grid-area:1/1;opacity:0;animation:camera-preview-first var(--camera-cycle) infinite both}
.camera-preview-updates .camera-preview-return{animation-name:camera-preview-second}
.camera-preview-updates .camera-preview-report{animation-name:camera-preview-third}
.camera-conversation{container-type:inline-size;min-width:0}
.camera-chat-header{height:76px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 22px;background:#17232f;border-bottom:1px solid #101923}
.camera-chat-header strong{display:block;font-size:17px;font-weight:500;line-height:1.4}
.camera-chat-header div>span{display:block;color:#829aaf;font-size:14px}
.camera-chat-tools{color:#829aaf;white-space:nowrap;font-size:26px}
.camera-chat-body{--message-width:min(480px,calc(100cqw - 40px));--photo-height:calc((var(--message-width) - 16px)/1.6);--event-height:calc(var(--photo-height) + 134px);--chat-height:calc(var(--event-height) + 96px);padding:0 20px;background:#0e1621}
.camera-chat-date{display:table;margin:12px auto;padding:3px 12px;border-radius:20px;background:#1d2c3a;color:#b6c6d4;font-size:12px}
.camera-chat-viewport{height:var(--chat-height);overflow:hidden}
.camera-scenes{display:flex;flex-direction:column;gap:16px;width:var(--message-width);padding-bottom:16px;animation:camera-scroll var(--camera-cycle) infinite both}
.camera-message{flex-shrink:0;min-width:0;overflow:hidden;border-radius:12px 12px 12px 3px;background:#1c2c3b;animation:camera-absence var(--camera-cycle) infinite both}
.camera-absence,.camera-return{height:var(--event-height)}
.camera-return{animation-name:camera-return}
.camera-report{animation-name:camera-report}
/* Photo regions from the existing anonymised Telegram screenshots. */
.camera-snapshot{position:relative;height:var(--photo-height);overflow:hidden;background:#17232c;margin:8px 8px 0;border-radius:7px}
.camera-snapshot img{position:absolute;max-width:none;height:auto}
.camera-snapshot-absence img{width:178.2%;left:-52.1%;top:-40%}
.camera-snapshot-return img{width:239.6%;left:-71.3%;top:-35.2%}
.camera-message-copy{padding:12px 16px}
.case-page .camera-message h3{margin:0 0 6px;color:#f3f7fb;font-size:18px;line-height:1.3}
.camera-message p{margin:2px 0;color:#d6e2ec;font-size:15px;line-height:1.5}
.camera-message time{display:block;margin-top:4px;text-align:right;color:#8197aa;font-size:12px;line-height:1.5}
.camera-report-label{display:block;margin-bottom:6px;color:#93a9bc;font-size:12px}
.camera-report .camera-report-date{color:#93a9bc;font-size:13px}
.camera-report dl{margin:12px 0}
.camera-report dl>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #304250;font-size:14px;line-height:1.4}
.camera-report dt{color:#b9cbd8}
.camera-report dd{margin:0;text-align:right;white-space:nowrap;color:#f3f7fb;font-weight:500}
.camera-report .camera-report-status{color:#b9efc9;font-size:13px}
.camera-report-status span{margin-right:5px}
.camera-chat-input{display:flex;align-items:center;gap:16px;padding:15px 20px;background:#17232f;color:#849bad;font-size:15px}
.camera-chat-input svg{width:23px;height:23px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.camera-input-placeholder{flex:1}
/* Keep earlier messages in the thread; scroll to the latest arrival. */
@keyframes camera-scroll{0%,32%{transform:translateY(0)}37%,65%{transform:translateY(calc(0px - var(--event-height) - 16px))}70%,97%,100%{transform:translateY(calc(var(--chat-height) - 100%))}}
@keyframes camera-absence{0%{opacity:0;transform:translateY(20px)}4%,97%{opacity:1;transform:none}100%{opacity:0}}
@keyframes camera-return{0%,32%{opacity:0;transform:translateY(20px)}37%,97%{opacity:1;transform:none}100%{opacity:0}}
@keyframes camera-report{0%,65%{opacity:0;transform:translateY(20px)}70%,97%{opacity:1;transform:none}100%{opacity:0}}
@keyframes camera-preview-first{0%,32%{opacity:1}33%,100%{opacity:0}}
@keyframes camera-preview-second{0%,32%{opacity:0}33%,65%{opacity:1}66%,100%{opacity:0}}
@keyframes camera-preview-third{0%,65%{opacity:0}66%,100%{opacity:1}}
@media(max-width:1000px){.camera-window{grid-template-columns:220px minmax(0,1fr)}.camera-chat-item{gap:9px;padding-inline:10px}.camera-chat-preview strong{font-size:13px}.camera-avatar{width:40px;height:40px;font-size:18px}.camera-avatar-purple{font-size:14px}}
@media(max-width:650px){.camera-demo-cover{margin-bottom:32px}.camera-window{grid-template-columns:64px minmax(0,1fr)}.camera-search{justify-content:center;padding:12px;height:68px}.camera-search>span:last-child,.camera-chat-preview,.camera-chat-item time{display:none}.camera-chat-item{justify-content:center;padding:16px 8px}.camera-chat-header{height:68px;padding:12px;gap:8px}.camera-chat-header strong{font-size:14px}.camera-chat-header div>span{font-size:12px}.camera-chat-tools{font-size:20px}.camera-chat-body{--message-width:calc(100cqw - 20px);padding-inline:10px}.camera-message-copy{padding:12px 10px}.case-page .camera-message h3{font-size:15px}.camera-message p{font-size:13px}.camera-report dl>div{font-size:12px;gap:6px}.camera-chat-input{font-size:13px;padding:14px 10px;gap:8px}.camera-report .camera-report-status{font-size:12px}}
@media(max-width:360px){.camera-chat-body{--event-height:calc(var(--photo-height) + 164px)}}
@media(prefers-reduced-motion:reduce){.camera-chat-viewport{height:auto;overflow:visible}.camera-scenes,.camera-message,.camera-preview-updates span{animation:none;transform:none;opacity:1}.camera-preview-updates .camera-preview-absence,.camera-preview-updates .camera-preview-return{display:none}}
@media print{.camera-sidebar,.camera-chat-input,.camera-window-bar{display:none}.camera-window{display:block}.camera-chat-viewport{height:auto;overflow:visible}.camera-scenes,.camera-message{animation:none;transform:none;opacity:1}.camera-message{break-inside:avoid}}
