.device-panel .camera-type,.device-panel .camera-live-status,.device-panel .camera-extended-stats{display:none}
.device-panel .camera-expand-trigger{display:block;width:100%;padding:0;border:0;border-radius:5px;background:transparent;cursor:zoom-in;overflow:hidden}
.device-panel .camera-expand-trigger:focus-visible{outline:2px solid #ef828a;outline-offset:2px}
.device-panel .camera-expand-trigger:disabled{cursor:default}
.device-panel.is-expanded{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:25;width:min(900px,calc(100% - 24px));height:min(590px,calc(100% - 24px));max-height:none;overflow:hidden;display:flex;background:rgba(27,29,32,.97);border-color:#a9575d;box-shadow:0 25px 90px #000c}
.device-panel.is-expanded .device-panel-heading{display:grid;grid-template-columns:1fr auto auto;grid-template-rows:auto auto;column-gap:14px;padding:15px 20px 8px;border:0;align-items:center;flex:none}
.device-panel.is-expanded .device-panel-heading h2{grid-column:1;grid-row:2;font-size:22px;line-height:1.1}
.device-panel.is-expanded .device-panel-close{grid-column:3;grid-row:1/3;font-size:26px;align-self:start}
.device-panel.is-expanded .device-panel-content{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(180px,.9fr);grid-template-rows:auto minmax(0,1fr) auto auto;grid-template-areas:'counts counts' 'video details' 'animals details' 'message message';gap:12px 16px;overflow:hidden;padding:0 20px 16px;flex:1}
.device-panel.is-expanded .camera-type{display:block;color:#c4c7c9;font-size:12px;font-weight:700;letter-spacing:.06em;grid-column:1;grid-row:1}
.device-panel.is-expanded .camera-live-status:not([hidden]){display:block;grid-column:2;grid-row:1/3;color:white;font-size:13px}
.device-panel.is-expanded .camera-live-status:before{content:'';display:inline-block;width:9px;height:9px;margin-right:7px;background:#ef5964;border-radius:50%;box-shadow:0 0 10px #ef5964}
.device-panel.is-expanded .camera-expand-trigger{grid-area:video;width:100%;height:auto;aspect-ratio:16/9;margin:0;align-self:center;min-height:0}
.device-panel.is-expanded .device-panel-content .camera-expand-trigger img,.device-panel.is-expanded .device-panel-content .camera-expand-trigger video{width:100%;height:100%;max-height:none;aspect-ratio:16/9;object-fit:contain}
.device-panel.is-expanded .camera-extended-stats{display:contents}
.camera-stat-grid{grid-area:counts;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.camera-stat{padding:10px 12px;border:1px solid #565a5d;border-radius:9px;background:#ffffff0b;min-width:0}
.camera-stat:first-child{border-left:3px solid #ef5964}
.camera-stat-label{color:#e29ba1;font-size:12px;font-weight:700;letter-spacing:.04em}
.camera-stat-pair{display:flex;gap:14px;margin:7px 0}.camera-stat-pair div{display:grid;gap:1px}.camera-stat-pair strong{font-size:20px}.camera-stat-pair div:first-child strong{color:#ef5964}.camera-stat-pair small,.camera-stat>small{color:#b4b6b8;font-size:12px}
.camera-stat>small{display:block;border-top:1px solid #555;padding-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.camera-stat-details{grid-area:details;display:flex;flex-direction:column;justify-content:space-around;min-height:0;margin:0}
.camera-stat-detail{display:grid;grid-template-columns:1fr auto;gap:6px;border-bottom:1px solid #555;padding:9px 2px;font-size:12px}.camera-stat-detail span{grid-column:1/-1;color:#c6c8ca;font-weight:700}.camera-stat-detail strong{font-size:18px}.camera-stat-detail small{color:#aaa}
.device-panel.is-expanded .camera-stat-message{grid-area:message;margin:0;font-size:12px}
@media(max-width:700px){.device-panel.is-expanded{width:calc(100% - 16px);height:calc(100% - 16px)}.device-panel.is-expanded .device-panel-heading{padding:10px 12px 6px}.device-panel.is-expanded .device-panel-heading h2{font-size:18px}.device-panel.is-expanded .device-panel-content{grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto;grid-template-areas:'counts' 'video' 'animals' 'details' 'message';gap:7px;padding:0 12px 10px}.camera-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.camera-stat{padding:5px 8px}.camera-stat-pair{margin:3px 0;gap:10px}.camera-stat-pair strong{font-size:16px}.camera-stat>small{padding-top:3px}.camera-stat-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.camera-stat-detail{padding:3px 0;font-size:11px}.camera-stat-detail strong{font-size:15px}}
@media(max-height:550px) and (min-width:701px){.device-panel.is-expanded .device-panel-heading{padding-top:8px}.device-panel.is-expanded .device-panel-content{gap:6px 12px;padding-bottom:8px}.camera-stat{padding:5px 10px}.camera-stat-pair{margin:2px 0}.camera-stat>small{padding-top:3px}}

.camera-average-values{font-size:13px!important;line-height:1.4;overflow-wrap:anywhere}
.camera-no-preview{display:grid;place-items:center;width:100%;height:100%;aspect-ratio:16/9;background:#161719;color:#aaa;border:1px solid #494c50;border-radius:5px;font-size:13px;text-align:center;padding:12px;box-sizing:border-box}
.device-panel.is-expanded .camera-no-preview{aspect-ratio:16/9;height:100%}
.device-panel.is-expanded .camera-live-status.is-idle:before{background:#84888c;box-shadow:none}.device-panel.is-expanded .camera-stat-message{color:#aeb1b5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.camera-stat-detail{display:flex;flex-direction:column;gap:6px}.camera-stat-detail>span{color:#c6c8ca;font-weight:700}.camera-stat-values{display:flex;align-items:baseline;gap:6px}.camera-stat-values>strong{font-size:18px}.camera-stat-values>small{color:#aaa}.camera-stat-detail[data-metric="averageSpeed"] .camera-stat-values{display:grid;gap:3px}.camera-average-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:baseline;gap:5px;font-size:12px}.camera-average-row>span{color:#c6c8ca}.camera-average-row>strong{font-size:14px}.camera-average-row>small{color:#aaa;font-size:11px}
.camera-average-row>span{grid-column:auto;font-weight:400}.camera-average-row>strong,.camera-average-row>small{white-space:nowrap}

.camera-animal-row{grid-area:animals;display:flex;align-items:center;gap:14px;min-height:28px;padding:7px 2px;border-top:1px solid #45494c;color:#d6d8da;font-size:13px}.camera-animal-row[hidden]{display:none}.camera-animal-label{display:inline-flex;align-items:center;gap:5px;color:#e29ba1;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.camera-animal-label span{font-size:14px;filter:grayscale(1)}.camera-animal-value{display:inline-flex;align-items:baseline;gap:4px}.camera-animal-value strong{font-size:16px;color:#f2f2f2}.camera-animal-value [data-animal-in]{color:#ef5964}.camera-animal-value small,.camera-animal-unique{font-size:12px;color:#aeb1b5}.camera-animal-unique{margin-left:auto;white-space:nowrap}
@media(max-width:700px){.device-panel.is-expanded{height:auto;max-height:calc(100% - 16px);overflow:auto}.device-panel.is-expanded .device-panel-content{flex:none;grid-template-rows:auto auto auto auto auto;align-content:start;gap:9px;overflow:visible}.device-panel.is-expanded .camera-expand-trigger{align-self:start;min-height:0;height:auto;aspect-ratio:16/9}.device-panel.is-expanded .device-panel-content .camera-expand-trigger img,.device-panel.is-expanded .device-panel-content .camera-expand-trigger video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}.camera-animal-row{gap:9px;padding:7px 0}.camera-animal-label{font-size:12px}.camera-animal-value strong{font-size:15px}}
