.camera-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.agent-camera-fieldset {
  border: 1px solid rgba(45, 153, 255, 0.28);
  border-radius: 14px;
  padding: 14px;
}

.agent-camera-fieldset legend {
  color: #d9edff;
  font-weight: 800;
  padding: 0 6px;
}

.agent-camera-choices {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.agent-camera-option {
  align-items: center;
  background: rgba(17, 46, 80, 0.62);
  border: 1px solid rgba(73, 166, 255, 0.22);
  border-radius: 12px;
  cursor: pointer;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  padding: 11px 12px;
}

.agent-camera-option input {
  height: 20px;
  width: 20px;
}

.agent-camera-option span,
.agent-inventory-row > span,
.agent-inventory-row > strong {
  display: grid;
  gap: 4px;
}

.agent-camera-option small,
.agent-inventory-row small {
  color: #9db8d5;
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1.35;
}

.agent-camera-option.unavailable {
  cursor: not-allowed;
  opacity: 0.58;
}

.agent-inventory-row {
  grid-template-columns:
    minmax(180px, 1.2fr) minmax(200px, 1.4fr) minmax(160px, 0.9fr)
    minmax(210px, 1fr);
}

.agent-inventory-row .pill {
  align-content: center;
  min-height: 56px;
  text-align: center;
}

@media (max-width: 980px) {
  .agent-inventory-row {
    grid-template-columns: 1fr;
  }
}
.camera-actions .camera-ai-primary {
  border-color: #168bd0;
  background: linear-gradient(135deg, #0c65a5, #138ecf);
  color: #fff;
  font-size: 9px;
  font-weight: 850;
  box-shadow: 0 7px 18px rgba(12, 101, 165, 0.24);
}
.maintenance-warning {
  display: grid;
  gap: 5px;
  margin-bottom: 16px;
  padding: 12px;
  border: 1px solid #6c5625;
  border-radius: 8px;
  background: #291f0d;
  color: #ffd88a;
}
.maintenance-warning small {
  color: #c9b783;
  line-height: 1.45;
}
.calibration-history {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 14px 0;
  padding: 12px;
  border: 1px solid #19425b;
  border-radius: 8px;
  background: #0c2230;
  text-align: center;
}
.calibration-history strong,
.calibration-history small {
  grid-column: 1 / -1;
}
.calibration-history span {
  color: #60d8ff;
  font-weight: 700;
}
.calibration-button {
  color: #85f5ff;
  border-color: #23718a;
  background: #0b2c3a;
}
.settings-card.calibration-card {
  width: min(1180px, 100%);
  padding: 22px;
}
.calibration-guide-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.calibration-guide-heading h2,
.calibration-guide-heading p {
  margin: 3px 0;
}
.calibration-guide-heading .eyebrow {
  color: #55d9ff;
  letter-spacing: 0.15em;
  font-weight: 800;
}
.calibration-percentage {
  min-width: 92px;
  color: #61e8c5;
  font-size: 31px;
  font-weight: 900;
  text-align: center;
}
.calibration-progress,
.calibration-hold {
  height: 9px;
  overflow: hidden;
  border-radius: 20px;
  background: #07101c;
  box-shadow: inset 0 0 0 1px #263b57;
}
.calibration-progress {
  margin: 14px 0 18px;
}
.calibration-progress span,
.calibration-hold span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #148df4, #55d9ff, #61e8c5);
  transition: width 0.35s ease;
}
.calibration-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(290px, 0.75fr);
  gap: 16px;
}
.calibration-stage,
.calibration-procedure {
  min-width: 0;
  border: 1px solid #233d58;
  border-radius: 10px;
  background: #07111e;
}
.calibration-stage {
  padding: 10px;
}
.calibration-view {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 7px;
  background: #02060b;
}
.calibration-view img,
.calibration-view svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.calibration-view img {
  z-index: 1;
  object-fit: contain;
  opacity: 0;
}
.calibration-view img.ready {
  opacity: 0.82;
}
.calibration-view svg {
  z-index: 2;
  pointer-events: none;
}
.calibration-no-image {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #5d7188;
}
.calibration-view:has(img.ready) .calibration-no-image {
  display: none;
}
.calibration-live {
  position: absolute;
  z-index: 3;
  left: 12px;
  top: 12px;
  padding: 6px 9px;
  border: 1px solid #2b6075;
  border-radius: 5px;
  background: #07131fd9;
  color: #bcecff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.08em;
}
.calibration-live i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 50%;
  background: #55e6b8;
  box-shadow: 0 0 10px #55e6b8;
}
.engineering-grid path {
  fill: none;
  stroke: #58d5ff45;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.engineering-grid .crosshair {
  stroke: #63e5be;
  stroke-width: 2;
}
.person-box rect,
.face-box rect,
.phone-box rect {
  fill: none;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}
.person-box rect {
  stroke: #53e6b3;
}
.face-box rect {
  stroke: #55c8ff;
}
.phone-box rect {
  stroke: #ffc85a;
}
.person-box text,
.face-box text,
.phone-box text {
  fill: #d9f8ff;
  font-size: 15px;
  font-weight: 800;
  paint-order: stroke;
  stroke: #06101a;
  stroke-width: 4px;
}
.calibration-readings {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin-top: 9px;
}
.calibration-readings span {
  padding: 7px 5px;
  border-radius: 5px;
  background: #0c1a29;
  color: #718aa1;
  font-size: 8px;
  text-align: center;
}
.calibration-readings strong {
  display: block;
  margin-top: 3px;
  color: #71dcff;
  font-size: 11px;
  text-align: center;
}
.calibration-procedure {
  display: flex;
  flex-direction: column;
  padding: 18px;
}
.calibration-step-number {
  color: #55cfff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.12em;
}
.calibration-procedure h3 {
  margin: 7px 0;
  color: #e5f5ff;
  font-size: 18px;
}
.calibration-procedure > p {
  min-height: 52px;
  color: #9bb0c2;
  line-height: 1.55;
}
.calibration-hold {
  margin-top: 4px;
  height: 7px;
}
.calibration-procedure > small {
  display: block;
  margin: 8px 0 12px;
  color: #6f879d;
  text-align: center;
}
.calibration-procedure ol {
  max-height: 300px;
  margin: auto 0 0;
  padding: 0;
  overflow: auto;
  list-style: none;
}
.calibration-procedure li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 4px;
  color: #60758b;
  font-size: 10px;
}
.calibration-procedure li span {
  display: grid;
  flex: 0 0 22px;
  height: 22px;
  place-items: center;
  border: 1px solid #263a50;
  border-radius: 50%;
  font-size: 8px;
}
.calibration-procedure li.active {
  color: #cceeff;
  font-weight: 700;
}
.calibration-procedure li.active span {
  border-color: #47c8ff;
  color: #47c8ff;
  box-shadow: 0 0 10px #168cf455;
}
.calibration-procedure li.done {
  color: #62d8b7;
}
.calibration-procedure li.done span {
  border-color: #3ba888;
  background: #123a32;
}
.calibration-controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 14px;
}
.calibration-controls button {
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid #294964;
  border-radius: 6px;
  background: #0e2235;
  color: #9edcff;
  cursor: pointer;
}
.calibration-controls button.danger {
  margin-left: auto;
  border-color: #643544;
  color: #ff9aae;
  background: #2c121b;
}
@media (max-width: 900px) {
  .calibration-layout {
    grid-template-columns: 1fr;
  }
  .calibration-readings {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .calibration-procedure ol {
    max-height: 220px;
  }
}
.attention-live {
  margin: 14px 0;
  padding: 12px;
  border: 1px solid #19425b;
  border-radius: 8px;
  background: #0b1d29;
}
.attention-live > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.attention-live-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.attention-live-grid span,
.attention-live-grid strong {
  display: block;
  text-align: center;
}
.attention-live-grid span {
  padding: 8px;
  border-radius: 6px;
  background: #101f2b;
  color: #8fa9bb;
  font-size: 9px;
}
.attention-live-grid strong {
  margin-top: 4px;
  color: #6dd8ff;
  font-size: 12px;
}
.config-camera {
  border: 1px solid #28405e;
  background: #10223a;
  color: #55c4ff;
  border-radius: 5px;
  padding: 6px 8px;
  font-size: 8px;
  cursor: pointer;
}
.profile-download {
  color: #9bf5df;
  border-color: #245d55;
  background: #0d2927;
}
.update-download {
  color: #fff3c4;
  border-color: #80662b;
  background: #392b0f;
}
.camera-help {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  margin: 4px 0 12px;
  border: 1px solid #203a4e;
  border-radius: 7px;
  background: #0b1a28;
  color: #8fa1b5;
  font-size: 9px;
  line-height: 1.5;
}
.camera-help strong {
  color: #d5e8f4;
  white-space: nowrap;
}
.settings-overlay {
  position: fixed;
  z-index: 30;
  inset: 0;
  background: #02060bc9;
  backdrop-filter: blur(7px);
  display: grid;
  place-items: center;
  padding: 20px;
}
.settings-card {
  width: min(570px, 100%);
  max-height: 92vh;
  overflow: auto;
  background: #0b1524;
  border: 1px solid #263b57;
  border-radius: 11px;
  padding: 24px;
  position: relative;
}
.settings-card h2 {
  margin: 0;
  font-size: 18px;
}
.settings-card > p {
  color: #73859c;
  font-size: 10px;
  margin: 5px 0 20px;
}
.settings-close {
  position: absolute;
  right: 15px;
  top: 10px;
  border: 0;
  background: none;
  color: #7589a1;
  font-size: 24px;
}
.settings-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.settings-grid label {
  margin: 5px 0;
}
.roi-help {
  padding: 11px;
  background: #0f2035;
  border-left: 2px solid #168cf4;
  color: #8fa0b4;
  font-size: 9px;
  line-height: 1.5;
  margin: 14px 0;
}
.roi-section {
  margin: 16px 0;
}
.roi-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  margin-bottom: 8px;
}
.roi-heading strong,
.roi-heading small {
  display: block;
}
.roi-heading small,
.roi-heading span {
  color: #71839a;
  font-size: 9px;
  margin-top: 3px;
}
.roi-editor {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid #28405e;
  border-radius: 8px;
  background: #050b13;
  cursor: crosshair;
}
.station-roi-editor {
  margin-top: 10px;
  touch-action: none;
  user-select: none;
}
.roi-editor img,
.roi-editor svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.roi-editor img {
  object-fit: contain;
  opacity: 0;
}
.roi-editor img.ready {
  opacity: 0.82;
}
.roi-editor svg {
  z-index: 2;
  pointer-events: none;
}
.roi-editor polygon {
  fill: #168cf43d;
  stroke: #55c4ff;
  stroke-width: 5;
  vector-effect: non-scaling-stroke;
}
.roi-editor circle {
  fill: #4ee1ce;
  stroke: #06111e;
  stroke-width: 4;
  vector-effect: non-scaling-stroke;
}
.station-roi-editor rect {
  fill: rgba(22, 140, 244, 0.25);
  stroke: #55d9ff;
  stroke-width: 5;
  vector-effect: non-scaling-stroke;
}
.station-roi-editor.ready:hover {
  border-color: #55d9ff;
  box-shadow: 0 0 0 2px rgba(85, 217, 255, 0.12);
}
.roi-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #52647a;
  font-size: 10px;
}
.roi-editor.ready .roi-empty {
  display: none;
}
.roi-actions {
  display: flex;
  gap: 7px;
  margin-top: 8px;
}
.roi-actions button {
  border: 1px solid #28405e;
  border-radius: 5px;
  background: #10223a;
  color: #8fcfff;
  padding: 7px 9px;
  font-size: 8px;
  cursor: pointer;
}
.station-roi-actions {
  flex-wrap: wrap;
}
.roi-status {
  margin: 8px 0 0;
}
.diagnostic-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin: 14px 0;
}
.diagnostic-grid div {
  padding: 10px;
  background: #08111e;
  border-radius: 6px;
}
.diagnostic-grid small,
.diagnostic-grid strong {
  display: block;
}
.system-health-card {
  grid-column: span 2;
}
.health-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 9px;
}
.health-summary small {
  color: #71839a;
  font-size: 9px;
}
.health-grid {
  grid-template-columns: repeat(4, 1fr);
}
.diagnostic-grid small {
  color: #61758d;
  font-size: 7px;
}
.diagnostic-grid strong {
  font-size: 12px;
  margin-top: 4px;
}
.prealarm-history-panel {
  margin: 14px 0;
  border: 1px solid #263b55;
  border-radius: 8px;
  background: #091524;
  overflow: hidden;
}
.health-history-panel {
  margin: 14px 0;
  padding: 13px;
  border: 1px solid #224767;
  border-radius: 8px;
  background: linear-gradient(135deg, #091524, #0b1c30);
}
.health-history-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 11px;
}
.health-history-heading strong,
.health-history-heading small {
  display: block;
}
.health-history-heading small,
.health-history-note {
  color: #7d91aa;
  margin-top: 3px;
}
.health-history-heading > span {
  color: #59d8ff;
  font-weight: 800;
  white-space: nowrap;
}
.health-history-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 9px;
}
.health-history-grid div {
  padding: 9px;
  border-radius: 6px;
  background: #08111e;
  text-align: center;
}
.health-history-grid small,
.health-history-grid strong {
  display: block;
}
.health-history-grid small {
  color: #61758d;
  font-size: 7px;
}
.health-history-grid strong {
  margin-top: 4px;
  color: #e9f7ff;
  font-size: 12px;
}
.health-history-note {
  display: block;
  font-size: 9px;
}
.prealarm-history-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 13px;
  border-bottom: 1px solid #1c3048;
}
.prealarm-history-heading strong,
.prealarm-history-heading small,
.prealarm-history-row strong,
.prealarm-history-row small {
  display: block;
}
.prealarm-history-heading small,
.prealarm-history-row small {
  color: #7d91aa;
  margin-top: 3px;
}
.prealarm-history-totals {
  display: flex;
  gap: 8px;
  text-align: center;
}
.prealarm-history-totals span {
  min-width: 62px;
  padding: 7px;
  border-radius: 6px;
  background: #10233a;
  color: #59d8ff;
  font-weight: 800;
}
.prealarm-history-totals small {
  font-weight: 500;
  font-size: 8px;
}
.prealarm-history-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 13px;
  border-bottom: 1px solid #15283d;
}
.prealarm-history-row:last-child {
  border-bottom: 0;
}
.prealarm-history-row > span {
  min-width: 125px;
  color: #6fe6a7;
  text-align: right;
  font-weight: 700;
}
.prealarm-history-row.escalated > span {
  color: #ffb24d;
}
.prealarm-history-row.active > span {
  color: #59d8ff;
}
.prealarm-history-empty {
  padding: 16px;
  text-align: center;
  color: #71839a;
}
.homologation-panel-head {
  align-items: center;
}
.homologation-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin: 14px 0;
}
.homologation-summary div {
  display: grid;
  place-items: center;
  min-height: 82px;
  padding: 12px;
  border: 1px solid #233a54;
  border-radius: 8px;
  background: #091625;
  text-align: center;
}
.homologation-summary strong {
  color: #61e5b0;
  font-size: 25px;
}
.homologation-summary small {
  color: #7e93ab;
  margin-top: 4px;
  font-size: 9px;
  letter-spacing: 0.08em;
}
.homologation-summary .failed strong {
  color: #ff7585;
}
.pilot-readiness {
  margin: 18px 0;
  padding: 18px;
  border: 1px solid rgba(35, 154, 255, 0.22);
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    rgba(7, 19, 35, 0.98),
    rgba(9, 29, 50, 0.9)
  );
}
.pilot-readiness-head,
.pilot-readiness-segment-head,
.pilot-readiness-check {
  display: flex;
  align-items: center;
}
.pilot-readiness-head {
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.pilot-readiness-head > div,
.pilot-readiness-check > div {
  display: grid;
  gap: 3px;
}
.pilot-readiness-head strong {
  font-size: 24px;
}
.pilot-readiness-head small,
.pilot-readiness-check small {
  color: #7e93ab;
}
.pilot-readiness-segments {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.pilot-readiness-segment {
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(3, 12, 22, 0.58);
}
.pilot-readiness-segment.passed {
  border-color: rgba(78, 225, 206, 0.36);
}
.pilot-readiness-segment.failed {
  border-color: rgba(255, 93, 113, 0.44);
}
.pilot-readiness-segment-head {
  justify-content: space-between;
  margin-bottom: 10px;
}
.pilot-readiness-segment-head span {
  color: #27b6ff;
  font-weight: 800;
}
.pilot-readiness-check {
  align-items: flex-start;
  gap: 9px;
  padding: 9px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.pilot-readiness-check i {
  display: grid;
  place-items: center;
  flex: 0 0 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(255, 186, 73, 0.15);
  color: #ffba49;
  font-style: normal;
  font-weight: 900;
}
.pilot-readiness-check.passed i {
  background: rgba(78, 225, 206, 0.15);
  color: #4ee1ce;
}
.pilot-readiness-check.failed i {
  background: rgba(255, 93, 113, 0.15);
  color: #ff7585;
}
.homologation-list {
  display: grid;
  gap: 14px;
  margin-top: 15px;
}
.homologation-camera {
  overflow: hidden;
  border: 1px solid #253b54;
  border-radius: 9px;
  background: #091522;
}
.homologation-camera-head,
.homologation-check {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.homologation-camera-head {
  padding: 13px 15px;
  background: #0d1d30;
}
.homologation-camera-head strong,
.homologation-camera-head small,
.homologation-check strong,
.homologation-check small,
.homologation-check em {
  display: block;
}
.homologation-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}
.homologation-evidence span {
  padding: 3px 7px;
  border: 1px solid #2b4259;
  border-radius: 999px;
  background: #0b1a2a;
  color: #8499af;
  font-size: 10px;
  font-weight: 700;
}
.homologation-evidence .available {
  border-color: #245a48;
  color: #65dba8;
}
.homologation-evidence .missing {
  border-color: #59452b;
  color: #d9aa68;
}
.homologation-camera-head small,
.homologation-check small {
  color: #7389a2;
  margin-top: 3px;
}
.homologation-check {
  min-height: 58px;
  padding: 10px 15px;
  border-top: 1px solid #192c41;
  border-left: 4px solid #f4b34f;
}
.homologation-check.passed {
  border-left-color: #4bd69a;
}
.homologation-check.failed {
  border-left-color: #ff6677;
}
.homologation-check.disabled {
  border-left-color: #53657a;
  opacity: 0.58;
}
.homologation-check em {
  color: #a8b8ca;
  margin-top: 5px;
  font-size: 10px;
  font-style: normal;
}
.homologation-check-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}
.homologation-check-actions > span {
  min-width: 92px;
  color: #f4b34f;
  text-align: center;
  font-weight: 800;
}
.homologation-check.passed .homologation-check-actions > span {
  color: #4bd69a;
}
.homologation-check.failed .homologation-check-actions > span {
  color: #ff6677;
}
.homologation-check-actions button {
  border: 1px solid #294764;
  border-radius: 6px;
  background: #102640;
  color: #a9dfff;
  padding: 7px 9px;
  cursor: pointer;
}
.settings-card .save-settings {
  height: 42px;
  width: 100%;
  border: 0;
  border-radius: 6px;
  background: linear-gradient(135deg, #20a9f6, #147cf1);
  color: white;
  font-weight: 700;
}
@media (max-width: 600px) {
  .pilot-readiness-segments {
    grid-template-columns: 1fr;
  }
  .settings-grid,
  .diagnostic-grid {
    grid-template-columns: 1fr 1fr;
  }
  .system-health-card {
    grid-column: auto;
  }
  .health-grid {
    grid-template-columns: 1fr 1fr;
  }
  .prealarm-history-heading,
  .prealarm-history-row,
  .health-history-heading {
    align-items: stretch;
    flex-direction: column;
  }
  .prealarm-history-row > span {
    text-align: left;
  }
  .health-history-grid {
    grid-template-columns: 1fr 1fr;
  }
  .homologation-summary {
    grid-template-columns: 1fr 1fr;
  }
  .homologation-camera-head,
  .homologation-check,
  .homologation-check-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .homologation-check-actions > span {
    text-align: left;
  }
}

/* Escala administrativa ampliada. */
body {
  font-size: 15px;
}
body small,
body label,
body .eyebrow,
body th {
  font-size: 11px;
}
body p,
body td,
body strong {
  font-size: 13px;
}
body button,
body input,
body select,
body textarea {
  font-size: 13px;
}
.form-help {
  display: block;
  color: #71839a;
  font-size: 9px;
  line-height: 1.5;
  margin: -7px 0 12px;
}
.delivery-panel {
  margin-top: 15px;
}
.delivery-row {
  grid-template-columns: 1fr 1.6fr 0.8fr 0.8fr 1.2fr;
}
.delivery-row strong small,
.delivery-row span small {
  display: block;
  color: #65758a;
  font-size: 8px;
  margin-top: 3px;
}
.delivery-status {
  font-weight: 800;
}
.status-sent,
.status-delivered,
.status-read {
  color: #5ee7a0;
}
.status-pending,
.status-accepted,
.status-retry {
  color: #ffb84d;
}
.status-failed {
  color: #ff6677;
}
.status-cancelled,
.status-skipped {
  color: #718096;
}
.day-selector {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  margin: 15px 0;
}
.day-selector label {
  display: grid;
  place-items: center;
  gap: 5px;
  background: #08111e;
  border: 1px solid #1d2a3b;
  border-radius: 6px;
  padding: 8px 3px;
  margin: 0;
  font-size: 8px;
}
.day-selector input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: #4ee1ce;
}
.bulk-rule-types {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 14px 0;
}
.bulk-rule-types label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 9px;
  border: 1px solid #263d58;
  border-radius: 6px;
  background: #0b192a;
}
.bulk-rule-types input {
  width: 16px;
  height: 16px;
  accent-color: #4ee1ce;
}
.bulk-schedule-actions {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 8px;
}
.bulk-schedule-actions > button:first-child {
  border: 1px solid #36516f;
  border-radius: 6px;
  background: #10223a;
  color: #a7d9ff;
}
.silence-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  margin-top: 14px;
}
.silence-actions button {
  border: 1px solid #38506b;
  background: #10223a;
  color: #8fcfff;
  border-radius: 6px;
  padding: 10px;
  font-size: 9px;
  cursor: pointer;
}
.schedule-rule {
  width: 100%;
  min-height: 38px;
  border-color: #396f96;
  background: #102d47;
  color: #9addff;
  line-height: 1.25;
}
.ai-configuration-guide,
.ai-rule-summary {
  display: grid;
  gap: 10px;
  margin: 14px 0;
}
.ai-configuration-guide {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ai-configuration-guide > div {
  display: grid;
  gap: 5px;
  padding: 13px;
  border: 1px solid #274b69;
  border-radius: 10px;
  background: linear-gradient(145deg, #0c2034, #091726);
}
.ai-configuration-guide strong {
  color: #62d9ff;
  font-size: 11px;
}
.ai-configuration-guide span {
  color: #9aadc0;
  font-size: 9px;
  line-height: 1.5;
}
.ai-rule-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.ai-rule-summary > div {
  display: grid;
  place-content: center;
  min-height: 70px;
  text-align: center;
  border: 1px solid #284761;
  border-radius: 9px;
  background: #0b1b2b;
}
.ai-rule-summary strong {
  color: #60ddff;
  font-size: 21px;
}
.ai-rule-summary small {
  color: #8fa2b6;
  font-size: 8px;
  letter-spacing: 0.7px;
}
.camera-locked-context {
  border-left: 4px solid #4ee1ce;
}
.camera-locked-context > div > span {
  color: #4ee1ce;
}
.rule-inline-field {
  display: grid;
  gap: 3px;
  margin: 0;
}
.rule-inline-field small {
  color: #7f93a8;
  font-size: 7px;
  text-align: center;
}
.rule-inline-field input {
  margin: 0;
}
.rule-schedule-actions {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.rule-schedule-actions [data-rule-always-on] {
  border-color: #287d72;
  background: #0c302d;
  color: #73efda;
}
.user-item {
  gap: 14px;
}
.user-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}
.site-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.site-actions button {
  border: 1px solid #28405e;
  background: #10223a;
  color: #8fcfff;
  border-radius: 5px;
  padding: 7px 10px;
  font-size: 9px;
  cursor: pointer;
}
.site-actions .enter-site {
  border-color: #1682ca;
  background: linear-gradient(135deg, #1067a8, #1595da);
  color: #fff;
  font-weight: 800;
}
.rule-context-selector {
  display: grid;
  gap: 14px;
  margin: 14px 0;
  padding: 16px;
  border: 1px solid #25547a;
  border-radius: 12px;
  background: linear-gradient(135deg, #0a1b2e, #0b2438);
}
.rule-context-heading,
.rule-context-heading strong,
.rule-context-heading span {
  display: block;
}
.rule-context-heading strong {
  color: #59d9ff;
  font-size: 11px;
  letter-spacing: 0.11em;
}
.rule-context-heading span {
  margin-top: 4px;
  color: #9aacbf;
  font-size: 10px;
}
.rule-context-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.rule-context-fields.camera-context-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rule-context-fields label {
  margin: 0;
  color: #b9c9d9;
  font-size: 10px;
  font-weight: 800;
}
.rule-context-fields select {
  margin: 6px 0 0;
}
.rule-contract-context {
  display: grid;
  grid-template-columns: minmax(190px, 0.8fr) minmax(280px, 1.5fr) auto;
  gap: 14px;
  align-items: center;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid #263b57;
  border-radius: 10px;
  background: #08131f;
}
.rule-contract-context > div > span,
.rule-contract-context > div > strong,
.rule-contract-context > div > small {
  display: block;
}
.rule-contract-context > div > span {
  color: #5edcff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.1em;
}
.rule-contract-context > div > small {
  margin-top: 4px;
  color: #91a4b7;
}
.contracted-module-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.contracted-module-pills span,
.rule-contract-status {
  padding: 5px 7px;
  border: 1px solid;
  border-radius: 999px;
  font-size: 8px;
  font-weight: 800;
}
.contracted-module-pills .contracted,
.rule-contract-status.contracted {
  border-color: #287d72;
  background: #0c302d;
  color: #64ead3;
}
.contracted-module-pills .not-contracted,
.rule-contract-status.not-contracted {
  border-color: #775e27;
  background: #2b220e;
  color: #f0c86d;
}
.selected-camera-banner,
.rule-context-empty {
  display: grid;
  gap: 5px;
  padding: 16px;
  border: 1px solid #28557a;
  border-radius: 10px;
  background: #0b1c2e;
}
.selected-camera-banner {
  margin-top: 14px;
  border-width: 2px;
  border-color: #48d7ff;
  box-shadow:
    0 0 0 1px rgba(72, 215, 255, 0.08),
    0 12px 28px rgba(0, 0, 0, 0.2);
}
.selected-camera-banner strong {
  color: #f3fbff;
  font-size: 15px;
}
.selected-camera-banner span {
  color: #55d9ff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.11em;
}
.selected-camera-banner small,
.rule-context-empty span {
  color: #96a9bc;
}
.rule-context-empty {
  margin: 14px 0;
  text-align: center;
}
.rule-not-contracted {
  opacity: 0.56;
}
.rule-row {
  grid-template-columns: 1.2fr 0.8fr 0.55fr 0.5fr 0.55fr 0.55fr 0.65fr 0.75fr 0.35fr 0.75fr 0.55fr;
  min-width: 1320px;
}
.danger-confirmation {
  display: grid;
  gap: 7px;
  margin: 14px 0;
  padding: 12px;
  border: 1px solid #7b5f25;
  border-radius: 9px;
  background: #2b210d;
}
.danger-confirmation input {
  margin: 0;
}
.site-module-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.site-module-option {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 82px;
  margin: 0;
  padding: 13px;
  border: 1px solid #263b57;
  border-radius: 9px;
  background: #08111e;
  cursor: pointer;
}
.site-module-option input {
  width: 19px;
  height: 19px;
  margin: 0;
  flex: 0 0 auto;
  accent-color: #4ee1ce;
}
.site-module-option strong,
.site-module-option small {
  display: block;
}
.site-module-option strong {
  color: #64dcff;
  font-size: 11px;
}
.site-module-option small {
  margin-top: 5px;
  color: #8fa0b4;
  font-size: 9px;
  line-height: 1.4;
}
.module-contract-note {
  margin: 14px 0;
  padding: 12px;
  border-left: 3px solid #4ee1ce;
  background: #0f2035;
}
.module-contract-note strong,
.module-contract-note small {
  display: block;
}
.remote-update-status {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  align-items: center;
  padding: 18px;
  border: 1px solid #28405e;
  border-radius: 9px;
  background: #08111e;
}
.remote-update-status strong,
.remote-update-status small {
  grid-column: 2;
}
.remote-update-status strong {
  color: #64dcff;
  font-size: 13px;
}
.remote-update-status small {
  margin-top: 5px;
  color: #8fa0b4;
  line-height: 1.45;
}
.remote-update-spinner {
  grid-row: 1 / span 2;
  width: 27px;
  height: 27px;
  border: 3px solid #23405e;
  border-top-color: #4ee1ce;
  border-radius: 50%;
  animation: remote-update-spin 0.9s linear infinite;
}
.remote-update-status.completed {
  border-color: #277c71;
}
.remote-update-status.completed .remote-update-spinner {
  border-color: #4ee1ce;
  animation: none;
}
.remote-update-status.failed,
.remote-update-status.expired {
  border-color: #8d4452;
}
.remote-update-status.failed .remote-update-spinner,
.remote-update-status.expired .remote-update-spinner {
  border-color: #ff8494;
  animation: none;
}
@keyframes remote-update-spin {
  to {
    transform: rotate(360deg);
  }
}
.module-contract-note small {
  margin-top: 4px;
  color: #8fa0b4;
  line-height: 1.45;
}
.user-actions button,
.compact-action,
.secondary-action,
.pagination button {
  border: 1px solid #28405e;
  background: #10223a;
  color: #8fcfff;
  border-radius: 5px;
  padding: 7px 9px;
  font-size: 8px;
  cursor: pointer;
}
.system-grid {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 15px;
  margin-bottom: 15px;
}
.secondary-action {
  width: 100%;
  margin-top: 10px;
  height: 39px;
}
.compact-action {
  margin-left: auto;
}
.compact-list {
  max-height: 280px;
  overflow: auto;
}
.empty-state {
  color: #718096;
  font-size: 10px;
}
.mfa-qr {
  display: grid;
  justify-items: center;
  gap: 10px;
  margin: 16px 0;
  padding: 14px;
  border-radius: 8px;
  background: #f5f9fc;
  color: #24364d;
  overflow-wrap: anywhere;
}
.mfa-qr img {
  width: min(240px, 100%);
  aspect-ratio: 1;
}
.audit-panel {
  overflow: hidden;
}
.filter-row {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr auto;
  gap: 9px;
  align-items: end;
  margin-bottom: 18px;
}
.filter-row label {
  margin: 0;
}
.filter-row button {
  width: auto;
  padding: 0 22px;
}
.audit-table {
  overflow: auto;
}
.audit-row {
  display: grid;
  grid-template-columns: 1fr 1fr 0.8fr 1fr;
  gap: 12px;
  align-items: center;
  min-width: 680px;
  padding: 11px 7px;
  border-bottom: 1px solid #1d2a3b;
  color: #8d9bad;
  font-size: 9px;
}
.audit-row strong {
  color: #dfe8ed;
}
.audit-head {
  color: #5f6f83;
  font-size: 8px;
  letter-spacing: 1px;
}
.audit-action {
  color: #4ee1ce;
}
.pagination {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 15px;
}
.pagination span {
  color: #718096;
  font-size: 9px;
}
.pagination button:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.toast.error {
  background: #321921;
  border-color: #69303d;
  color: #ffbdc6;
}
.check-list {
  display: grid;
  gap: 7px;
  margin: 15px 0;
}
.check-list label {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px;
  background: #08111e;
  border-radius: 6px;
  margin: 0;
}
.check-list input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #4ee1ce;
}
.station-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(330px, 0.75fr);
  gap: 16px;
  align-items: start;
}
.station-overview-panel,
.station-form-panel,
.station-actions-panel {
  min-width: 0;
}
.station-actions-panel {
  margin-top: 16px;
}
.station-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}
.station-summary > div {
  min-height: 78px;
  display: grid;
  place-content: center;
  gap: 5px;
  padding: 12px;
  text-align: center;
  border: 1px solid #243a54;
  border-radius: 10px;
  background: linear-gradient(145deg, #0b1728, #0f2035);
}
.station-summary strong {
  color: #65dcff;
  font-size: 22px;
}
.station-summary small {
  color: #8294aa;
  font-size: 8px;
  letter-spacing: 0.9px;
}
.station-list {
  display: grid;
  gap: 12px;
}
.station-card {
  border: 1px solid #27415e;
  border-radius: 12px;
  padding: 15px;
  background: linear-gradient(
    150deg,
    rgba(14, 31, 51, 0.96),
    rgba(7, 17, 30, 0.98)
  );
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
}
.station-card.disabled {
  opacity: 0.66;
}
.station-card-head,
.station-card-actions,
.station-action-row,
.station-action-controls {
  display: flex;
  align-items: center;
}
.station-card-head {
  justify-content: space-between;
  gap: 15px;
}
.station-card h3 {
  margin: 4px 0;
  color: #f1f7fb;
  font-size: 15px;
}
.station-card p,
.station-card span,
.station-card-metrics small,
.station-card-metrics span {
  color: #8fa0b4;
  font-size: 9px;
}
.station-code {
  color: #4ee1ce !important;
  font-weight: 800;
  letter-spacing: 1px;
}
.station-card-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.station-card-metrics > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border-radius: 8px;
  background: rgba(3, 11, 20, 0.55);
}
.station-card-metrics strong {
  color: #dfeaf2;
  font-size: 10px;
  overflow-wrap: anywhere;
}
.station-card-actions,
.station-action-controls {
  gap: 8px;
  flex-wrap: wrap;
}
.station-card-actions button,
.station-action-controls button {
  border: 1px solid #2a4969;
  border-radius: 7px;
  padding: 8px 11px;
  background: #10253e;
  color: #91d8ff;
  font-size: 9px;
  cursor: pointer;
}
.station-fieldset {
  margin: 12px 0;
  padding: 12px;
  border: 1px solid #263a52;
  border-radius: 9px;
}
.station-fieldset legend {
  padding: 0 7px;
  color: #65dcff;
  font-size: 10px;
  font-weight: 800;
}
.station-roi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin-top: 10px;
}
.station-permissions {
  grid-template-columns: 1fr 1fr;
}
.station-form-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 9px;
}
.station-form-actions .secondary-action {
  width: auto;
  min-width: 90px;
  margin: 0;
}
.station-action-list {
  display: grid;
  gap: 8px;
}
.station-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  padding: 12px;
  border: 1px solid #21364e;
  border-radius: 9px;
  background: #0a1626;
}
.station-action-row.emergency {
  border-color: #9a4554;
  background: #27141c;
}
.station-action-row strong,
.station-action-row small {
  display: block;
}
.station-voice-player {
  margin-top: 9px;
}
.station-voice-player audio {
  display: block;
  width: min(100%, 420px);
  height: 36px;
}
.lookup-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}
.lookup-field button {
  width: auto;
  min-height: 39px;
  margin: 0 0 10px;
  white-space: nowrap;
}
.commercial-fields {
  margin: 14px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.commercial-fields legend {
  padding: 0 7px;
  color: var(--cyan);
  font-size: 12px;
  font-weight: 800;
}
.site-form-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}
.site-form-actions button {
  width: auto;
}
.station-action-row strong {
  color: #e7f0f5;
  font-size: 11px;
}
.station-action-row small {
  margin-top: 4px;
  color: #8597aa;
  font-size: 9px;
}
.station-empty {
  display: grid;
  gap: 5px;
  padding: 28px;
  text-align: center;
  border: 1px dashed #2b435d;
  border-radius: 10px;
}
.client-workspace[hidden],
#siteList[hidden],
#siteCreateWorkspace[hidden],
#postWorkspace[hidden],
#cameraFormPanel[hidden],
nav button[hidden] {
  display: none !important;
}
.client-workspace {
  display: grid;
  gap: 14px;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid #2d78a8;
  border-radius: 14px;
  background: linear-gradient(
    145deg,
    rgba(13, 39, 63, 0.98),
    rgba(7, 20, 35, 0.98)
  );
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);
}
.client-workspace-head,
.client-workspace-actions,
.client-post-title,
.client-post-actions,
.locked-context {
  display: flex;
  align-items: center;
}
.client-workspace-head,
.client-post-title,
.locked-context {
  justify-content: space-between;
  gap: 14px;
}
.client-workspace-head span,
.client-post-title > div > span,
.locked-context span {
  color: #39aefc;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1.1px;
}
.client-workspace-head h3,
.client-post-title h3 {
  margin: 4px 0;
  color: #f3f8fc;
}
.client-workspace-head h3 {
  font-size: 20px;
}
.client-workspace-head small,
.locked-context small {
  color: #92a7bb;
  font-size: 10px;
}
.client-workspace-actions,
.client-post-actions {
  gap: 8px;
  flex-wrap: wrap;
}
.client-workspace-actions button,
.client-post-actions button,
.locked-context button,
.rule-context-empty button {
  width: auto;
  margin: 0;
  border: 1px solid #2e648e;
  border-radius: 8px;
  padding: 9px 12px;
  background: #102b45;
  color: #dff4ff;
  font-size: 10px;
  cursor: pointer;
}
.hierarchy-guide {
  display: grid;
  gap: 3px;
  padding: 11px 13px;
  border-radius: 9px;
  background: rgba(30, 132, 199, 0.12);
}
.hierarchy-guide strong {
  color: #71d6ff;
  font-size: 11px;
}
.hierarchy-guide span {
  color: #9fb2c4;
  font-size: 10px;
}
.client-post-list {
  display: grid;
  gap: 11px;
}
.client-post-card {
  padding: 14px;
  border: 1px solid #29445f;
  border-radius: 11px;
  background: rgba(5, 16, 29, 0.68);
}
.client-post-title h3 {
  font-size: 15px;
}
.client-post-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
}
.client-post-metrics > div {
  display: grid;
  place-content: center;
  min-height: 58px;
  text-align: center;
  border-radius: 8px;
  background: rgba(14, 36, 58, 0.85);
}
.client-post-metrics strong {
  color: #64ddff;
  font-size: 19px;
}
.client-post-metrics small {
  color: #8ea1b5;
  font-size: 8px;
  letter-spacing: 0.7px;
}
.selected-client {
  border-color: #318dcc !important;
  background: rgba(29, 113, 168, 0.1) !important;
}
.locked-context {
  width: 100%;
}
.locked-context > div {
  display: grid;
  gap: 4px;
}
.locked-context strong {
  color: #f0f7fb;
  font-size: 12px;
}
.locked-context strong b {
  margin: 0 5px;
  color: #3ca8ff;
}
@media (max-width: 900px) {
  .system-grid {
    grid-template-columns: 1fr;
  }
  .filter-row {
    grid-template-columns: 1fr 1fr;
  }
  .filter-row button {
    height: 41px;
  }
  .station-layout {
    grid-template-columns: 1fr;
  }
  .rule-context-fields,
  .rule-context-fields.camera-context-fields,
  .rule-contract-context {
    grid-template-columns: 1fr;
  }
  .station-card-metrics {
    grid-template-columns: 1fr;
  }
  .ai-configuration-guide,
  .ai-rule-summary {
    grid-template-columns: 1fr;
  }
  .client-workspace-head,
  .locked-context {
    align-items: flex-start;
    flex-direction: column;
  }
}
@media (max-width: 600px) {
  .filter-row {
    grid-template-columns: 1fr;
  }
  .user-item {
    align-items: flex-start;
    flex-direction: column;
  }
  .user-actions {
    justify-content: flex-start;
  }
  .site-module-grid {
    grid-template-columns: 1fr;
  }
  .station-summary,
  .station-permissions,
  .station-roi-grid {
    grid-template-columns: 1fr 1fr;
  }
  .station-action-row {
    grid-template-columns: 1fr;
  }
  .lookup-field {
    grid-template-columns: 1fr;
  }
  .lookup-field button {
    width: 100%;
    margin-top: -6px;
  }
  .client-post-metrics {
    grid-template-columns: 1fr;
  }
  .rule-schedule-actions {
    grid-template-columns: 1fr;
  }
}
.agent-license-panel {
  grid-column: 1 / -1;
}

.agent-license-modules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}

.agent-license-modules label {
  align-items: center;
  background: rgba(20, 92, 190, 0.08);
  border: 1px solid rgba(79, 158, 255, 0.22);
  border-radius: 12px;
  display: flex;
  gap: 0.55rem;
  justify-content: center;
  min-height: 46px;
  text-align: center;
}

.danger-action {
  border-color: rgba(244, 95, 95, 0.48) !important;
  color: #ffadad !important;
}

@media (max-width: 760px) {
  .agent-license-modules {
    grid-template-columns: 1fr 1fr;
  }
}