body { font-family: Inter, Arial, sans-serif; margin: 0; background: #f4f6fb; color: #1f2937; }
body.evas-dashboard-bg,
body.maxim-dashboard-bg {
  background:
    linear-gradient(rgba(2, 12, 18, 0.38), rgba(2, 12, 18, 0.68)),
    url('/ui/assets/evas-dashboard-bg.jpg') center center / cover fixed no-repeat !important;
}
body.modal-open { overflow: hidden; }
.hidden { display: none !important; }
header { background: linear-gradient(135deg, #0b132a 0%, #111827 55%, #1d4ed8 100%); color: #fff; padding: 14px 20px; }
header h1 { margin: 0 0 4px; font-size: 20px; }
header .hint { color: #cbd5e1; font-size: 13px; }
main { padding: 16px; display: grid; gap: 14px; }
.card { background: #fff; border-radius: 10px; padding: 14px; box-shadow: 0 2px 12px rgba(0,0,0,.06); border: 1px solid rgba(148, 163, 184, 0.2); }
h2 { margin: 0 0 10px; }
h3 { margin: 16px 0 8px; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)); gap: 10px; }
.mx-send-grid { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(280px, 1.3fr) minmax(360px, 1.8fr); gap: 10px; align-items: end; }
.mx-send-grid .mx-send-customer-label { grid-column: span 2; }
.mx-send-grid .mx-send-destination-label { grid-column: span 2; }
.mx-send-grid .mx-send-message-label { grid-column: 1 / -1; }
.mx-send-grid textarea#mx-send-message { min-height: 78px; resize: vertical; }
.mx-send-status { font-weight: 800; color: #bfdbfe; }
.mx-send-status.ok { color: #86efac; }
.mx-send-status.error { color: #fca5a5; }
@media (max-width: 980px) {
  .mx-send-grid { grid-template-columns: 1fr; }
  .mx-send-grid .mx-send-customer-label,
  .mx-send-grid .mx-send-destination-label,
  .mx-send-grid .mx-send-message-label { grid-column: auto; }
}
.grid3.report-compact { grid-template-columns: 120px 170px 150px; gap: 8px; align-items: end; }
.grid3.report-compact label { font-size: 12px; gap: 4px; }
.grid3.report-compact input { padding: 6px 8px; font-size: 13px; }
#op-point-name { max-width: 170px; }
.row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.row.between { justify-content: space-between; }
.mx-date-filter-row { align-items: flex-end; gap: 10px; }
.mx-date-filter-row #mx-refresh { min-height: 36px; padding: 7px 14px; font-size: 14px; line-height: 1.1; margin-bottom: 0; }
.mt { margin-top: 10px; }
label { font-size: 13px; display: flex; flex-direction: column; gap: 5px; }
input, select, button { font-size: 14px; padding: 8px; border-radius: 8px; border: 1px solid #c7d2fe; }
button { background: #2563eb; color: #fff; border: none; cursor: pointer; transition: transform .08s ease, box-shadow .15s ease, background .2s ease; }
button:hover { background: #1d4ed8; box-shadow: 0 4px 12px rgba(29, 78, 216, 0.32); }
button:active { transform: translateY(1px); }
a { color: #1d4ed8; text-decoration: none; font-weight: 600; }
.as-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #334155;
  color: #e2e8f0;
  background: transparent;
  line-height: 1.2;
}
.as-btn:hover { background: rgba(148, 163, 184, 0.1); }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 8px; border-bottom: 1px solid #e5e7eb; text-align: left; }
tr:hover { background: #f9fafb; }
#mx-reports-table.compact th,
#mx-reports-table.compact td {
  padding: 5px 6px;
  font-size: 12px;
}
#mx-reports-table.compact .mx-actions-cell {
  gap: 4px;
}
#mx-reports-table.compact .mx-actions-cell .ghost {
  padding: 5px 6px;
  font-size: 12px;
}
pre { background: #0b1020; color: #bef264; padding: 12px; border-radius: 8px; max-height: 240px; overflow: auto; font-size: 12px; }
.inline-check { display: inline-flex; flex-direction: row; align-items: center; gap: 6px; }
.inline-check input { margin: 0; }
.selected-row { outline: 2px solid rgba(37, 99, 235, 0.35); }

.workflow-steps { display:flex; gap:8px; flex-wrap:wrap; }
.wf-step { font-size:12px; padding:4px 8px; border-radius:999px; border:1px solid #cbd5e1; color:#475569; background:#f8fafc; }
.wf-step.current { border-color:#93c5fd; background:#eff6ff; color:#1d4ed8; }
.wf-step.done { border-color:#86efac; background:#f0fdf4; color:#166534; }
.wf-step.ready { border-color:#fcd34d; background:#fefce8; color:#92400e; }

.mx-row-new {
  background: rgba(34, 197, 94, 0.12);
}

.mx-row-viewed {
  opacity: 0.92;
}

.mx-new-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 999px;
  margin-left: 6px;
  background: rgba(34, 197, 94, 0.25);
  color: #86efac;
  font-size: 10px;
  font-weight: 700;
}

.mx-report-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: 999px;
  margin-left: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .01em;
  text-transform: uppercase;
  background: rgba(148, 163, 184, 0.25);
  color: #e5e7eb;
}
.mx-report-status-badge.status-approved,
.mx-report-status-badge.status-sent,
.mx-report-status-badge.status-in_weekly_package { background: rgba(34, 197, 94, 0.25); color: #86efac; }
.mx-report-status-badge.status-returned { background: rgba(245, 158, 11, 0.26); color: #fcd34d; }

.status-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  background: #e5e7eb;
  color: #111827;
}

.status-chip.status-in_review_maxim { background: rgba(59, 130, 246, 0.22); color: #dbeafe; }
.status-chip.status-returned { background: rgba(245, 158, 11, 0.24); color: #fef3c7; }
.status-chip.status-qc_passed { background: rgba(16, 185, 129, 0.24); color: #d1fae5; }
.status-chip.status-qc_failed { background: rgba(239, 68, 68, 0.24); color: #fee2e2; }
.status-chip.status-approved,
.status-chip.status-sent { background: rgba(34, 197, 94, 0.24); color: #dcfce7; }
.status-chip.status-ok { background: rgba(34, 197, 94, 0.24); color: #dcfce7; }
.status-chip.status-risk { background: rgba(245, 158, 11, 0.24); color: #fef3c7; }
.status-chip.status-breach { background: rgba(239, 68, 68, 0.24); color: #fee2e2; }

.mx-actions-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.mx-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(110px, 1fr));
  gap: 8px;
}

.mx-kpi-card {
  border: 1px solid #2a3f68;
  border-radius: 10px;
  background: #0c1730;
  padding: 8px 10px;
  display: grid;
  gap: 3px;
}

.mx-kpi-label {
  color: #93c5fd;
  font-size: 11px;
  letter-spacing: .2px;
}

.mx-kpi-card b {
  color: #e2e8f0;
  font-size: 18px;
  line-height: 1.1;
}

.report-details {
  margin-top: 12px;
  border: 1px solid #253963;
  border-radius: 10px;
  padding: 10px;
  background: #0c1730;
}

.report-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 8px;
}

.mx-report-view-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: start;
}
.mx-report-cases-panel,
.mx-report-summary-panel {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 10px;
  padding: 10px;
  background: rgba(15, 23, 42, 0.34);
  min-width: 0;
}
.mx-report-cases-panel { max-height: 640px; overflow: auto; }
.mx-report-card-list {
  padding-left: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 10px;
}
.mx-report-case-item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.22);
}
.mx-report-case-thumb-wrap {
  position: relative;
  width: 96px;
  height: 68px;
  border-radius: 8px;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.25);
}
.mx-report-case-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}
.mx-report-case-thumb.ready { display: block; }
.mx-report-case-thumb-empty {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  text-align: center;
  color: #94a3b8;
  font-size: 11px;
}
.mx-report-case-info { display: grid; gap: 5px; min-width: 0; }
.mx-report-case-title { font-weight: 700; color: #e5e7eb; line-height: 1.2; }

.report-list {
  margin: 8px 0 0;
  padding-left: 16px;
  display: grid;
  gap: 6px;
}

.report-list li { font-size: 13px; }
.report-list li.qc-ok { color: #86efac; }
.report-list li.qc-bad { color: #fca5a5; }

.mx-ops-card { display: grid; gap: 12px; }
.mx-ops-group {
  border: 1px solid #d7e3ff;
  border-radius: 10px;
  background: #f7faff;
  padding: 10px;
}
.mx-ops-group h3 { margin: 0 0 10px; font-size: 14px; }
.mx-ops-row-tight { margin-top: 6px; }
.mx-inline-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}
.mx-pass-field { min-width: 320px; flex: 1; }
.mx-pass-field input[readonly] {
  background: #0a1328;
  border-color: #334155;
  color: #bfdbfe;
}
.mx-check-dropdown {
  position: relative;
  min-width: 260px;
}
.mx-check-dropdown > summary {
  list-style: none;
  cursor: pointer;
  border: 1px solid #334155;
  border-radius: 8px;
  padding: 8px 10px;
  color: #e2e8f0;
  background: transparent;
  user-select: none;
}
.mx-check-dropdown > summary::-webkit-details-marker { display: none; }
.mx-check-dropdown > summary::after {
  content: '▾';
  float: right;
  opacity: .8;
}
.mx-check-dropdown[open] > summary::after { content: '▴'; }
.mx-check-dropdown-body {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 30;
  width: min(560px, 88vw);
  border: 1px solid #2a3f68;
  border-radius: 10px;
  background: #0c1730;
  padding: 8px;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.35);
}
.mx-bulk-list {
  margin-top: 6px;
  max-height: 140px;
  overflow: auto;
  border: 1px solid #2a3f68;
  border-radius: 8px;
  padding: 6px 8px;
  display: grid;
  gap: 4px;
  background: #0a1328;
}

.mx-finance-panel {
  border: 1px solid #2a3f68;
  border-radius: 10px;
  padding: 8px;
  background: #0c1730;
}

.mx-finance-title {
  font-size: 12px;
  font-weight: 700;
  color: #bfdbfe;
  margin-bottom: 6px;
}

.mx-finance-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(80px, 1fr));
  gap: 6px;
  align-items: end;
}

.mx-finance-grid-top > label:nth-child(1) { grid-column: span 3; }
.mx-finance-grid-top > label:nth-child(2) { grid-column: span 3; }
.mx-finance-grid-top .mx-finance-actions { grid-column: span 6; display: flex; flex-wrap: wrap; gap: 6px; align-items: end; }

.mx-finance-grid-bottom > label:nth-child(1) { grid-column: span 3; }
.mx-finance-grid-bottom > label:nth-child(2) { grid-column: span 3; }
.mx-finance-grid-bottom > label:nth-child(3) { grid-column: span 3; }
.mx-finance-grid-bottom .mx-finance-actions { grid-column: span 3; display: flex; align-items: end; }

.mx-finance-actions {
  margin-top: 0;
  justify-content: flex-start;
  gap: 6px;
}

.mx-finance-panel label {
  font-size: 12px;
}

.mx-finance-panel input,
.mx-finance-panel select {
  padding: 6px 8px;
  height: 42px;
  min-height: 42px;
  box-sizing: border-box;
}

.mx-finance-panel .ghost,
.mx-finance-panel button {
  padding: 6px 10px;
  height: 42px;
  min-height: 42px;
  box-sizing: border-box;
  line-height: 1;
}

.mx-textq-toolbar {
  gap: 8px;
}

.mx-textq-toolbar label {
  font-size: 12px;
}

.mx-textq-grid {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
  gap: 8px;
}

#mx-text-quality-charts .folder-item,
#mx-text-quality-top .folder-item {
  padding: 6px 8px;
  gap: 6px;
}

#mx-text-quality-charts .folder-title,
#mx-text-quality-top .folder-title {
  font-size: 12px;
  line-height: 1.2;
}

#mx-text-quality-charts .hint,
#mx-text-quality-top .hint,
#mx-text-quality-top .folder-sub {
  font-size: 11px;
  line-height: 1.2;
}

.mx-reg-flow {
  border: 1px dashed #365a96;
  border-radius: 10px;
  padding: 10px;
  background: rgba(37, 99, 235, 0.08);
}

.mx-reg-step {
  font-size: 13px;
  color: #dbeafe;
}
.mx-bulk-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 2px 2px;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.25);
}
.mx-bulk-item:last-child { border-bottom: none; }
.mx-bulk-item input[type="checkbox"] { margin: 0; }
.mx-doc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.mx-doc-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #93c5fd;
  border: 1px solid #334155;
  border-radius: 999px;
  padding: 2px 8px;
}
.mx-doc-link.missing {
  color: #94a3b8;
  border-style: dashed;
}
.mx-online-kpi-grid {
  grid-template-columns: minmax(520px, 720px);
}
.mx-online-kpi-grid .mx-kpi-card {
  min-height: 132px;
  align-content: start;
}
.mx-operational-summary-card {
  background: linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(15, 34, 58, .86));
}
.mx-operational-summary {
  margin-top: 8px;
  display: grid;
  gap: 4px;
  font-size: 14px;
  line-height: 1.35;
}
.mx-operational-summary b {
  color: #f8fbff;
  font-size: 16px;
}
.mx-summary-divider {
  height: 1px;
  margin: 4px 0;
  background: rgba(148, 163, 184, .25);
}
.mx-summary-updated {
  margin-top: 8px;
  font-size: 12px;
}
#mx-kpi-op-online-nums {
  max-width: 680px;
  white-space: normal;
  line-height: 1.45;
  word-break: break-word;
}
.mx-launch-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  align-items: stretch;
}
.mx-launch-grid .ghost {
  width: 168px;
  min-width: 168px;
  justify-content: center;
  text-align: center;
  padding: 7px 10px;
  min-height: 34px;
  line-height: 1.15;
  color: #f8fafc;
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.42), rgba(30, 64, 175, 0.62));
  border: 1px solid rgba(147, 197, 253, 0.9);
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.65), 0 8px 18px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.16);
  font-weight: 650;
}
.mx-launch-grid .ghost:hover {
  background: linear-gradient(180deg, rgba(59, 130, 246, 0.72), rgba(29, 78, 216, 0.86));
  border-color: #bfdbfe;
  box-shadow: 0 0 0 1px rgba(191, 219, 254, 0.35), 0 10px 24px rgba(37, 99, 235, 0.28);
}
.mx-dashboard-modal { z-index: 95; }
.mx-dashboard-modal .modal-content.large { max-width: min(1400px, 96vw); }
.mx-dashboard-modal .modal-header {
  position: sticky;
  top: 0;
  background: #101b33;
  padding: 6px 0;
  z-index: 7;
}
.mx-dashboard-modal table thead th {
  position: sticky;
  top: 44px;
  background: #101b33;
  z-index: 6;
}
.mx-dashboard-modal .report-details {
  max-height: 58vh;
  overflow: auto;
}

#mx-modal-points-base .modal-content {
  overflow-y: auto;
}

#mx-base-point-editor.mx-sticky-editor {
  position: sticky;
  top: 44px;
  z-index: 6;
  background: #101b33;
  border-bottom: 1px solid #2a3f68;
  padding-bottom: 10px;
  margin-bottom: 10px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.28);
}

#mx-customer-editor.mx-sticky-editor {
  position: sticky;
  top: 44px;
  z-index: 6;
  background: #101b33;
  border-bottom: 1px solid #2a3f68;
  padding-bottom: 10px;
  margin-bottom: 10px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.28);
}

@media (max-width: 900px) {
  .mx-report-view-layout { grid-template-columns: 1fr; }
  .report-summary-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .grid3 { grid-template-columns: 1fr; }
  .mx-kpi-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .mx-finance-grid { grid-template-columns: repeat(2, minmax(140px, 1fr)); }
  .mx-finance-grid-top .mx-finance-actions,
  .mx-finance-grid-bottom .mx-finance-actions,
  .mx-finance-grid-top > label:nth-child(1),
  .mx-finance-grid-top > label:nth-child(2),
  .mx-finance-grid-bottom > label:nth-child(1),
  .mx-finance-grid-bottom > label:nth-child(2),
  .mx-finance-grid-bottom > label:nth-child(3) { grid-column: span 2; }
  .mx-textq-grid { grid-template-columns: 1fr; }
}

body.dark { background: #1c2538; color: #eaf1ff; }
body.dark.evas-dashboard-bg,
body.dark.maxim-dashboard-bg { background: #071d1b; }
body.dark header { background: linear-gradient(135deg, #1f2b44 0%, #2a3653 60%, #3a4b72 100%); }
body.dark .card { background: #2a3653; color: #eaf1ff; box-shadow: 0 2px 12px rgba(0,0,0,.18); }
body.dark input, body.dark select { background: #e9eef8; color: #111827; border: 1px solid #a8b6d6; }
body.dark input[type="date"],
body.dark input[type="time"] { color-scheme: dark; }
body.dark input[type="date"]::-webkit-calendar-picker-indicator,
body.dark input[type="time"]::-webkit-calendar-picker-indicator { filter: invert(1) brightness(1.9); opacity: 1; }
body.dark input[type="date"]::-webkit-clear-button,
body.dark input[type="time"]::-webkit-clear-button { filter: invert(1) brightness(1.9); }
body.dark input[type="date"]::-webkit-inner-spin-button,
body.dark input[type="time"]::-webkit-inner-spin-button { filter: invert(1) brightness(1.9); }


body.dark select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 28px;
  background-image:
    linear-gradient(45deg, transparent 50%, #111827 50%),
    linear-gradient(135deg, #111827 50%, transparent 50%);
  background-position:
    calc(100% - 14px) calc(50% - 2px),
    calc(100% - 9px) calc(50% - 2px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

/* Keep native dropdown behavior for operator number selector */
body.dark #mx-operator-number {
  appearance: auto;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  padding-right: 10px;
  background-image: none;
}

body.dark details > summary {
  color: #eaf1ff;
}
body.dark details > summary::marker,
body.dark details > summary::-webkit-details-marker {
  color: #eaf1ff;
}
body.dark button { background: #e11d48; }
body.dark button:hover { background: #be123c; }
body.dark th, body.dark td { border-bottom: 1px solid #3f4f74; }
body.dark tr:hover { background: #33456a; }
body.dark pre { background: #081022; color: #93c5fd; }
body.dark .mx-ops-group { border-color: #4a5e8d; background: #314366; }

body.maxim-dashboard-bg header {
  background: rgba(20, 31, 52, 0.78);
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
  backdrop-filter: blur(3px);
}
body.maxim-dashboard-bg .card,
body.maxim-dashboard-bg .modal-content,
body.maxim-dashboard-bg .mx-kpi-card,
body.maxim-dashboard-bg .mx-ops-card,
body.maxim-dashboard-bg .mx-ops-group,
body.maxim-dashboard-bg .report-details,
body.maxim-dashboard-bg .folder-card,
body.maxim-dashboard-bg .text-quality-card,
body.maxim-dashboard-bg .mx-trainee-session-card {
  background: rgba(28, 40, 65, 0.58) !important;
  border-color: rgba(191, 219, 254, 0.18) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
}
body.maxim-dashboard-bg table,
body.maxim-dashboard-bg pre {
  background: rgba(8, 16, 34, 0.50) !important;
}
body.maxim-dashboard-bg th,
body.maxim-dashboard-bg td {
  background: transparent;
}
body.maxim-dashboard-bg button,
body.maxim-dashboard-bg .as-btn,
body.maxim-dashboard-bg input,
body.maxim-dashboard-bg select,
body.maxim-dashboard-bg textarea {
  opacity: 1;
}
.mx-bell-details {
  margin-left: 6px;
  color: #fcd34d;
  font-weight: 700;
}
.mx-launch-grid button.mx-has-notify {
  position: relative;
  border: 1px solid rgba(252, 211, 77, 0.62);
  box-shadow: 0 0 0 1px rgba(252, 211, 77, 0.12), 0 8px 18px rgba(0,0,0,.20);
}
.mx-launch-grid button.mx-has-notify::after {
  content: attr(data-notify);
  position: absolute;
  top: -8px;
  right: -8px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f59e0b;
  color: #111827;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.55);
}

.dropzone {
  border: 1px dashed #3b82f6;
  border-radius: 10px;
  padding: 14px;
  color: #93c5fd;
  background: rgba(30, 64, 175, 0.12);
  min-height: 56px;
  display: flex;
  align-items: center;
}

.shots-grid {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px;
}

.shot-item {
  background: #0b1830;
  border: 1px solid #233a66;
  border-radius: 8px;
  overflow: hidden;
}

.shot-item img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  display: block;
}

.shot-item .caption {
  font-size: 12px;
  padding: 6px 8px;
}

.modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
}

.modal.hidden { display: none; }

.modal-content {
  width: min(900px, 94vw);
  background: #101b33;
  border: 1px solid #2a3f68;
  border-radius: 12px;
  padding: 14px;
  max-height: 92vh;
  overflow-y: auto;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}

#op-entry-modal .modal-content,
.mx-auth-modal-content {
  width: min(450px, 94vw);
}
.mx-auth-title-wrap {
  justify-content: center;
  text-align: center;
}
.mx-auth-title-wrap h3 {
  width: 100%;
  margin: 0;
  text-align: center;
  letter-spacing: 0.08em;
}
.mx-auth-subtitle {
  margin-top: 14px;
  text-align: center;
}
.mx-auth-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.modal-content.large {
  width: min(980px, 96vw);
}

.preview-modal-content {
  width: min(1400px, 96vw);
}

.preview-wrap {
  border: 1px solid #2a3f68;
  border-radius: 10px;
  background: #0a1328;
  padding: 8px;
  max-height: 82vh;
  overflow: auto;
}

.preview-wrap img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.help-modal-content {
  width: min(1200px, 96vw);
  max-height: 92vh;
}

.help-frame {
  width: 100%;
  height: 78vh;
  border: 1px solid #2a3f68;
  border-radius: 8px;
  background: #ffffff;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.modal-header.sticky {
  position: sticky;
  top: 0;
  background: #101b33;
  padding: 6px 0;
  z-index: 5;
}

.modal-close {
  min-width: 42px;
  font-size: 20px;
  line-height: 1;
}

.date-time-row {
  margin-bottom: 8px;
}

.ghost {
  background: transparent !important;
  border: 1px solid #334155 !important;
  color: #e2e8f0 !important;
}

.grid2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 10px;
}

#m-vtype-wrap select,
#m-offender-wrap select {
  width: auto;
  min-width: 160px;
  max-width: 240px;
}

.compact-pair-row {
  grid-template-columns: max-content max-content;
  justify-content: start;
  align-items: end;
  gap: 10px;
}

.compact-pair-row label {
  width: auto;
}

/* Incident modal: keep blocks sized by content, not stretched */
#incident-modal .grid2 {
  grid-template-columns: repeat(2, max-content);
  justify-content: start;
}

#incident-modal .grid2 label,
#incident-modal .date-time-row label,
#incident-modal #m-vtype-wrap,
#incident-modal #m-offender-wrap {
  width: auto;
}

#incident-modal #m-vtype-wrap select,
#incident-modal #m-offender-wrap select,
#incident-modal .date-time-row input[type="date"],
#incident-modal .date-time-row input[type="time"] {
  width: max-content;
  min-width: 150px;
  max-width: 260px;
}

.description-tools-row,
.description-template-row,
.situation-template-row {
  align-items: center;
}

.custom-violation-label {
  display: inline-flex;
  flex-direction: column;
  width: auto;
}

.custom-violation-input,
.situation-template-select {
  width: 320px;
  min-width: 320px;
  max-width: 420px;
}

.description-template-select {
  flex: 1 1 520px;
  min-width: 420px;
  max-width: 100%;
}

@media (max-width: 720px) {
  .description-template-select {
    flex-basis: 100%;
    min-width: 100%;
  }
}

.face-header-row {
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}

.face-header-row h4 {
  margin: 0;
}

.customer-case-number-wrap {
  display: inline-flex;
  flex-direction: column;
  width: auto;
  min-width: 44px;
}

.customer-case-number-wrap input {
  width: 38px;
  max-width: 100%;
}

.option-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(100px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.tool-group {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.episode-input-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 10px;
}

.episode-input-grid .dropzone {
  min-height: 52px;
  margin-top: 0;
}

#m-episode-paste {
  min-height: 64px;
}

#m-overlay-drop {
  min-height: 50px;
}

.episode-tools-row,
.episode-primary-tools-row,
.episode-template-tools-row,
.episode-actions-row {
  align-items: center;
}

.episode-primary-tools-row {
  justify-content: flex-start;
  gap: 8px;
}

.episode-template-tools-row {
  gap: 8px;
  flex-wrap: wrap;
}

.episode-actions-row {
  justify-content: flex-start;
  gap: 10px;
}

.text-tool-controls,
.line-tool-controls {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.text-size-chip,
.line-width-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 32px;
  border: 1px solid #334c76;
  border-radius: 8px;
  background: #0b1830;
  color: #bfdbfe;
  font-weight: 700;
}

.text-bold-check {
  flex-direction: row;
  align-items: center;
  gap: 6px;
  margin-left: 2px;
}

.tool-btn {
  background: #0b1830 !important;
  border: 1px solid #334c76 !important;
  color: #cbd5e1 !important;
  min-width: 42px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}

.tool-btn.active {
  border-color: #22c55e !important;
  box-shadow: 0 0 0 1px #22c55e inset;
  color: #86efac !important;
}

.undo-overlay-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  min-width: 48px;
  height: 42px;
  padding: 0 !important;
  border-radius: 12px !important;
  background: #0b1830 !important;
  border-color: #3b557f !important;
  color: #dbeafe !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 6px 16px rgba(2,6,23,0.18);
}

.undo-overlay-btn svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.undo-overlay-btn:hover {
  background: #10264a !important;
  border-color: #60a5fa !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(96,165,250,0.38) inset, 0 8px 18px rgba(15,23,42,0.24);
}

.canvas-wrap {
  margin-top: 10px;
  border: 1px solid #2a3f68;
  border-radius: 10px;
  padding: 8px;
  background: #0a1328;
  overflow: auto;
}

.canvas-wrap canvas {
  display: block;
  max-width: 100%;
  height: auto;
  cursor: crosshair;
}

.episode-list {
  margin-top: 10px;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.episode-list::-webkit-scrollbar {
  height: 8px;
}

.episode-list::-webkit-scrollbar-thumb {
  background: #314266;
  border-radius: 999px;
}

.episode-item {
  flex: 0 0 150px;
  background: #0b1830;
  border: 1px solid #2a3f68;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
}

.episode-item img {
  width: 100%;
  height: 84px;
  object-fit: cover;
  display: block;
}

.episode-caption {
  font-size: 12px;
  color: #bfdbfe;
  text-align: center;
  padding: 5px 6px;
}

.episode-item:hover {
  border-color: #60a5fa;
}

.episode-item:active {
  transform: translateY(1px);
}

.dropzone.dragover {
  border-color: #22c55e;
  background: rgba(34, 197, 94, 0.12);
}

.tmc-quick-wrap {
  margin-bottom: 8px;
}

.tmc-quick {
  background: #7f1d1d !important;
  border: 1px solid #fca5a5 !important;
  color: #fecaca !important;
  font-weight: 700;
}

.tmc-quick:hover {
  background: #991b1b !important;
}

.face-grid {
  display: grid;
  grid-template-columns: repeat(4, 64px);
  gap: 8px;
  justify-content: start;
}

.face-slot {
  border: 1px solid #2a3f68;
  border-radius: 10px;
  padding: 6px;
  background: #0d1a33;
}

.face-slot.active {
  border-color: #f59e0b;
  box-shadow: 0 0 0 1px #f59e0b inset;
}

.face-drop {
  width: 52px;
  min-height: 60px;
  border: 1px dashed #334c76;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(30, 64, 175, 0.08);
}

.face-drop.dragover {
  border-color: #22c55e;
  background: rgba(34, 197, 94, 0.12);
}

.face-preview {
  width: 100%;
  height: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #93c5fd;
  font-size: 13px;
  text-align: center;
  padding: 4px;
}

.face-preview img {
  width: 100%;
  height: 100%;
  min-height: 52px;
  object-fit: cover;
  border-radius: 4px;
}

.face-file-name {
  display: none;
}

#m-vtype-wrap select {
  border-color: #7c2d12;
  box-shadow: 0 0 0 1px rgba(251, 146, 60, 0.28) inset;
}

.priority-case td {
  border-left: 4px solid #f59e0b;
  background: rgba(245, 158, 11, 0.08);
}

.case-thumb {
  width: 76px;
  height: 46px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid #2a3f68;
  display: block;
}

.case-thumb-empty {
  width: 76px;
  height: 46px;
  border-radius: 6px;
  border: 1px dashed #334155;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}

.folder-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.folder-item {
  display: grid;
  grid-template-columns: 130px 1fr auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #2a3f68;
  border-radius: 8px;
  padding: 8px;
  background: #0b1830;
}

.folder-thumb {
  width: 130px;
  height: 78px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid #2a3f68;
}

.folder-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.folder-thumb-empty {
  width: 100%;
  height: 100%;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}

.folder-title {
  font-weight: 600;
}

.folder-sub {
  color: #94a3b8;
  font-size: 12px;
  margin-top: 2px;
}

.folder-main {
  min-width: 0;
}

.folder-shots-title {
  margin-top: 6px;
  font-size: 11px;
  color: #93c5fd;
}

.folder-shot-strip {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 4px;
}

.folder-shot-btn {
  width: 56px;
  height: 36px;
  border: 1px solid #2a3f68;
  border-radius: 6px;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  background: #0b1830;
}

.folder-shot-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.folder-shot-empty {
  margin-top: 6px;
  color: #94a3b8;
  font-size: 11px;
}

.folder-actions {
  display: flex;
  gap: 6px;
}

.folder-case-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.folder-case-actions .ghost {
  white-space: nowrap;
}

.folder-file {
  font-size: 12px;
  color: #93c5fd;
  margin-bottom: 2px;
}

.folder-item.finalized {
  border-color: #16a34a;
  background: rgba(22, 163, 74, 0.08);
}

.operator-row {
  grid-template-columns: 1fr auto;
  padding: 6px 8px;
}

.point-row {
  grid-template-columns: 1fr auto;
  align-items: start;
}

.point-row .folder-actions {
  justify-self: end;
  align-self: start;
}

#mx-base-points-list .folder-item {
  grid-template-columns: 1fr auto;
  align-items: start;
}

#mx-base-points-list .folder-actions {
  justify-self: end;
  align-self: start;
}

.operator-row .folder-title {
  font-size: 14px;
  line-height: 1.2;
}

.operator-row .folder-actions .ghost {
  padding: 6px 8px;
}

.folder-ready-banner {
  border: 1px solid #16a34a;
  border-radius: 8px;
  padding: 8px 10px;
  color: #bbf7d0;
  background: rgba(22, 163, 74, 0.08);
  font-size: 13px;
}

.folder-guidance-banner {
  border: 1px solid #2563eb;
  border-radius: 8px;
  padding: 8px 10px;
  color: #bfdbfe;
  background: rgba(37, 99, 235, 0.14);
  font-size: 13px;
  margin-top: 8px;
}

/* Trainee block readability */
#trainee-card .folder-guidance-banner {
  margin-bottom: 12px;
}

#trainee-card .grid2,
#trainee-card .mt {
  margin-top: 12px;
}

#trainee-card .row {
  margin-top: 14px;
  gap: 10px;
  flex-wrap: wrap;
}

#trainee-card button.ghost,
#trainee-card .as-btn.ghost {
  background: rgba(59, 130, 246, 0.18) !important;
  border: 1px solid rgba(96, 165, 250, 0.9) !important;
  color: #eaf2ff !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
  padding: 8px 12px;
  font-weight: 600;
}

#trainee-card button.ghost:hover,
#trainee-card .as-btn.ghost:hover {
  background: rgba(59, 130, 246, 0.28) !important;
  border-color: rgba(147, 197, 253, 1) !important;
}

.folder-qc-progress {
  border: 1px solid #155e75;
  border-radius: 8px;
  padding: 8px 10px;
  color: #cffafe;
  background: rgba(8, 145, 178, 0.14);
  font-size: 13px;
  margin-top: 8px;
  display: grid;
  gap: 8px;
}

.qc-progress-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.qc-progress-row {
  display: grid;
  gap: 6px;
}

.qc-progress-label {
  font-size: 12px;
  color: #dbeafe;
}

.qc-progress-track {
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: rgba(30, 64, 175, 0.25);
  overflow: hidden;
}

.qc-progress-track > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #38bdf8 0%, #22c55e 100%);
}

.folder-fail-banner {
  border: 1px solid #dc2626;
  border-radius: 8px;
  padding: 8px 10px;
  color: #fecaca;
  background: rgba(220, 38, 38, 0.12);
  font-size: 13px;
  margin-top: 8px;
}

.folder-empty {
  border: 1px dashed #334155;
  border-radius: 8px;
  padding: 10px;
  color: #94a3b8;
  font-size: 13px;
}

.existing-image-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 8px;
}

.existing-image-item {
  border: 1px solid #334155;
  border-radius: 8px;
  overflow: hidden;
  background: #0b1830;
}

.existing-image-item.marked-delete {
  opacity: 0.45;
  border-color: #ef4444;
}

.existing-image-item img {
  width: 100%;
  height: 100px;
  object-fit: cover;
  display: block;
  cursor: pointer;
}

.existing-image-item .row {
  justify-content: space-between;
  padding: 6px;
  margin-top: 0;
}

.toast-container {
  position: fixed;
  right: 14px;
  bottom: 14px;
  display: grid;
  gap: 8px;
  z-index: 2000;
}

.toast {
  min-width: 260px;
  max-width: 420px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #334155;
  background: #0b1830;
  color: #e5e7eb;
  opacity: 0;
  transform: translateY(6px);
  transition: all .18s ease;
}

.toast.show {
  opacity: 1;
  transform: translateY(0);
}

.toast.error { border-color: #ef4444; }
.toast.success { border-color: #22c55e; }
.toast.info { border-color: #60a5fa; }

.opt-btn {
  background: #0b1830 !important;
  border: 1px solid #334c76 !important;
  color: #cbd5e1 !important;
}

.opt-btn.active {
  border-color: #f59e0b !important;
  box-shadow: 0 0 0 1px #f59e0b inset;
  color: #fbbf24 !important;
}

.primary {
  background: #ef4444 !important;
}

textarea {
  resize: vertical;
  min-height: 72px;
  font-size: 14px;
  padding: 8px;
  border-radius: 8px;
  border: 1px solid #233a66;
  background: #0b1830;
  color: #e5e7eb;
}

body.op-compact .card:first-of-type { padding: 10px; }
body.op-compact .card:first-of-type .mt { margin-top: 6px; }
body.op-compact .card:first-of-type label { font-size: 12px; gap: 3px; }
body.op-compact .card:first-of-type input,
body.op-compact .card:first-of-type select,
body.op-compact .card:first-of-type button,
body.op-compact .card:first-of-type textarea { padding: 6px; font-size: 13px; }

.trainee-auth {
  border-top: 1px dashed #334155;
  padding-top: 10px;
}
.trainee-auth h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

@media (max-width: 900px) {
  .grid2 { grid-template-columns: 1fr; }
  .grid3.report-compact { grid-template-columns: 1fr; }
  .mx-finance-grid { grid-template-columns: 1fr; }
  .mx-finance-grid-top .mx-finance-actions,
  .mx-finance-grid-bottom .mx-finance-actions,
  .mx-finance-grid-top > label:nth-child(1),
  .mx-finance-grid-top > label:nth-child(2),
  .mx-finance-grid-bottom > label:nth-child(1),
  .mx-finance-grid-bottom > label:nth-child(2),
  .mx-finance-grid-bottom > label:nth-child(3) { grid-column: span 1; }
  .option-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .face-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .episode-input-grid { grid-template-columns: 1fr; }
  .folder-item { grid-template-columns: 1fr; }
  .folder-thumb { width: 100%; height: 140px; }
}


/* Trainee video archive / Smart PSS-like training workspace */
.training-workbench { border-top: 1px solid #233a66; padding-top: 14px; }
.training-video-stage { display: grid; gap: 10px; }
.training-video-frame { background: #020617; border: 1px solid #233a66; border-radius: 14px; padding: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.training-video-frame video { width: 100%; height: min(68vh, 760px); min-height: 520px; display: block; object-fit: contain; background: #000; border-radius: 10px; }
.smartpss-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px; border: 1px solid #233a66; border-radius: 12px; background: #081326; }
.smartpss-controls button.active { border-color: #ef4444; box-shadow: 0 0 0 1px #ef4444 inset; }
.training-operator-workspace { border: 1px solid #233a66; border-radius: 14px; padding: 12px; background: #081326; }
.training-case-card { align-items: stretch; }
.training-case-card .folder-shot-strip img { width: 180px; height: 105px; object-fit: cover; border-radius: 10px; border: 1px solid #334155; }
@media (max-width: 900px) { .training-video-frame video { min-height: 280px; height: 52vh; } }


/* Training admin review layout */
.training-admin-layout { display: grid; grid-template-columns: minmax(420px, .9fr) minmax(520px, 1.1fr); gap: 14px; align-items: start; }
.training-admin-media, .training-admin-review { min-width: 0; }
.training-trainee-row, .training-session-row { width: 100%; text-align: left; }
.training-examples-panel { border: 1px solid #233a66; border-radius: 14px; padding: 12px; background: #081326; }
.training-example-card .folder-shot-strip img { width: 220px; height: 130px; object-fit: cover; border-radius: 10px; border: 1px solid #334155; }
@media (max-width: 1200px) { .training-admin-layout { grid-template-columns: 1fr; } }


/* Trainee capture feedback */
.training-capture-feedback {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 10px 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid #22c55e;
  border-radius: 12px;
  background: rgba(34, 197, 94, .09);
}
.training-capture-feedback.hidden { display: none; }
.training-capture-ok { grid-column: 1 / -1; color: #86efac; font-weight: 700; }
.training-capture-feedback img {
  width: 180px;
  height: 105px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #22c55e;
  background: #020617;
}
@media (max-width: 700px) { .training-capture-feedback { grid-template-columns: 1fr; } .training-capture-feedback img { width: 100%; height: auto; } }

.success-flash { border-color: #22c55e !important; box-shadow: 0 0 0 1px #22c55e inset, 0 0 18px rgba(34,197,94,.35); }


.mx-upload-progress { height: 10px; border-radius: 999px; background: #0b1830; border: 1px solid #334155; overflow: hidden; margin-top: 8px; }
.mx-upload-progress.hidden { display: none; }
.mx-upload-progress span { display: block; height: 100%; width: 0%; background: linear-gradient(90deg, #ef4444, #f97316); transition: width .15s ease; }


.episode-item { position: relative; }
.episode-delete {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 2;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 1px solid rgba(248, 113, 113, .95);
  background: rgba(127, 29, 29, .92);
  color: #fee2e2;
  font-weight: 800;
  line-height: 18px;
  padding: 0;
  cursor: pointer;
}
.episode-delete:hover { background: #dc2626; color: #fff; }


.training-review-score-card {
  border: 1px solid #334155;
  border-radius: 12px;
  padding: 12px;
  background: rgba(15, 23, 42, .45);
}
.training-review-number {
  font-size: 34px;
  line-height: 1.1;
  font-weight: 800;
  color: #fff;
  margin-top: 6px;
}
.training-review-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}
.training-quality-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid #334155;
  border-radius: 999px;
  background: #0b1830;
}
.training-quality-toggle input { width: auto; }
.training-card-preview {
  border: 1px solid #334155;
  border-radius: 12px;
  padding: 12px;
  background: #0b1830;
}
.training-card-preview img {
  max-width: 220px;
  max-height: 150px;
  object-fit: contain;
  border-radius: 8px;
  border: 1px solid #334155;
  margin: 6px;
}


.training-review-card.compact .hint,
.training-review-card.compact .folder-shot-strip { display: none; }
.training-review-card.compact .folder-title { font-size: 15px; }
.training-card-modal-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.training-card-modal-images img {
  width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 10px;
  border: 1px solid #334155;
  background: #020617;
}


.training-top-actions {
  position: sticky;
  top: 0;
  z-index: 4;
  padding: 10px;
  border: 1px solid #2a3f68;
  border-radius: 12px;
  background: rgba(11, 24, 48, .94);
}
.training-submit-row {
  justify-content: flex-end;
  padding-top: 12px;
  border-top: 1px solid #2a3f68;
}


.training-case-card.finalized { align-items: center; }
.training-case-card.finalized .folder-shot-strip img,
.training-case-card.finalized .folder-shot-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  border-radius: 0;
}
.training-case-card.finalized .folder-main .hint { display: none; }


.training-review-card.ready-card { align-items: center; }
.training-review-card.ready-card .folder-thumb {
  width: 170px;
  height: 112px;
  background: #020617;
}
.training-review-card.ready-card .folder-thumb img[src=""],
.training-review-card.ready-card .folder-thumb img:not([src]) {
  visibility: hidden;
}
.training-ready-card-modal img {
  width: 100%;
  max-height: 78vh;
  object-fit: contain;
  border-radius: 12px;
  border: 1px solid #334155;
  background: #020617;
  margin-top: 10px;
}


.training-case-card.ready-card { align-items: center; }
.training-case-card.ready-card .folder-thumb {
  width: 170px;
  height: 112px;
  background: #020617;
}
.training-case-card.ready-card .folder-thumb img[src=""],
.training-case-card.ready-card .folder-thumb img:not([src]) { visibility: hidden; }


/* Compact Maxim trainee ready cards */
.training-review-card.compact-maxim {
  grid-template-columns: 112px minmax(0, 1fr) auto;
  gap: 10px;
  padding: 8px 10px;
  align-items: center;
}
.training-review-card.compact-maxim .folder-thumb {
  width: 104px;
  height: 68px;
  border-radius: 8px;
}
.training-review-card.compact-maxim .folder-file {
  font-size: 11px;
  color: #93c5fd;
  margin-bottom: 2px;
}
.training-review-card.compact-maxim .folder-title {
  font-size: 14px;
  line-height: 1.2;
}
.training-review-card.compact-maxim .folder-sub {
  font-size: 11px;
}
.training-review-card.compact-maxim .training-review-card-actions {
  margin-top: 0;
  justify-content: flex-end;
  gap: 6px;
}
.training-review-card.compact-maxim .training-review-card-actions button {
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.1;
}
.training-bad-note {
  grid-column: 2 / 4;
  margin-top: 2px;
}
.training-bad-note summary {
  cursor: pointer;
  color: #bfdbfe;
  font-size: 12px;
}
.training-bad-note textarea {
  margin-top: 6px;
  min-height: 54px;
}
#mx-preview-modal .preview-modal-content {
  width: min(1600px, 98vw);
  max-height: 96vh;
}
#mx-preview-modal .preview-wrap {
  max-height: 88vh;
}
#mx-preview-modal .preview-wrap img {
  max-width: 100%;
  max-height: 86vh;
  object-fit: contain;
}
@media (max-width: 900px) {
  .training-review-card.compact-maxim { grid-template-columns: 92px minmax(0, 1fr); }
  .training-review-card.compact-maxim .folder-thumb { width: 86px; height: 56px; }
  .training-review-card.compact-maxim .folder-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .training-bad-note { grid-column: 1 / -1; }
}


/* Maxim trainee cards: compact horizontal ready-card rows */
.training-review-card-row {
  display: grid;
  grid-template-columns: 205px minmax(130px, 1fr) auto;
  grid-template-areas:
    "thumb info actions"
    "thumb note note";
  gap: 8px 14px;
  align-items: center;
  padding: 8px 10px;
  margin: 8px 0;
  border: 1px solid #22c55e;
  border-radius: 10px;
  background: rgba(30, 64, 88, .72);
}
.training-review-thumb { grid-area: thumb; width: 205px; height: 132px; border-radius: 8px; overflow: hidden; background: #020617; border: 1px solid #334155; }
.training-review-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.training-review-thumb img[src=""], .training-review-thumb img:not([src]) { visibility: hidden; }
.training-review-info { grid-area: info; min-width: 0; align-self: center; }
.training-review-file { color: #dbeafe; font-size: 12px; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.training-review-title { color: #fff; font-size: 17px; font-weight: 800; line-height: 1.12; max-width: 260px; }
.training-review-meta { color: #cbd5e1; font-size: 13px; margin-top: 6px; }
.training-review-actions { grid-area: actions; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; max-width: 430px; }
.training-review-actions button { padding: 8px 12px; font-size: 14px; line-height: 1.1; white-space: nowrap; }
.training-review-card-row .training-bad-note { grid-area: note; margin: 0; }
.training-review-card-row .training-bad-note summary { cursor: pointer; color: #bfdbfe; font-size: 12px; }
.training-review-card-row .training-bad-note textarea { margin-top: 6px; min-height: 50px; }
@media (max-width: 980px) {
  .training-review-card-row {
    grid-template-columns: 160px minmax(0, 1fr);
    grid-template-areas: "thumb info" "actions actions" "note note";
  }
  .training-review-thumb { width: 160px; height: 103px; }
  .training-review-actions { justify-content: flex-start; max-width: none; }
}


/* Trainee saved ready cards: prevent text overlaying the composed thumbnail */
.training-case-card.ready-card {
  grid-template-columns: 182px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}
.training-case-card.ready-card .folder-thumb {
  width: 170px;
  height: 112px;
  flex: 0 0 auto;
}
.training-case-card.ready-card .folder-main {
  min-width: 0;
  padding-left: 0;
}
.training-case-card.ready-card .folder-file,
.training-case-card.ready-card .folder-title,
.training-case-card.ready-card .folder-sub {
  overflow: hidden;
  text-overflow: ellipsis;
}
.training-case-card.ready-card .folder-file,
.training-case-card.ready-card .folder-sub {
  white-space: nowrap;
}
.training-case-card.ready-card .folder-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.18;
}
@media (max-width: 720px) {
  .training-case-card.ready-card {
    grid-template-columns: 120px minmax(0, 1fr);
  }
  .training-case-card.ready-card .folder-thumb {
    width: 112px;
    height: 74px;
  }
  .training-case-card.ready-card .folder-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
}

.status-badge { display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; font-weight:800; border:1px solid rgba(148,163,184,.35); }
.status-high { color:#fecaca; background:rgba(127,29,29,.55); border-color:#ef4444; }
.status-medium { color:#fde68a; background:rgba(113,63,18,.48); border-color:#f59e0b; }
.status-low { color:#bfdbfe; background:rgba(30,64,175,.38); border-color:#60a5fa; }

/* Compact point language + logo controls */
.mx-point-lang-compact select {
  max-width: 96px;
}
.mx-point-logo-inline {
  align-self: end;
  min-height: 44px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
}
.mx-point-logo-inline input[type="checkbox"] {
  width: auto;
}


.operator-drafts-panel .folder-list {
  gap: 6px;
  margin-top: 6px;
}

.operator-drafts-panel .draft-row {
  grid-template-columns: minmax(260px, 1fr) auto;
  min-height: 38px;
  padding: 5px 8px;
  gap: 12px;
}

.operator-drafts-panel .draft-row-title {
  min-width: 0;
  font-size: 14px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.operator-drafts-panel .draft-row-actions {
  justify-self: end;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
}

.operator-drafts-panel .draft-row-actions .ghost {
  padding: 5px 8px;
  line-height: 1.1;
  white-space: nowrap;
}

.operator-completed-panel .folder-list {
  gap: 6px;
  margin-top: 6px;
}

.operator-completed-panel .draft-row {
  grid-template-columns: minmax(220px, 1fr) auto auto;
  min-height: 38px;
  padding: 5px 8px;
  gap: 10px;
}

.operator-completed-panel .draft-row-title {
  min-width: 0;
  font-size: 14px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.operator-completed-panel .draft-row-actions {
  justify-self: end;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
}

.operator-completed-panel .draft-row-actions .ghost {
  padding: 5px 8px;
  line-height: 1.1;
  white-space: nowrap;
}


.operator-report-status {
  justify-self: end;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(148, 163, 184, 0.18);
  color: #e5e7eb;
  box-shadow: 0 0 14px rgba(148, 163, 184, 0.12);
}
.operator-report-status.status-in_review_maxim {
  background: rgba(59, 130, 246, 0.22);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow: 0 0 14px rgba(59, 130, 246, 0.18);
}
.operator-report-status.status-approved,
.operator-report-status.status-in_weekly_package,
.operator-report-status.status-sent {
  background: rgba(34, 197, 94, 0.25);
  color: #86efac;
  border-color: rgba(74, 222, 128, 0.26);
  box-shadow: 0 0 14px rgba(34, 197, 94, 0.18);
}
.operator-report-status.status-returned {
  background: rgba(239, 68, 68, 0.24);
  color: #fecaca;
  border-color: rgba(248, 113, 113, 0.32);
  box-shadow: 0 0 14px rgba(239, 68, 68, 0.2);
}
.operator-completed-panel .draft-row.returned-row {
  border-color: rgba(248, 113, 113, 0.24);
}
.completed-return-reason {
  display: inline-block;
  margin-left: 8px;
  color: #fecaca;
  font-weight: 700;
  font-size: 12px;
}
@media (max-width: 760px) {
  .operator-completed-panel .draft-row { grid-template-columns: minmax(0, 1fr) auto; }
  .operator-completed-panel .draft-row-actions { grid-column: 1 / -1; justify-self: start; }
}


/* Maxim / База операторов / компактное качество текста */
#mx-text-quality-summary { margin-top: 6px; }
.mx-textq-summary-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid rgba(42, 63, 104, 0.9);
  border-radius: 10px;
  background: rgba(11, 24, 48, 0.72);
}
.mx-textq-title { font-weight: 800; color: #e5e7eb; margin-right: 4px; }
.mx-textq-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  color: #dbeafe;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.mx-textq-chip.danger { background: rgba(239, 68, 68, 0.18); color: #fecaca; }
.mx-textq-chip.warn { background: rgba(245, 158, 11, 0.18); color: #fde68a; }
.mx-textq-chip.ok { background: rgba(34, 197, 94, 0.18); color: #bbf7d0; }
.mx-textq-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.9fr) minmax(420px, 1.25fr);
  gap: 8px;
  align-items: start;
}
#mx-text-quality-charts,
#mx-text-quality-top {
  padding-left: 0;
  margin-top: 0;
}
.mx-textq-panel {
  border: 1px solid #2a3f68;
  border-radius: 10px;
  background: rgba(11, 24, 48, 0.78);
  padding: 8px;
}
.mx-textq-panel.compact { padding: 8px; }
.mx-textq-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.mx-textq-panel-head b { color: #f8fafc; font-size: 13px; }
.mx-textq-panel-head span { color: #94a3b8; font-size: 11px; }
.mx-textq-bars { display: grid; gap: 6px; }
.mx-textq-bar-row {
  display: grid;
  grid-template-columns: 18px minmax(105px, 1fr) minmax(80px, 0.8fr) auto;
  gap: 6px;
  align-items: center;
  min-height: 24px;
}
.mx-textq-rank {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(37, 99, 235, 0.22);
  color: #bfdbfe;
  font-size: 11px;
  font-weight: 800;
}
.mx-textq-bar-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #e5e7eb;
  font-size: 12px;
  font-weight: 700;
}
.mx-textq-bar-track {
  height: 7px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
}
.mx-textq-bar-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2563eb, #dc2626);
}
.mx-textq-bar-meta {
  color: #cbd5e1;
  font-size: 11px;
  white-space: nowrap;
}
.mx-textq-operator-list { display: grid; gap: 5px; }
.mx-textq-op-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto auto minmax(150px, 0.9fr);
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 5px 7px;
  border: 1px solid rgba(42, 63, 104, 0.8);
  border-radius: 8px;
  background: rgba(2, 6, 23, 0.2);
}
.mx-textq-op-main {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.mx-textq-op-main b {
  color: #f8fafc;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx-textq-op-main span { color: #94a3b8; font-size: 11px; white-space: nowrap; }
.mx-textq-risk {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.mx-textq-risk.danger { color: #fecaca; background: rgba(239, 68, 68, 0.18); }
.mx-textq-risk.warn { color: #fde68a; background: rgba(245, 158, 11, 0.18); }
.mx-textq-risk.ok { color: #bbf7d0; background: rgba(34, 197, 94, 0.18); }
.mx-textq-op-metrics {
  display: inline-flex;
  gap: 6px;
  color: #cbd5e1;
  font-size: 11px;
  white-space: nowrap;
}
.mx-textq-op-rec {
  min-width: 0;
  color: #dbeafe;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx-textq-empty {
  color: #94a3b8;
  font-size: 12px;
  padding: 8px;
  border: 1px dashed #2a3f68;
  border-radius: 8px;
}
@media (max-width: 900px) {
  .mx-textq-grid { grid-template-columns: 1fr; }
  .mx-textq-op-row { grid-template-columns: minmax(0, 1fr) auto; }
  .mx-textq-op-metrics, .mx-textq-op-rec { grid-column: 1 / -1; }
  .mx-textq-bar-row { grid-template-columns: 18px minmax(0, 1fr) auto; }
  .mx-textq-bar-track { grid-column: 2 / -1; }
}


/* Operator top action buttons: main actions left, service/help actions right. */
.operator-action-row {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.operator-action-main,
.operator-action-secondary {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.operator-action-main {
  justify-content: flex-start;
}
.operator-action-secondary {
  justify-content: flex-end;
  margin-left: auto;
}
.operator-action-row #op-new-report,
.operator-action-row #op-open-incident {
  min-height: 43px;
  padding: 10px 18px !important;
  border-radius: 13px !important;
  font-size: 15px;
  font-weight: 850;
  letter-spacing: .01em;
  line-height: 1.15;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 8px 20px rgba(0, 0, 0, .30),
    0 0 14px rgba(239, 68, 68, .12);
}
.operator-action-row #op-new-report:hover,
.operator-action-row #op-open-incident:hover {
  transform: translateY(-1px);
  background: #dc2626 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 12px 26px rgba(0, 0, 0, .38),
    0 0 18px rgba(239, 68, 68, .24);
}
.operator-action-row #op-new-report:active,
.operator-action-row #op-open-incident:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 8px rgba(0,0,0,.28), 0 4px 12px rgba(0,0,0,.24);
}
.operator-action-row #op-open-connection,
.operator-action-row #op-open-help,
.operator-action-row #op-open-rules,
.operator-action-row #op-open-eva-chat {
  position: relative;
  overflow: hidden;
  min-height: 43px;
  padding: 10px 18px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(125, 211, 252, 0.7) !important;
  background:
    linear-gradient(180deg, rgba(15, 46, 76, 0.92) 0%, rgba(10, 30, 54, 0.92) 100%) !important;
  color: #f8fbff !important;
  font-size: 15px;
  font-weight: 850;
  letter-spacing: .01em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .55);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 8px 20px rgba(0, 0, 0, .32),
    0 0 0 1px rgba(14, 165, 233, .08);
}
.operator-action-row #op-open-connection::before,
.operator-action-row #op-open-help::before,
.operator-action-row #op-open-rules::before,
.operator-action-row #op-open-eva-chat::before {
  content: '';
  position: absolute;
  inset: 1px 1px auto 1px;
  height: 45%;
  border-radius: 12px 12px 8px 8px;
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0));
  pointer-events: none;
}
.operator-action-row #op-open-connection:hover,
.operator-action-row #op-open-help:hover,
.operator-action-row #op-open-rules:hover,
.operator-action-row #op-open-eva-chat:hover {
  transform: translateY(-1px);
  border-color: rgba(186, 230, 253, .95) !important;
  background:
    linear-gradient(180deg, rgba(20, 70, 110, 0.96) 0%, rgba(13, 45, 78, 0.96) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 26px rgba(0, 0, 0, .38),
    0 0 18px rgba(56, 189, 248, .20);
}
.operator-action-row #op-open-connection:active,
.operator-action-row #op-open-help:active,
.operator-action-row #op-open-rules:active,
.operator-action-row #op-open-eva-chat:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 8px rgba(0,0,0,.28), 0 4px 12px rgba(0,0,0,.24);
}
.operator-action-row #op-open-eva-chat {
  border-color: rgba(196, 181, 253, 0.82) !important;
  background:
    linear-gradient(180deg, rgba(55, 48, 163, 0.92) 0%, rgba(30, 41, 82, 0.94) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 8px 20px rgba(0,0,0,.32),
    0 0 18px rgba(139, 92, 246, .22);
}

.eva-chat-window {
  position: fixed;
  right: 22px;
  top: 96px;
  width: min(430px, calc(100vw - 28px));
  max-height: min(720px, calc(100vh - 36px));
  z-index: 120;
  border: 1px solid rgba(196, 181, 253, .62);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(9, 14, 28, .98));
  color: #e5e7eb;
  box-shadow: 0 22px 60px rgba(0,0,0,.48), 0 0 28px rgba(139,92,246,.20);
  overflow: hidden;
}
.eva-chat-window.hidden { display: none; }
.eva-chat-window.pinned {
  z-index: 7200 !important;
  border-color: rgba(251, 191, 36, .92);
  box-shadow: 0 22px 60px rgba(0,0,0,.48), 0 0 0 2px rgba(251,191,36,.25), 0 0 30px rgba(251,191,36,.18);
}
.eva-chat-window.pinned .eva-chat-header::after {
  content: 'Закреплено';
  position: absolute;
  right: 14px;
  bottom: 4px;
  font-size: 10px;
  color: #fde68a;
  letter-spacing: .02em;
}
.eva-chat-controls button.active {
  border-color: rgba(251,191,36,.92) !important;
  background: rgba(120, 53, 15, .52) !important;
  color: #fef3c7 !important;
}
.eva-chat-header {
  position: relative;
  cursor: move;
  user-select: none;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 14px;
  background: linear-gradient(135deg, rgba(67, 56, 202, .95), rgba(30, 41, 59, .98));
  border-bottom: 1px solid rgba(148, 163, 184, .22);
}
.eva-chat-title { font-weight: 900; color: #fff; letter-spacing: .01em; }
.eva-chat-subtitle { margin-top: 3px; font-size: 12px; color: #ddd6fe; line-height: 1.25; }
.eva-chat-controls { display: inline-flex; gap: 5px; align-items: center; }
.eva-chat-controls button { min-width: 34px; padding: 6px 8px !important; border-radius: 10px !important; }
.eva-chat-body { padding: 12px; display: grid; gap: 10px; }
.eva-chat-window.minimized .eva-chat-body { display: none; }
.eva-chat-quick { display: flex; flex-wrap: wrap; gap: 7px; }
.eva-chat-quick button { font-size: 12px; padding: 7px 9px !important; border-radius: 999px !important; }
.eva-chat-quick button.active { border-color: rgba(196,181,253,.92) !important; background: rgba(109,40,217,.36) !important; color: #f5f3ff !important; }
.eva-chat-log {
  min-height: 170px;
  max-height: 350px;
  overflow: auto;
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(51, 65, 85, .85);
  border-radius: 13px;
  background: rgba(2, 6, 23, .35);
}
.eva-chat-msg { display: flex; }
.eva-chat-bubble {
  max-width: 88%;
  padding: 8px 10px;
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.35;
  white-space: pre-wrap;
}
.eva-chat-msg.user { justify-content: flex-end; }
.eva-chat-msg.user .eva-chat-bubble { background: rgba(37, 99, 235, .30); border: 1px solid rgba(96, 165, 250, .42); color: #eff6ff; }
.eva-chat-msg.eva .eva-chat-bubble { background: rgba(88, 28, 135, .30); border: 1px solid rgba(196, 181, 253, .36); color: #f5f3ff; }
.eva-chat-msg.system .eva-chat-bubble { background: rgba(15, 23, 42, .74); border: 1px dashed rgba(148,163,184,.42); color: #cbd5e1; }
.eva-chat-status { min-height: 18px; }
.eva-chat-input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; }
.eva-chat-input-row textarea { resize: vertical; min-height: 48px; max-height: 130px; }
.eva-chat-input-row button { min-height: 48px; }
@media (max-width: 760px) {
  .eva-chat-window { left: 10px !important; right: 10px; top: 72px !important; width: auto; }
  .eva-chat-input-row { grid-template-columns: 1fr; }
}

.mx-eva-messages-list {
  display: grid;
  gap: 12px;
  max-height: min(68vh, 760px);
  overflow: auto;
  padding-right: 4px;
}
.mx-eva-message-card {
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 14px;
  background: rgba(15, 23, 42, .64);
  padding: 12px;
}
.mx-eva-message-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}
.mx-eva-message-badges { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.mx-eva-message-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mx-eva-message-text {
  margin-top: 4px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(2, 6, 23, .36);
  border: 1px solid rgba(59, 130, 246, .22);
  white-space: pre-wrap;
  line-height: 1.35;
}
.mx-eva-message-text.eva { border-color: rgba(196, 181, 253, .32); background: rgba(88, 28, 135, .18); }
.badge.muted { opacity: .78; }
@media (max-width: 900px) {
  .mx-eva-message-head, .mx-eva-message-grid { grid-template-columns: 1fr; display: grid; }
  .mx-eva-message-badges { justify-content: flex-start; }
}
.operator-action-row #op-logout-work {
  min-height: 43px;
  padding: 10px 18px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(248, 113, 113, 0.72) !important;
  background: linear-gradient(180deg, rgba(127, 29, 29, .86), rgba(69, 10, 10, .86)) !important;
  color: #fff5f5 !important;
  font-size: 15px;
  font-weight: 850;
  text-shadow: 0 1px 2px rgba(0,0,0,.55);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 20px rgba(0,0,0,.32),
    0 0 14px rgba(239, 68, 68, .14);
}
.operator-action-row #op-logout-work:hover {
  transform: translateY(-1px);
  border-color: rgba(252, 165, 165, .95) !important;
  background: linear-gradient(180deg, rgba(153, 27, 27, .92), rgba(91, 13, 13, .92)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 12px 26px rgba(0,0,0,.38),
    0 0 18px rgba(239, 68, 68, .22);
}

/* Mobile adaptation for operator and Maxim dashboards.
   Desktop layout is unchanged; these rules apply only on narrow screens. */
@media (max-width: 900px) {
  html { -webkit-text-size-adjust: 100%; }
  body { min-width: 0; }
  header {
    padding: 12px 14px;
    background-attachment: scroll;
  }
  header h1 { font-size: 18px; line-height: 1.2; }
  header .hint { font-size: 12px; }
  main { padding: 10px; gap: 10px; }
  .card { padding: 12px; border-radius: 12px; }
  h2 { font-size: 18px; }
  h3 { font-size: 16px; }

  .row,
  .row.between,
  .face-header-row,
  .mx-date-filter-row,
  .operator-action-row {
    align-items: stretch;
    gap: 9px;
  }

  label { width: 100%; }
  input,
  select,
  textarea,
  button,
  .as-btn {
    min-height: 42px;
    font-size: 16px;
    box-sizing: border-box;
  }
  input,
  select,
  textarea { width: 100%; }
  button,
  .as-btn { touch-action: manipulation; }

  .grid2,
  .grid3,
  .grid3.report-compact,
  .compact-pair-row,
  #incident-modal .grid2,
  .episode-input-grid,
  .option-grid,
  .mx-send-grid,
  .mx-kpi-grid,
  .mx-online-kpi-grid,
  .mx-finance-grid,
  .mx-textq-grid,
  .training-admin-layout {
    grid-template-columns: 1fr !important;
  }

  .grid3.report-compact label,
  #op-point-name,
  #m-vtype-wrap select,
  #m-offender-wrap select,
  .description-template-select,
  .operator-name-select,
  .operator-number-select,
  .operator-number-new-input,
  .mx-pass-field,
  .customer-case-number-wrap {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .customer-case-number-wrap input { width: 72px; max-width: 140px; }

  .modal {
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
  }
  .modal-content,
  .modal-content.large,
  .preview-modal-content,
  .help-modal-content,
  #op-entry-modal .modal-content,
  .mx-auth-modal-content,
  .mx-dashboard-modal .modal-content.large,
  #mx-modal-points-base .modal-content {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    border-radius: 0;
    padding: 12px;
  }
  .modal-header,
  .mx-dashboard-modal .modal-header {
    top: 0;
    padding: 8px 0;
  }
  .modal-close { min-width: 46px; min-height: 46px; }
  .preview-wrap { max-height: calc(100dvh - 92px); }

  table,
  .mx-dashboard-modal table,
  #mx-reports-table,
  #mx-reg-table,
  #mx-smart-events-table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }
  th, td { padding: 9px 8px; }
  .mx-dashboard-modal table thead th { top: 48px; }

  .mx-launch-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  .mx-launch-grid .ghost {
    width: 100%;
    min-width: 0;
    min-height: 46px;
  }
  .mx-operational-summary-card { min-height: auto; }
  .mx-operational-summary { font-size: 15px; }

  .operator-action-row {
    align-items: stretch;
  }
  .operator-action-main,
  .operator-action-secondary {
    width: 100%;
    justify-content: flex-start;
    margin-left: 0;
  }
  .operator-action-row button,
  .operator-action-row .as-btn,
  .operator-action-row #op-open-connection,
  .operator-action-row #op-open-help,
  .operator-action-row #op-open-rules,
  .operator-action-row #op-logout-work {
    flex: 1 1 calc(50% - 8px);
    min-width: 150px;
  }

  .draft-row,
  .operator-completed-panel .draft-row,
  .training-review-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .draft-row-actions,
  .operator-completed-panel .draft-row-actions,
  .training-review-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .mx-actions-cell {
    min-width: 260px;
  }
  .mx-actions-cell button,
  .mx-actions-cell .ghost,
  .mx-actions-cell a {
    min-height: 38px;
    margin: 2px;
  }

  #mx-base-point-editor.mx-sticky-editor,
  #mx-customer-editor.mx-sticky-editor {
    position: static;
    box-shadow: none;
  }
}

@media (max-width: 640px) {
  header h1 { font-size: 17px; }
  main { padding: 8px; }
  .card { padding: 10px; }
  .row,
  .row.between,
  .operator-action-row {
    flex-direction: column;
  }
  .row > *,
  .operator-action-row > *,
  .mx-date-filter-row > *,
  .tool-group,
  button,
  .as-btn {
    width: 100%;
  }
  .tool-group { display: grid; grid-template-columns: 1fr; }
  .mx-launch-grid { grid-template-columns: 1fr; }
  .mx-kpi-card { min-height: auto; }
  .mx-textq-chip { white-space: normal; }
  .mx-textq-bar-row,
  .mx-textq-op-row {
    grid-template-columns: 1fr !important;
    gap: 4px;
  }
  .mx-report-case-item,
  .mx-report-case-main,
  .case-card-row {
    grid-template-columns: 1fr !important;
  }
  .face-header-row { flex-direction: column; align-items: stretch; }
  .customer-case-number-wrap input { width: 100%; max-width: none; }
  .completed-return-reason { display: block; margin: 4px 0 0; }
}

/* Mobile adaptation safeguards for compact controls. */
@media (max-width: 900px) {
  input[type="checkbox"],
  input[type="radio"] {
    width: auto !important;
    min-height: auto !important;
    flex: 0 0 auto;
  }
  .inline-check,
  .inline-check input,
  .mx-row-check,
  #mx-queue-select-all {
    width: auto !important;
  }
  .modal-close {
    width: auto !important;
    flex: 0 0 auto;
  }
}

@media (max-width: 640px) {
  button,
  .as-btn {
    width: auto;
  }
  .row > button,
  .row > .as-btn,
  .operator-action-row > button,
  .operator-action-row > .as-btn,
  .operator-action-main > button,
  .operator-action-main > .as-btn,
  .operator-action-secondary > button,
  .operator-action-secondary > .as-btn,
  .mx-date-filter-row > button,
  .tool-group > button,
  .mx-launch-grid .ghost {
    width: 100%;
  }
  .modal-header {
    flex-direction: row !important;
    align-items: center !important;
  }
}

/* Unified dashboard button feedback: subtle lift/glow on hover, pressed state on click. */
body.evas-dashboard-bg button:not(:disabled),
body.evas-dashboard-bg .as-btn,
body.maxim-dashboard-bg button:not(:disabled),
body.maxim-dashboard-bg .as-btn,
body.dark button:not(:disabled),
body.dark .as-btn {
  transition: transform .08s ease, box-shadow .16s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

body.evas-dashboard-bg button:not(:disabled):hover,
body.evas-dashboard-bg .as-btn:hover,
body.maxim-dashboard-bg button:not(:disabled):hover,
body.maxim-dashboard-bg .as-btn:hover,
body.dark button:not(:disabled):hover,
body.dark .as-btn:hover {
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 26px rgba(0,0,0,.36),
    0 0 18px rgba(96,165,250,.18);
}

body.evas-dashboard-bg button:not(:disabled):active,
body.evas-dashboard-bg .as-btn:active,
body.maxim-dashboard-bg button:not(:disabled):active,
body.maxim-dashboard-bg .as-btn:active,
body.dark button:not(:disabled):active,
body.dark .as-btn:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 8px rgba(0,0,0,.28), 0 4px 12px rgba(0,0,0,.24);
}

/* Modal buttons: use the same polished hover feedback as the operator undo button. */
.modal-content button:not(:disabled),
.modal-content .as-btn,
.mx-dashboard-modal button:not(:disabled),
.mx-dashboard-modal .as-btn {
  transition: transform .08s ease, box-shadow .16s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

.modal-content button:not(:disabled):hover,
.modal-content .as-btn:hover,
.mx-dashboard-modal button:not(:disabled):hover,
.mx-dashboard-modal .as-btn:hover {
  transform: translateY(-1px);
  border-color: #60a5fa !important;
  box-shadow:
    0 0 0 1px rgba(96,165,250,0.38) inset,
    0 8px 18px rgba(15,23,42,0.24),
    0 0 18px rgba(96,165,250,0.18);
}

.modal-content button:not(:disabled):active,
.modal-content .as-btn:active,
.mx-dashboard-modal button:not(:disabled):active,
.mx-dashboard-modal .as-btn:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 8px rgba(0,0,0,.28), 0 4px 12px rgba(0,0,0,.24);
}

/* Operator workspace visual refresh: calmer background, clearer work zones, cleaner report cards. */
body.evas-dashboard-bg {
  background:
    radial-gradient(circle at 52% 45%, rgba(15, 23, 42, 0.18) 0 12%, rgba(2, 8, 23, 0.44) 34%, rgba(2, 8, 23, 0.82) 100%),
    linear-gradient(180deg, rgba(2, 12, 18, 0.72), rgba(2, 12, 18, 0.88)),
    url('/ui/assets/evas-dashboard-bg.jpg') center center / cover fixed no-repeat !important;
}

body.evas-dashboard-bg header {
  background: linear-gradient(180deg, rgba(8, 18, 35, 0.92), rgba(8, 18, 35, 0.74));
  border-bottom: 1px solid rgba(125, 211, 252, 0.16);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.20);
  backdrop-filter: blur(6px);
}
body.evas-dashboard-bg main {
  gap: 18px;
  padding: 18px;
}

body.evas-dashboard-bg #op-work-card,
body.evas-dashboard-bg #op-folder-card,
body.evas-dashboard-bg #op-completed-card {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(125, 211, 252, 0.20) !important;
  background:
    linear-gradient(135deg, rgba(12, 31, 52, 0.86), rgba(9, 20, 38, 0.78)) !important;
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
body.evas-dashboard-bg #op-work-card::before,
body.evas-dashboard-bg #op-folder-card::before,
body.evas-dashboard-bg #op-completed-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(56, 189, 248, 0.08), rgba(45, 212, 191, 0.48), rgba(96, 165, 250, 0.10));
  pointer-events: none;
}
body.evas-dashboard-bg #op-work-card { background: linear-gradient(135deg, rgba(13, 34, 55, 0.88), rgba(8, 24, 42, 0.78)) !important; }
body.evas-dashboard-bg #op-folder-card { background: linear-gradient(135deg, rgba(9, 35, 43, 0.88), rgba(8, 22, 40, 0.80)) !important; }
body.evas-dashboard-bg #op-completed-card { background: linear-gradient(135deg, rgba(12, 28, 48, 0.84), rgba(8, 18, 34, 0.78)) !important; }

body.evas-dashboard-bg #op-work-card > h2,
body.evas-dashboard-bg #op-folder-card > h2,
body.evas-dashboard-bg #op-completed-card h2 {
  color: #f8fafc;
  letter-spacing: -0.02em;
  text-shadow: 0 1px 14px rgba(56, 189, 248, 0.14);
}

body.evas-dashboard-bg #op-work-card .grid3.report-compact {
  grid-template-columns: 112px minmax(180px, 230px) 150px 112px;
  gap: 10px;
  align-items: end;
  max-width: 680px;
}
body.evas-dashboard-bg #op-work-card .grid3.report-compact label span {
  color: #bfdbfe;
  font-weight: 750;
}
body.evas-dashboard-bg #op-work-card input,
body.evas-dashboard-bg #op-work-card select {
  border-color: rgba(147, 197, 253, 0.40);
  background: rgba(3, 12, 27, 0.76);
  color: #f8fafc;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 5px 14px rgba(0,0,0,.14);
}
body.evas-dashboard-bg #op-point-connection {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(245, 158, 11, 0.30);
  background: rgba(245, 158, 11, 0.10);
  color: #fde68a;
  font-weight: 750;
}
body.evas-dashboard-bg #op-point-connection::before {
  content: '●';
  margin-right: 7px;
  color: #f59e0b;
  font-size: 10px;
  text-shadow: 0 0 10px rgba(245, 158, 11, .55);
}

body.evas-dashboard-bg .operator-drafts-panel,
body.evas-dashboard-bg #op-folder-list,
body.evas-dashboard-bg #op-completed-list {
  border-radius: 14px;
}
body.evas-dashboard-bg .operator-drafts-panel {
  margin-top: 16px;
  padding: 12px;
  border: 1px solid rgba(96, 165, 250, 0.14);
  background: rgba(3, 12, 27, 0.28);
}
body.evas-dashboard-bg .operator-drafts-panel h3 {
  color: #e0f2fe;
}

body.evas-dashboard-bg #op-live-kpis.mx-kpi-grid {
  grid-template-columns: repeat(5, minmax(128px, 1fr));
  gap: 10px;
}
body.evas-dashboard-bg #op-live-kpis .mx-kpi-card {
  border-radius: 14px;
  border-color: rgba(125, 211, 252, 0.18) !important;
  background:
    linear-gradient(180deg, rgba(15, 46, 76, 0.56), rgba(2, 12, 27, 0.56)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 24px rgba(0,0,0,.18);
}
body.evas-dashboard-bg #op-live-kpis .mx-kpi-label {
  color: #7dd3fc;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 10px;
}
body.evas-dashboard-bg #op-live-kpis .mx-kpi-card b {
  color: #f8fafc;
  font-size: 19px;
}

body.evas-dashboard-bg .folder-guidance-banner,
body.evas-dashboard-bg .folder-qc-progress,
body.evas-dashboard-bg .folder-fail-banner {
  border-radius: 13px;
  padding: 10px 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
body.evas-dashboard-bg .folder-qc-progress {
  border-color: rgba(34, 211, 238, 0.28);
  background: linear-gradient(180deg, rgba(8, 145, 178, 0.18), rgba(14, 116, 144, 0.10));
}
body.evas-dashboard-bg .qc-progress-track {
  height: 10px;
  background: rgba(15, 23, 42, 0.58);
  box-shadow: inset 0 1px 3px rgba(0,0,0,.36);
}
body.evas-dashboard-bg .qc-progress-track > span {
  background: linear-gradient(90deg, #22d3ee 0%, #2dd4bf 48%, #4ade80 100%);
  box-shadow: 0 0 16px rgba(45, 212, 191, .35);
}

body.evas-dashboard-bg #op-folder-list.folder-list {
  gap: 10px;
  margin-top: 12px;
}
body.evas-dashboard-bg #op-folder-list .folder-item {
  grid-template-columns: 150px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  border-radius: 14px;
  padding: 10px;
  border-color: rgba(96, 165, 250, 0.18);
  background:
    linear-gradient(90deg, rgba(7, 18, 36, 0.86), rgba(11, 24, 48, 0.66));
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255,255,255,.04);
}
body.evas-dashboard-bg #op-folder-list .folder-item:hover {
  border-color: rgba(125, 211, 252, 0.42);
  background: linear-gradient(90deg, rgba(10, 28, 51, 0.92), rgba(14, 35, 63, 0.74));
}
body.evas-dashboard-bg #op-folder-list .folder-thumb {
  width: 150px;
  height: 90px;
  border-radius: 11px;
  border-color: rgba(125, 211, 252, 0.28);
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
}
body.evas-dashboard-bg #op-folder-list .folder-file {
  color: #7dd3fc;
  font-weight: 800;
  letter-spacing: .01em;
}
body.evas-dashboard-bg #op-folder-list .folder-title {
  color: #f8fafc;
  font-size: 15px;
  font-weight: 850;
}
body.evas-dashboard-bg #op-folder-list .folder-sub {
  color: #cbd5e1;
  line-height: 1.35;
}
body.evas-dashboard-bg #op-folder-list .folder-actions {
  align-self: center;
  gap: 7px;
}
body.evas-dashboard-bg #op-folder-list .folder-actions .ghost,
body.evas-dashboard-bg #op-folder-list .folder-actions button {
  border-radius: 10px !important;
  padding: 7px 10px !important;
}

body.evas-dashboard-bg .operator-folder-actions {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 14px;
  background: rgba(3, 12, 27, 0.30);
}
body.evas-dashboard-bg .operator-folder-actions-primary #op-finish-report,
body.evas-dashboard-bg .operator-folder-actions-submit #op-submit-review {
  min-height: 42px;
  padding: 10px 18px !important;
  border-radius: 13px !important;
  font-weight: 900;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.26);
}
body.evas-dashboard-bg .operator-folder-actions-primary #op-download-report {
  min-height: 42px;
  padding: 10px 14px !important;
  border-radius: 13px !important;
  border-color: rgba(125, 211, 252, 0.40) !important;
  background: rgba(15, 46, 76, 0.50) !important;
  color: #e0f2fe !important;
}
body.evas-dashboard-bg .operator-folder-actions-submit {
  border-color: rgba(244, 63, 94, 0.20);
  background: linear-gradient(90deg, rgba(127, 29, 29, 0.14), rgba(3, 12, 27, 0.26));
}

body.evas-dashboard-bg .operator-drafts-panel .draft-row,
body.evas-dashboard-bg .operator-completed-panel .draft-row {
  border-radius: 12px;
  border-color: rgba(96, 165, 250, 0.16);
  background: rgba(7, 18, 36, 0.66);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
body.evas-dashboard-bg .operator-drafts-panel .draft-row-title,
body.evas-dashboard-bg .operator-completed-panel .draft-row-title {
  color: #f1f5f9;
  font-weight: 750;
}

@media (max-width: 900px) {
  body.evas-dashboard-bg main { padding: 12px; gap: 12px; }
  body.evas-dashboard-bg #op-work-card .grid3.report-compact,
  body.evas-dashboard-bg #op-live-kpis.mx-kpi-grid,
  body.evas-dashboard-bg #op-folder-list .folder-item {
    grid-template-columns: 1fr;
  }
  body.evas-dashboard-bg #op-folder-list .folder-thumb {
    width: 100%;
    height: 150px;
  }
  body.evas-dashboard-bg .operator-folder-actions {
    align-items: stretch;
  }
}

/* Incident modal UI refresh: stronger hierarchy, opaque modal, readable native fields. */
#incident-modal {
  z-index: 2200;
  background: rgba(2, 6, 23, 0.78);
  backdrop-filter: blur(5px);
}
#incident-modal .modal-content.large {
  width: min(1120px, 96vw);
  max-height: 94vh;
  padding: 0;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  background: #0b162b !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.05);
}
#incident-modal .modal-content.large::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.12), rgba(45,212,191,.62), rgba(96,165,250,.10));
}
#incident-modal .modal-header.sticky {
  top: 0;
  margin: 0;
  padding: 16px 18px 14px;
  background: rgba(9, 19, 36, 0.98) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.14);
  box-shadow: 0 10px 26px rgba(0,0,0,.20);
  z-index: 20;
}
#incident-modal .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 20px;
  letter-spacing: -.02em;
}
#incident-modal .modal-close {
  border-radius: 12px !important;
  border-color: rgba(148, 163, 184, .24) !important;
  background: rgba(15, 23, 42, .72) !important;
}
#incident-modal .modal-header ~ * {
  margin-left: 18px;
  margin-right: 18px;
}
#incident-modal .date-time-row,
#incident-modal .grid2.compact-pair-row,
#incident-modal .tmc-quick-wrap,
#incident-modal .custom-violation-label,
#incident-modal .situation-template-row,
#incident-modal textarea#m-description,
#incident-modal .description-tools-row,
#incident-modal .description-template-row,
#incident-modal .face-header-row,
#incident-modal .face-grid,
#incident-modal h4.mt,
#incident-modal .episode-input-grid,
#incident-modal .episode-primary-tools-row,
#incident-modal .episode-template-tools-row,
#incident-modal .canvas-wrap,
#incident-modal .episode-actions-row,
#incident-modal #m-episodes-list,
#incident-modal #m-existing-images-wrap,
#incident-modal #incident-checklist,
#incident-modal #incident-checklist-details,
#incident-modal #incident-workflow,
#incident-modal #op-add-case {
  position: relative;
}

/* Section cards without changing modal logic. */
#incident-modal .date-time-row {
  margin-top: 16px;
  padding: 14px;
  border: 1px solid rgba(96,165,250,.15);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(15, 38, 65, .72), rgba(8, 18, 34, .66));
}
#incident-modal .date-time-row::before {
  content: 'Время нарушения';
  display: block;
  grid-column: 1 / -1;
  margin-bottom: 2px;
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#incident-modal .grid2.compact-pair-row,
#incident-modal .custom-violation-label,
#incident-modal .situation-template-row,
#incident-modal textarea#m-description,
#incident-modal .description-tools-row,
#incident-modal .description-template-row {
  max-width: 100%;
}
#incident-modal .grid2.compact-pair-row {
  margin-top: 12px;
  padding: 14px 14px 4px;
  border: 1px solid rgba(96,165,250,.15);
  border-bottom: 0;
  border-radius: 15px 15px 0 0;
  background: linear-gradient(135deg, rgba(12, 31, 52, .72), rgba(8, 18, 34, .62));
}
#incident-modal .grid2.compact-pair-row::before {
  content: 'Описание нарушения';
  display: block;
  grid-column: 1 / -1;
  margin-bottom: 2px;
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#incident-modal .custom-violation-label,
#incident-modal .situation-template-row,
#incident-modal textarea#m-description,
#incident-modal .description-tools-row,
#incident-modal .description-template-row {
  padding-left: 14px;
  padding-right: 14px;
  background: linear-gradient(135deg, rgba(12, 31, 52, .72), rgba(8, 18, 34, .62));
  border-left: 1px solid rgba(96,165,250,.15);
  border-right: 1px solid rgba(96,165,250,.15);
}
#incident-modal .description-template-row {
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(96,165,250,.15);
  border-radius: 0 0 15px 15px;
}
#incident-modal .face-header-row {
  margin-top: 14px;
  padding: 12px 14px 8px;
  border: 1px solid rgba(96,165,250,.15);
  border-bottom: 0;
  border-radius: 15px 15px 0 0;
  background: linear-gradient(135deg, rgba(9, 32, 45, .72), rgba(8, 18, 34, .62));
}
#incident-modal .face-header-row h4::before {
  content: 'Клиентская карточка';
  display: block;
  margin-bottom: 6px;
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#incident-modal .face-grid {
  padding: 0 14px 14px;
  border: 1px solid rgba(96,165,250,.15);
  border-top: 0;
  border-radius: 0 0 15px 15px;
  background: linear-gradient(135deg, rgba(9, 32, 45, .72), rgba(8, 18, 34, .62));
}
#incident-modal h4.mt[data-i18n="episodesTitle"] {
  margin-top: 16px;
  margin-bottom: 0;
  padding: 14px 14px 4px;
  border: 1px solid rgba(96,165,250,.15);
  border-bottom: 0;
  border-radius: 15px 15px 0 0;
  background: linear-gradient(135deg, rgba(10, 29, 55, .74), rgba(8, 18, 34, .64));
  color: #f8fafc;
}
#incident-modal h4.mt[data-i18n="episodesTitle"]::before {
  content: 'Рабочая область скрина';
  display: block;
  margin-bottom: 6px;
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#incident-modal .episode-input-grid,
#incident-modal .episode-primary-tools-row,
#incident-modal .episode-template-tools-row,
#incident-modal .canvas-wrap,
#incident-modal #m-episodes-list {
  margin-top: 0;
  padding-left: 14px;
  padding-right: 14px;
  border-left: 1px solid rgba(96,165,250,.15);
  border-right: 1px solid rgba(96,165,250,.15);
  background: linear-gradient(135deg, rgba(10, 29, 55, .74), rgba(8, 18, 34, .64));
}
#incident-modal .episode-input-grid { padding-top: 10px; }
#incident-modal .episode-primary-tools-row,
#incident-modal .episode-template-tools-row {
  padding-top: 10px;
  gap: 10px;
}
#incident-modal .episode-primary-tools-row::before,
#incident-modal .episode-template-tools-row::before {
  content: '';
  flex-basis: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(125,211,252,.16), transparent);
}
#incident-modal .canvas-wrap {
  margin-left: 18px;
  margin-right: 18px;
  padding-top: 12px;
  padding-bottom: 10px;
  border-top: 0;
  border-bottom: 0;
  border-radius: 0;
  background: linear-gradient(135deg, rgba(10, 29, 55, .74), rgba(8, 18, 34, .64));
}
#incident-modal .episode-actions-row {
  margin: 0 18px;
  padding: 12px 14px;
  border: 1px solid rgba(96,165,250,.15);
  border-top: 0;
  border-radius: 0 0 15px 15px;
  background: linear-gradient(135deg, rgba(10, 29, 55, .74), rgba(8, 18, 34, .64));
}

/* Native fields stay light for browser date/time/select readability. */
#incident-modal input:not([type="checkbox"]):not([type="file"]),
#incident-modal select {
  background: #f2f6ff !important;
  color: #0f172a !important;
  border-color: rgba(191,219,254,.9) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 5px 14px rgba(0,0,0,.18) !important;
  color-scheme: light;
}
#incident-modal input::placeholder,
#incident-modal textarea::placeholder { color: #64748b; }
#incident-modal label span,
#incident-modal .hint { color: #cbd5e1; }
#incident-modal label span { font-weight: 750; }
#incident-modal textarea#m-description {
  display: block;
  width: auto;
  min-height: 112px;
  padding-top: 12px;
  padding-bottom: 12px;
  color: #eaf2ff !important;
  background: #07152b !important;
  border-color: rgba(96,165,250,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 22px rgba(0,0,0,.18);
}
#incident-modal .tmc-quick {
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(153, 27, 27, .92), rgba(127, 29, 29, .82)) !important;
  box-shadow: 0 8px 20px rgba(127,29,29,.24);
}
#incident-modal .tmc-quick-wrap { margin-top: 10px; }
#incident-modal .situation-template-row,
#incident-modal .description-tools-row,
#incident-modal .description-template-row,
#incident-modal .episode-template-tools-row {
  gap: 8px;
  align-items: center;
}
#incident-modal .description-template-select,
#incident-modal .situation-template-select,
#incident-modal #m-screen-text-template-select {
  min-width: min(420px, 100%);
}
#incident-modal .dropzone {
  border-radius: 14px;
  border-color: rgba(96,165,250,.36);
  background: rgba(15, 46, 76, .28);
  color: #bfdbfe;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
#incident-modal .tool-group,
#incident-modal .line-tool-controls,
#incident-modal .text-tool-controls {
  padding: 5px;
  border: 1px solid rgba(96,165,250,.13);
  border-radius: 14px;
  background: rgba(3, 12, 27, .34);
}
#incident-modal .tool-btn,
#incident-modal .episode-primary-tools-row .ghost,
#incident-modal .episode-template-tools-row .ghost,
#incident-modal .text-tool-controls .ghost,
#incident-modal .line-tool-controls .ghost {
  border-radius: 11px !important;
}
#incident-modal .face-grid {
  grid-template-columns: repeat(4, 74px);
  gap: 10px;
}
#incident-modal .face-slot {
  border-color: rgba(96,165,250,.18);
  background: rgba(3, 12, 27, .42);
}
#incident-modal .face-slot.active {
  border-color: rgba(245,158,11,.90);
  box-shadow: 0 0 0 1px rgba(245,158,11,.55) inset, 0 0 18px rgba(245,158,11,.16);
}
#incident-modal .face-drop {
  width: 62px;
  min-height: 70px;
  background: rgba(30,64,175,.12);
}
#incident-modal .canvas-wrap canvas {
  border-radius: 12px;
  background:
    radial-gradient(circle at center, rgba(30,64,175,.12), transparent 45%),
    #061226;
  box-shadow: inset 0 0 0 1px rgba(96,165,250,.18), 0 12px 28px rgba(0,0,0,.24);
}
#incident-modal #m-episodes-list {
  padding-bottom: 10px;
}

/* Save/check area behaves like a footer; no more scattered bottom actions. */
#incident-modal #incident-checklist,
#incident-modal #incident-checklist-details,
#incident-modal #incident-workflow,
#incident-modal #op-add-case {
  margin-left: 18px;
  margin-right: 18px;
}
#incident-modal #incident-checklist {
  margin-top: 14px;
  padding: 12px 14px 4px;
  border: 1px solid rgba(34,197,94,.20);
  border-bottom: 0;
  border-radius: 15px 15px 0 0;
  background: linear-gradient(135deg, rgba(20,83,45,.18), rgba(8,18,34,.66));
  color: #bbf7d0;
  font-weight: 800;
}
#incident-modal #incident-checklist::before {
  content: 'Проверка и сохранение';
  display: block;
  margin-bottom: 8px;
  color: #86efac;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#incident-modal #incident-checklist-details,
#incident-modal #incident-workflow {
  margin-top: 0;
  padding: 8px 14px;
  border-left: 1px solid rgba(34,197,94,.20);
  border-right: 1px solid rgba(34,197,94,.20);
  background: linear-gradient(135deg, rgba(20,83,45,.18), rgba(8,18,34,.66));
}
#incident-modal #op-add-case {
  display: block;
  width: fit-content;
  margin-top: 0;
  margin-bottom: 18px;
  padding: 11px 18px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(248,113,113,.72) !important;
  background: linear-gradient(180deg, #e11d48, #be123c) !important;
  font-weight: 900;
  box-shadow: 0 14px 30px rgba(190,18,60,.24), inset 0 1px 0 rgba(255,255,255,.14);
}

@media (max-width: 900px) {
  #incident-modal .modal-header ~ * { margin-left: 12px; margin-right: 12px; }
  #incident-modal .date-time-row,
  #incident-modal .grid2.compact-pair-row { grid-template-columns: 1fr; }
  #incident-modal .episode-input-grid { grid-template-columns: 1fr; }
  #incident-modal .face-grid { grid-template-columns: repeat(4, 1fr); }
  #incident-modal .face-drop { width: 100%; }
  #incident-modal .description-template-select,
  #incident-modal .situation-template-select,
  #incident-modal #m-screen-text-template-select,
  #incident-modal .custom-violation-input { min-width: 100%; width: 100%; }
}

/* Incident modal scroll fix: scroll the modal content, not the page behind it. */
#incident-modal {
  overflow: hidden;
  overscroll-behavior: contain;
}
#incident-modal .modal-content.large {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
#incident-modal .modal-content.large::-webkit-scrollbar {
  width: 10px;
}
#incident-modal .modal-content.large::-webkit-scrollbar-thumb {
  background: rgba(96, 165, 250, 0.34);
  border-radius: 999px;
  border: 2px solid #0b162b;
}
#incident-modal .modal-content.large::-webkit-scrollbar-track {
  background: rgba(2, 6, 23, 0.32);
  border-radius: 999px;
}

/* Maxim launcher visual refresh: command-center layout for the main dashboard screen. */
body.maxim-dashboard-bg {
  background:
    radial-gradient(circle at 50% 44%, rgba(15, 23, 42, 0.04) 0 10%, rgba(2, 8, 23, 0.30) 34%, rgba(2, 8, 23, 0.78) 100%),
    linear-gradient(180deg, rgba(2, 12, 18, 0.76), rgba(2, 12, 18, 0.90)),
    url('/ui/assets/evas-dashboard-bg.jpg') center center / cover fixed no-repeat !important;
}
body.maxim-dashboard-bg header {
  padding: 14px 18px 12px;
  background: rgba(7, 17, 32, 0.92) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.14);
  box-shadow: 0 12px 34px rgba(0,0,0,.24);
  backdrop-filter: blur(8px);
}
body.maxim-dashboard-bg header h1 {
  font-size: 19px;
  letter-spacing: -.02em;
}
body.maxim-dashboard-bg header .hint {
  color: #dbeafe;
}
body.maxim-dashboard-bg .mx-bell-line {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 3px;
  padding: 3px 9px;
  width: fit-content;
  border: 1px solid rgba(250, 204, 21, 0.22);
  border-radius: 999px;
  background: rgba(250, 204, 21, 0.08);
  color: #fde68a;
}
body.maxim-dashboard-bg main {
  padding: 18px;
}
body.maxim-dashboard-bg #mx-launcher-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(520px, 1fr) minmax(320px, 390px);
  grid-template-areas:
    "head head"
    "nav summary";
  gap: 16px 18px;
  min-height: 220px;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(125, 211, 252, 0.20) !important;
  background:
    linear-gradient(135deg, rgba(12, 31, 52, 0.88), rgba(8, 20, 38, 0.78)) !important;
  box-shadow:
    0 22px 56px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.05);
}
body.maxim-dashboard-bg #mx-launcher-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.08), rgba(45,212,191,.58), rgba(96,165,250,.10));
  pointer-events: none;
}
body.maxim-dashboard-bg #mx-launcher-card::after {
  content: '';
  position: absolute;
  right: -70px;
  bottom: -90px;
  width: 360px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(45,212,191,.12), transparent 66%);
  pointer-events: none;
}
body.maxim-dashboard-bg #mx-launcher-card > .row.between {
  grid-area: head;
  position: relative;
  z-index: 1;
  margin-top: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(125, 211, 252, 0.12);
}
body.maxim-dashboard-bg #mx-launcher-card h2 {
  margin-bottom: 4px;
  color: #f8fafc;
  font-size: 22px;
  letter-spacing: -.03em;
  text-shadow: 0 1px 16px rgba(56,189,248,.16);
}
body.maxim-dashboard-bg #mx-launcher-card > .row.between > .row {
  align-items: center;
  gap: 9px;
  padding: 5px 6px 5px 10px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 999px;
  background: rgba(2, 8, 23, 0.30);
}
body.maxim-dashboard-bg #mx-session-hint {
  color: #e0f2fe;
  font-weight: 750;
}
body.maxim-dashboard-bg #mx-logout-btn {
  min-height: 30px;
  padding: 6px 11px !important;
  border-radius: 999px !important;
  border-color: rgba(248,113,113,.45) !important;
  background: rgba(127,29,29,.28) !important;
  color: #fecaca !important;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid {
  grid-area: nav;
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin-top: 0;
  align-content: start;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid::before {
  content: 'Быстрый доступ';
  grid-column: 1 / -1;
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 1px;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost {
  position: relative;
  width: auto;
  min-width: 0;
  min-height: 54px;
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: center;
  justify-content: start;
  gap: 9px;
  padding: 10px 12px !important;
  border-radius: 14px !important;
  text-align: left;
  color: #f8fafc !important;
  border: 1px solid rgba(125, 211, 252, 0.24) !important;
  background:
    linear-gradient(180deg, rgba(15, 46, 76, 0.66), rgba(8, 23, 42, 0.58)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 10px 22px rgba(0,0,0,.18),
    0 0 0 1px rgba(14,165,233,.04);
  font-weight: 850;
  letter-spacing: .005em;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost::before {
  content: '◦';
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: rgba(56,189,248,.12);
  color: #7dd3fc;
  font-size: 15px;
  box-shadow: inset 0 0 0 1px rgba(125,211,252,.14);
}
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(1)::before { content: '✓'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(2)::before { content: '↗'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(3)::before { content: '⌘'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(4)::before { content: '№'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(5)::before { content: '⌂'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(6)::before { content: '+'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(7)::before { content: '★'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(8)::before { content: '§'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(9)::before { content: '▣'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(10)::before { content: '✦'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:nth-child(11)::before { content: '≡'; }
body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid .ghost:hover {
  border-color: rgba(186,230,253,.72) !important;
  background: linear-gradient(180deg, rgba(20,70,110,.84), rgba(13,45,78,.74)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 14px 30px rgba(0,0,0,.26),
    0 0 20px rgba(56,189,248,.18);
}
body.maxim-dashboard-bg #mx-launcher-card .mx-online-kpi-grid {
  grid-area: summary;
  position: relative;
  z-index: 1;
  grid-template-columns: 1fr;
  margin-top: 0;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-operational-summary-card {
  min-height: 0;
  height: 100%;
  padding: 14px;
  border-radius: 16px;
  border-color: rgba(45, 212, 191, 0.22) !important;
  background:
    linear-gradient(180deg, rgba(6, 78, 59, .18), rgba(7, 18, 36, .62)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 28px rgba(0,0,0,.22);
}
body.maxim-dashboard-bg #mx-launcher-card .mx-kpi-label {
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-operational-summary {
  gap: 8px;
  margin-top: 12px;
  font-size: 14px;
  color: #dbeafe;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-operational-summary > div {
  padding: 6px 8px;
  border-radius: 10px;
  background: rgba(2, 8, 23, 0.24);
}
body.maxim-dashboard-bg #mx-launcher-card .mx-operational-summary > .hint {
  padding-top: 0;
  background: transparent;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-operational-summary b {
  color: #ffffff;
  font-size: 18px;
  text-shadow: 0 0 14px rgba(125,211,252,.18);
}
body.maxim-dashboard-bg #mx-launcher-card #mx-kpi-op-online-nums {
  color: #bfdbfe;
  font-weight: 700;
}
body.maxim-dashboard-bg #mx-launcher-card .mx-summary-divider {
  padding: 0;
  height: 1px;
  margin: 2px 0;
  background: linear-gradient(90deg, transparent, rgba(125,211,252,.22), transparent);
}
body.maxim-dashboard-bg #mx-launcher-card .mx-summary-updated {
  margin-top: 10px;
  color: #93c5fd;
}

@media (max-width: 980px) {
  body.maxim-dashboard-bg #mx-launcher-card {
    grid-template-columns: 1fr;
    grid-template-areas: "head" "summary" "nav";
  }
}
@media (max-width: 640px) {
  body.maxim-dashboard-bg main { padding: 10px; }
  body.maxim-dashboard-bg #mx-launcher-card { padding: 12px; border-radius: 16px; }
  body.maxim-dashboard-bg #mx-launcher-card > .row.between { align-items: stretch; }
  body.maxim-dashboard-bg #mx-launcher-card > .row.between > .row { justify-content: space-between; border-radius: 14px; }
  body.maxim-dashboard-bg #mx-launcher-card .mx-launch-grid { grid-template-columns: 1fr; }
}

/* Maxim queue modal refresh: opaque work surface, cleaner queue table, sticky bulk actions. */
#mx-modal-queue.mx-dashboard-modal {
  z-index: 2300;
  background: rgba(2, 6, 23, 0.82);
  backdrop-filter: blur(5px);
  overflow: hidden;
  overscroll-behavior: contain;
}
#mx-modal-queue .modal-content.large {
  width: min(1220px, 96vw);
  max-height: 94vh;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border-radius: 18px;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  background: #0b162b !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.60), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-modal-queue .modal-content.large::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(45,212,191,.58), rgba(96,165,250,.10));
}
#mx-modal-queue .modal-content.large::-webkit-scrollbar { width: 10px; }
#mx-modal-queue .modal-content.large::-webkit-scrollbar-thumb {
  background: rgba(96, 165, 250, 0.34);
  border-radius: 999px;
  border: 2px solid #0b162b;
}
#mx-modal-queue .modal-content.large::-webkit-scrollbar-track {
  background: rgba(2, 6, 23, 0.32);
  border-radius: 999px;
}
#mx-modal-queue .modal-header {
  position: sticky;
  top: 0;
  z-index: 30;
  margin: 0;
  padding: 16px 18px 14px;
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.14);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
#mx-modal-queue .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 21px;
  letter-spacing: -.03em;
}
#mx-modal-queue .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  border-color: rgba(148, 163, 184, .24) !important;
  background: rgba(15, 23, 42, .72) !important;
}
#mx-modal-queue .mx-date-filter-row,
#mx-modal-queue #mx-queue-kpis,
#mx-modal-queue #mx-reports-table,
#mx-modal-queue #mx-reports-table + .hint,
#mx-modal-queue #mx-reports-table + .hint + .row,
#mx-modal-queue #mx-report-details {
  margin-left: 18px;
  margin-right: 18px;
}
#mx-modal-queue .mx-date-filter-row {
  margin-top: 16px;
  padding: 13px 14px;
  border: 1px solid rgba(96, 165, 250, 0.15);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(12,31,52,.78), rgba(8,18,34,.68));
}
#mx-modal-queue .mx-date-filter-row::before {
  content: 'Фильтр очереди';
  flex-basis: 100%;
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#mx-modal-queue .mx-date-filter-row label {
  color: #bfdbfe;
  font-weight: 750;
}
#mx-modal-queue input[type="date"] {
  background: #f2f6ff !important;
  color: #0f172a !important;
  border-color: rgba(191, 219, 254, .90) !important;
  color-scheme: light;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 5px 14px rgba(0,0,0,.16) !important;
}
#mx-modal-queue #mx-refresh {
  align-self: end;
  min-height: 38px;
  padding: 9px 16px !important;
  border-radius: 12px !important;
  font-weight: 900;
  background: linear-gradient(180deg, #f43f5e, #be123c) !important;
  box-shadow: 0 10px 22px rgba(190,18,60,.24), inset 0 1px 0 rgba(255,255,255,.14);
}
#mx-modal-queue #mx-queue-kpis.mx-kpi-grid {
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
#mx-modal-queue #mx-queue-kpis .mx-kpi-card {
  min-height: 54px;
  border-radius: 14px;
  border-color: rgba(125, 211, 252, 0.18) !important;
  background: linear-gradient(180deg, rgba(15,46,76,.55), rgba(2,12,27,.62)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 24px rgba(0,0,0,.18);
}
#mx-modal-queue #mx-queue-kpis .mx-kpi-label {
  color: #7dd3fc;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#mx-modal-queue #mx-queue-kpis .mx-kpi-card b {
  color: #fff;
  font-size: 22px;
}
#mx-modal-queue #mx-reports-table {
  width: calc(100% - 36px);
  margin-top: 14px;
  border-collapse: separate;
  border-spacing: 0 8px;
  background: transparent !important;
}
#mx-modal-queue #mx-reports-table thead th {
  position: sticky;
  top: 76px;
  z-index: 24;
  padding: 10px 12px;
  border-bottom: 0;
  background: rgba(8, 18, 34, 0.98) !important;
  color: #bfdbfe;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
  box-shadow: 0 8px 18px rgba(0,0,0,.22);
}
#mx-modal-queue #mx-reports-table thead th:first-child { border-radius: 12px 0 0 12px; }
#mx-modal-queue #mx-reports-table thead th:last-child { border-radius: 0 12px 12px 0; }
#mx-modal-queue #mx-reports-table tbody tr {
  background: rgba(7, 18, 36, 0.92) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.03);
}
#mx-modal-queue #mx-reports-table tbody tr:hover {
  background: rgba(10, 31, 57, 0.98) !important;
}
#mx-modal-queue #mx-reports-table td {
  padding: 11px 12px;
  border-top: 1px solid rgba(96,165,250,.14);
  border-bottom: 1px solid rgba(96,165,250,.14);
  color: #e5e7eb;
  vertical-align: middle;
}
#mx-modal-queue #mx-reports-table td:first-child {
  border-left: 1px solid rgba(96,165,250,.14);
  border-radius: 13px 0 0 13px;
}
#mx-modal-queue #mx-reports-table td:last-child {
  border-right: 1px solid rgba(96,165,250,.14);
  border-radius: 0 13px 13px 0;
}
#mx-modal-queue #mx-reports-table td:nth-child(2) {
  font-weight: 800;
  color: #f8fafc;
}
#mx-modal-queue #mx-reports-table td:nth-child(3),
#mx-modal-queue #mx-reports-table td:nth-child(4) {
  color: #dbeafe;
  white-space: nowrap;
}
#mx-modal-queue .mx-report-status-badge {
  margin-left: 8px;
  vertical-align: middle;
  box-shadow: 0 0 14px rgba(34,197,94,.14);
}
#mx-modal-queue .mx-actions-cell {
  gap: 8px;
  align-items: center;
}
#mx-modal-queue .mx-actions-cell .ghost,
#mx-modal-queue #mx-reports-table td:last-child button {
  border-radius: 11px !important;
  padding: 7px 10px !important;
  background: rgba(15, 23, 42, .62) !important;
  border-color: rgba(125, 211, 252, .22) !important;
}
#mx-modal-queue #mx-reports-table a {
  color: #60a5fa;
  font-weight: 850;
}
#mx-modal-queue #mx-reports-table + .hint {
  display: block;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(96, 165, 250, .14);
  border-radius: 14px;
  background: rgba(3, 12, 27, .34);
  color: #cbd5e1;
  line-height: 1.42;
}
#mx-modal-queue #mx-reports-table + .hint + .row {
  position: sticky;
  bottom: 0;
  z-index: 26;
  margin-top: 12px;
  margin-bottom: 0;
  padding: 12px 14px;
  border-top: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 15px 15px 0 0;
  background: rgba(9, 19, 36, 0.98);
  box-shadow: 0 -14px 34px rgba(0,0,0,.30);
  backdrop-filter: blur(6px);
}
#mx-modal-queue #mx-reports-table + .hint + .row .hint {
  color: #e0f2fe;
  font-weight: 850;
  margin-right: 8px;
}
#mx-modal-queue #mx-reports-table + .hint + .row button {
  border-radius: 12px !important;
  padding: 8px 12px !important;
  border-color: rgba(125, 211, 252, .24) !important;
  background: rgba(15, 46, 76, .50) !important;
}
#mx-modal-queue #mx-bulk-delete {
  border-color: rgba(248,113,113,.46) !important;
  background: rgba(127,29,29,.36) !important;
  color: #fecaca !important;
}
#mx-modal-queue #mx-report-details {
  margin-top: 14px;
  margin-bottom: 18px;
}

@media (max-width: 900px) {
  #mx-modal-queue .mx-date-filter-row { align-items: stretch; }
  #mx-modal-queue #mx-queue-kpis.mx-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #mx-modal-queue #mx-reports-table { min-width: 820px; }
  #mx-modal-queue .modal-content.large { overflow-x: auto; }
}
@media (max-width: 640px) {
  #mx-modal-queue .mx-date-filter-row,
  #mx-modal-queue #mx-queue-kpis,
  #mx-modal-queue #mx-reports-table,
  #mx-modal-queue #mx-reports-table + .hint,
  #mx-modal-queue #mx-reports-table + .hint + .row,
  #mx-modal-queue #mx-report-details { margin-left: 12px; margin-right: 12px; }
  #mx-modal-queue #mx-queue-kpis.mx-kpi-grid { grid-template-columns: 1fr; }
}

/* Maxim report view as stacked modal above the queue modal. */
#mx-report-view-modal.mx-dashboard-modal {
  z-index: 2400;
  background: rgba(2, 6, 23, 0.58);
  backdrop-filter: blur(3px);
  overflow: hidden;
  overscroll-behavior: contain;
}
#mx-report-view-modal .mx-report-view-modal-content {
  width: min(1180px, 95vw);
  max-height: 92vh;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border-radius: 18px;
  border: 1px solid rgba(125, 211, 252, 0.24) !important;
  background: #0b162b !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.66), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-report-view-modal .mx-report-view-modal-content::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(45,212,191,.60), rgba(96,165,250,.10));
}
#mx-report-view-modal .mx-report-view-modal-content::-webkit-scrollbar { width: 10px; }
#mx-report-view-modal .mx-report-view-modal-content::-webkit-scrollbar-thumb {
  background: rgba(96, 165, 250, 0.34);
  border-radius: 999px;
  border: 2px solid #0b162b;
}
#mx-report-view-modal .mx-report-view-modal-content::-webkit-scrollbar-track {
  background: rgba(2, 6, 23, 0.32);
  border-radius: 999px;
}
#mx-report-view-modal .modal-header {
  position: sticky;
  top: 0;
  z-index: 34;
  margin: 0;
  padding: 16px 18px 14px;
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.14);
  box-shadow: 0 12px 28px rgba(0,0,0,.30);
}
#mx-report-view-modal .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 20px;
  letter-spacing: -.03em;
}
#mx-report-view-modal .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  border-color: rgba(148, 163, 184, .24) !important;
  background: rgba(15, 23, 42, .72) !important;
}
#mx-report-view-modal #mx-report-details {
  margin: 18px;
  border-radius: 16px;
  border-color: rgba(125, 211, 252, 0.18);
  background: linear-gradient(135deg, rgba(12, 31, 52, .78), rgba(8, 18, 34, .70)) !important;
}
#mx-report-view-modal #mx-report-details > h3 {
  margin-top: 0;
  color: #f8fafc;
  letter-spacing: -.02em;
}
#mx-report-view-modal .mx-report-summary-panel,
#mx-report-view-modal .mx-report-cases-panel {
  border-radius: 15px;
  background: rgba(3, 12, 27, .30);
  border-color: rgba(96, 165, 250, .15);
}
#mx-report-view-modal .mx-report-case-item {
  border-radius: 14px;
  background: rgba(7, 18, 36, .80);
  border-color: rgba(96, 165, 250, .16);
}
#mx-report-view-modal .mx-report-case-item button[data-preview-case-id] {
  border-radius: 11px !important;
}
#mx-report-view-modal .mx-report-loading {
  padding: 18px;
  color: #bfdbfe;
  font-weight: 800;
}
@media (max-width: 760px) {
  #mx-report-view-modal #mx-report-details { margin: 12px; }
}

/* Maxim case preview must be the top-most modal above queue and report-view modals. */
#mx-preview-modal {
  z-index: 2500;
  background: rgba(2, 6, 23, 0.72);
  backdrop-filter: blur(5px);
}
#mx-preview-modal .preview-modal-content {
  background: #0b162b !important;
  border: 1px solid rgba(125, 211, 252, 0.26) !important;
  border-radius: 18px;
  box-shadow: 0 34px 96px rgba(0,0,0,.70), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-preview-modal .modal-header {
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.14);
  margin: -14px -14px 12px;
  padding: 16px 18px 14px;
}
#mx-preview-modal .modal-header h3 {
  color: #f8fafc;
  margin: 0;
}
#mx-preview-modal .preview-wrap {
  border-color: rgba(125, 211, 252, 0.20);
  background: #061226;
}

/* Maxim send report modal refresh. */
#mx-modal-send.mx-dashboard-modal {
  z-index: 2310;
  background: rgba(2, 6, 23, 0.68);
  backdrop-filter: blur(4px);
}
#mx-modal-send .mx-send-modal-content {
  width: min(1180px, 94vw);
  max-height: 90vh;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 18px;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  background: #0b162b !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-modal-send .mx-send-modal-content::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.08), rgba(244,63,94,.72), rgba(45,212,191,.16));
}
#mx-modal-send .modal-header {
  position: sticky;
  top: 0;
  z-index: 5;
  margin: 0;
  padding: 18px 20px 15px;
  border-bottom: 1px solid rgba(125, 211, 252, 0.13);
  background: rgba(9, 19, 36, 0.99) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
.mx-modal-kicker {
  display: inline-flex;
  margin-bottom: 5px;
  color: #93c5fd;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
#mx-modal-send .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 22px;
  letter-spacing: -.035em;
}
#mx-modal-send .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  background: rgba(15, 23, 42, .76) !important;
}
.mx-send-intro {
  margin: 18px 20px 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.mx-send-intro > div {
  padding: 13px 14px;
  border: 1px solid rgba(96,165,250,.16);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(15, 35, 61, .72), rgba(6, 18, 38, .78));
}
.mx-send-intro b {
  display: block;
  color: #f8fafc;
  font-size: 14px;
  margin-bottom: 4px;
}
.mx-send-intro span {
  color: #bfdbfe;
  font-size: 13px;
  line-height: 1.35;
}
#mx-modal-send .mx-send-grid {
  margin: 0 20px;
  display: grid;
  grid-template-columns: minmax(280px, .95fr) minmax(360px, 1.15fr);
  gap: 14px;
  align-items: stretch;
}
.mx-send-section {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 15px;
  border-radius: 16px;
  border: 1px solid rgba(96,165,250,.16);
  background: rgba(7, 18, 36, .70);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.mx-send-section-message { grid-column: 1 / -1; }
.mx-send-section-head {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #e0f2fe;
  font-size: 15px;
}
.mx-send-section-head span {
  width: 25px;
  height: 25px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(244,63,94,.18);
  color: #fecdd3;
  border: 1px solid rgba(244,63,94,.32);
  font-weight: 900;
  font-size: 12px;
}
#mx-modal-send label {
  color: #cbd5e1;
  font-weight: 800;
  font-size: 13px;
}
#mx-modal-send select,
#mx-modal-send input#mx-chat-id {
  margin-top: 6px;
  min-height: 43px;
  border-radius: 12px !important;
  border: 1px solid rgba(203,213,225,.40) !important;
  background: #eef3fb !important;
  color: #0f172a !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
  color-scheme: light;
}
#mx-modal-send textarea#mx-send-message {
  margin-top: 6px;
  min-height: 118px;
  border-radius: 14px !important;
  border: 1px solid rgba(96,165,250,.22) !important;
  background: #081831 !important;
  color: #f8fafc !important;
  resize: vertical;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
#mx-modal-send textarea#mx-send-message::placeholder { color: #64748b; }
#mx-modal-send .mx-send-actions {
  margin: 14px 20px 0;
  padding: 14px 15px;
  border-radius: 16px;
  background: rgba(3, 12, 27, .44);
  border: 1px solid rgba(96,165,250,.13);
  align-items: center;
}
#mx-modal-send #mx-send-customer {
  min-height: 43px;
  padding: 0 18px;
  border-radius: 12px;
  font-weight: 900;
  box-shadow: 0 12px 30px rgba(225, 29, 72, .22);
}
#mx-modal-send .mx-send-status {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .74);
  border: 1px solid rgba(148, 163, 184, .16);
}
.mx-send-footnote {
  margin: 12px 20px 20px;
  padding: 12px 14px;
  border-radius: 14px;
  color: #bfdbfe;
  background: rgba(14, 35, 59, .52);
  border: 1px solid rgba(125, 211, 252, .14);
  font-size: 13px;
  line-height: 1.35;
}
@media (max-width: 820px) {
  .mx-send-intro,
  #mx-modal-send .mx-send-grid { grid-template-columns: 1fr; }
  .mx-send-section-message { grid-column: auto; }
}

/* Maxim points/operators modal width refresh. */
#mx-modal-ops.mx-dashboard-modal {
  z-index: 2320;
  background: rgba(2, 6, 23, 0.68);
  backdrop-filter: blur(4px);
}
#mx-modal-ops .modal-content.large {
  width: min(1760px, 98vw);
  max-width: min(1760px, 98vw);
  max-height: 92vh;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 18px;
  background: #0b162b !important;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-modal-ops .modal-content.large::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(96,165,250,.62), rgba(45,212,191,.12));
}
#mx-modal-ops .modal-header {
  margin: 0;
  padding: 18px 20px 15px;
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.13);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
#mx-modal-ops .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 22px;
  letter-spacing: -.035em;
}
#mx-modal-ops .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  background: rgba(15, 23, 42, .76) !important;
}
#mx-modal-ops .mx-ops-card {
  margin: 18px 20px 20px;
  gap: 14px;
}
#mx-modal-ops .mx-ops-group {
  padding: 16px;
  border-radius: 16px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
#mx-modal-ops .mx-ops-group h3 {
  margin: 0 0 14px;
  color: #e0f2fe;
  font-size: 16px;
  letter-spacing: -.015em;
}
#mx-modal-ops .grid3 {
  grid-template-columns: repeat(4, minmax(190px, 1fr));
  gap: 12px;
  align-items: end;
}
#mx-modal-ops .grid3 label:first-child,
#mx-modal-ops label.mx-pass-field {
  min-width: 0;
}
#mx-modal-ops .mx-point-logo-inline {
  align-self: end;
  min-height: 43px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(96,165,250,.15);
  background: rgba(15, 23, 42, .48);
}
#mx-modal-ops .row.mx-ops-row-tight {
  gap: 10px;
  align-items: end;
}
#mx-modal-ops .mx-inline-actions {
  flex-wrap: wrap;
  align-self: end;
}
#mx-modal-ops select,
#mx-modal-ops input,
#mx-modal-ops textarea {
  border-radius: 12px !important;
}
#mx-modal-ops #mx-operator-points-list {
  min-height: 120px;
}
#mx-modal-ops .mx-check-dropdown {
  min-width: 320px;
}
@media (min-width: 1500px) {
  #mx-modal-ops .grid3 { grid-template-columns: repeat(5, minmax(190px, 1fr)); }
}
@media (max-width: 1100px) {
  #mx-modal-ops .grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  #mx-modal-ops .modal-content.large { width: 98vw; max-height: 96vh; }
  #mx-modal-ops .mx-ops-card { margin: 12px; }
  #mx-modal-ops .grid3 { grid-template-columns: 1fr; }
  #mx-modal-ops .row.mx-ops-row-tight { align-items: stretch; }
  #mx-modal-ops .mx-check-dropdown { min-width: 0; width: 100%; }
}

/* Maxim points/operators modal card-design refresh. */
#mx-modal-ops .mx-ops-intro {
  margin: 18px 20px 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
#mx-modal-ops .mx-ops-intro > div {
  padding: 14px 15px;
  border-radius: 15px;
  border: 1px solid rgba(96,165,250,.16);
  background: linear-gradient(135deg, rgba(15, 35, 61, .72), rgba(6, 18, 38, .78));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
#mx-modal-ops .mx-ops-intro b {
  display: block;
  color: #f8fafc;
  font-size: 14px;
  margin-bottom: 5px;
}
#mx-modal-ops .mx-ops-intro span {
  color: #bfdbfe;
  font-size: 13px;
  line-height: 1.35;
}
#mx-modal-ops .mx-ops-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}
#mx-modal-ops .mx-ops-group {
  position: relative;
  overflow: hidden;
}
#mx-modal-ops .mx-ops-group::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(96,165,250,0), rgba(96,165,250,.42), rgba(45,212,191,.18), rgba(96,165,250,0));
  pointer-events: none;
}
#mx-modal-ops .mx-ops-group h3 {
  display: flex;
  align-items: center;
  gap: 10px;
}
#mx-modal-ops .mx-ops-group h3 > span {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 999px;
  background: rgba(244, 63, 94, .18);
  color: #fecdd3;
  border: 1px solid rgba(244, 63, 94, .34);
  font-size: 12px;
  font-weight: 950;
  box-shadow: 0 8px 22px rgba(244, 63, 94, .13);
}
#mx-modal-ops .mx-ops-group h3 small {
  color: #93c5fd;
  font-size: 12px;
  font-weight: 800;
  opacity: .86;
}
#mx-modal-ops label {
  color: #cbd5e1;
  font-weight: 800;
  font-size: 13px;
}
#mx-modal-ops select,
#mx-modal-ops input,
#mx-modal-ops textarea {
  margin-top: 6px;
  min-height: 42px;
  border: 1px solid rgba(203,213,225,.40) !important;
  background: #eef3fb !important;
  color: #0f172a !important;
  color-scheme: light;
}
#mx-modal-ops input[readonly],
#mx-modal-ops #mx-operator-current-password {
  background: #071226 !important;
  color: #bfdbfe !important;
  border-color: rgba(96,165,250,.22) !important;
}
#mx-modal-ops .mx-ops-row-tight {
  padding: 10px;
  border-radius: 14px;
  background: rgba(3, 12, 27, .24);
  border: 1px solid rgba(96,165,250,.08);
}
#mx-modal-ops .hint {
  color: #bfdbfe;
}
#mx-modal-ops #mx-point-summary,
#mx-modal-ops #mx-operator-contract-status {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(14, 35, 59, .52);
  border: 1px solid rgba(125, 211, 252, .14);
}
#mx-modal-ops .mx-check-dropdown > summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  color: #e0f2fe;
  background: rgba(15, 23, 42, .62);
  border-color: rgba(96,165,250,.20);
}
#mx-modal-ops button.ghost,
#mx-modal-ops .as-btn.ghost {
  border-radius: 12px !important;
  background: rgba(15, 23, 42, .62) !important;
  border-color: rgba(96,165,250,.18) !important;
  color: #e0f2fe !important;
}
#mx-modal-ops button.primary,
#mx-modal-ops #mx-point-create,
#mx-modal-ops #mx-operator-save {
  border-radius: 12px !important;
  box-shadow: 0 12px 30px rgba(225, 29, 72, .22);
}
@media (min-width: 1500px) {
  #mx-modal-ops .mx-ops-card {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 820px) {
  #mx-modal-ops .mx-ops-intro { grid-template-columns: 1fr; margin: 12px; }
  #mx-modal-ops .mx-ops-group h3 { align-items: flex-start; }
  #mx-modal-ops .mx-ops-group h3 small { display: block; margin-top: 3px; }
}

/* Maxim ops modal compact density correction. */
#mx-modal-ops .mx-ops-intro {
  margin: 12px 20px 10px;
  gap: 10px;
}
#mx-modal-ops .mx-ops-intro > div {
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(8, 20, 40, .58);
  border-color: rgba(96,165,250,.12);
}
#mx-modal-ops .mx-ops-intro b {
  font-size: 13px;
  margin-bottom: 2px;
}
#mx-modal-ops .mx-ops-intro span {
  font-size: 12px;
  line-height: 1.22;
  color: #9fb9db;
}
#mx-modal-ops .mx-ops-card {
  margin-top: 10px;
  gap: 10px;
}
#mx-modal-ops .mx-ops-group {
  padding: 12px 14px;
  border-radius: 14px;
}
#mx-modal-ops .mx-ops-group h3 {
  margin-bottom: 10px;
  font-size: 15px;
}
#mx-modal-ops .mx-ops-group h3 > span {
  width: 24px;
  height: 24px;
  font-size: 11px;
}
#mx-modal-ops .grid3 {
  gap: 9px 12px;
}
#mx-modal-ops label {
  font-size: 12px;
  line-height: 1.15;
}
#mx-modal-ops select,
#mx-modal-ops input,
#mx-modal-ops textarea {
  margin-top: 4px;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 9px !important;
  background: #dfe7f4 !important;
  border-color: rgba(203,213,225,.32) !important;
  font-size: 13px;
}
#mx-modal-ops .mx-point-logo-inline {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 10px;
}
#mx-modal-ops .row.mx-ops-row-tight {
  margin-top: 7px;
  padding: 7px 8px;
  border-radius: 12px;
}
#mx-modal-ops button,
#mx-modal-ops .as-btn,
#mx-modal-ops .mx-check-dropdown > summary {
  min-height: 34px;
  padding-top: 7px;
  padding-bottom: 7px;
  border-radius: 10px !important;
  font-size: 13px;
}
#mx-modal-ops #mx-operator-points-list {
  min-height: 74px;
  max-height: 140px;
}
#mx-modal-ops #mx-point-summary,
#mx-modal-ops #mx-operator-contract-status {
  padding: 7px 10px;
  font-size: 12px;
  border-radius: 10px;
}

/* Maxim ops modal final compact field sizing. */
#mx-modal-ops select,
#mx-modal-ops input:not([type="checkbox"]),
#mx-modal-ops textarea {
  box-sizing: border-box;
  height: 36px;
  min-height: 36px;
  padding: 5px 9px;
  line-height: 1.2;
}
#mx-modal-ops textarea,
#mx-modal-ops #mx-operator-points-list {
  height: 82px;
  min-height: 82px;
}
#mx-modal-ops .mx-point-logo-inline input[type="checkbox"] {
  width: auto;
  height: auto;
  min-height: 0;
  margin: 0 6px;
}

/* Maxim ops modal logical field widths. */
#mx-modal-ops .mx-operator-password-row,
#mx-modal-ops .mx-operator-labor-row {
  justify-content: flex-start;
  align-items: end;
  flex-wrap: nowrap;
}
#mx-modal-ops .mx-operator-password-row .mx-pass-field,
#mx-modal-ops .mx-operator-labor-row .mx-pass-field {
  flex: 0 0 auto;
  min-width: 0;
}
#mx-modal-ops .mx-password-field-current {
  width: min(520px, 45vw);
}
#mx-modal-ops .mx-password-field-new {
  width: min(460px, 40vw);
}
#mx-modal-ops .mx-labor-file-field {
  width: min(560px, 48vw);
}
#mx-modal-ops #mx-operator-current-password,
#mx-modal-ops #mx-operator-password,
#mx-modal-ops #mx-operator-labor-file {
  width: 100%;
}
#mx-modal-ops #mx-operator-upload-labor {
  max-width: 360px;
  white-space: normal;
  line-height: 1.15;
}
@media (max-width: 920px) {
  #mx-modal-ops .mx-operator-password-row,
  #mx-modal-ops .mx-operator-labor-row {
    flex-wrap: wrap;
    align-items: stretch;
  }
  #mx-modal-ops .mx-password-field-current,
  #mx-modal-ops .mx-password-field-new,
  #mx-modal-ops .mx-labor-file-field {
    width: 100%;
  }
  #mx-modal-ops #mx-operator-upload-labor {
    max-width: none;
  }
}

/* Maxim ops modal semantic field-width system. */
#mx-modal-ops #mx-point-new-name,
#mx-modal-ops #mx-point-existing,
#mx-modal-ops #mx-point-delete {
  max-width: 420px;
}
#mx-modal-ops #mx-point-customer-lang,
#mx-modal-ops #mx-point-bulk-lang {
  max-width: 92px;
}
#mx-modal-ops #mx-point-country,
#mx-modal-ops #mx-point-new-timezone {
  max-width: 320px;
}
#mx-modal-ops #mx-point-conn-software,
#mx-modal-ops #mx-point-conn-host {
  max-width: 360px;
}
#mx-modal-ops #mx-point-conn-port {
  max-width: 130px;
}
#mx-modal-ops #mx-point-conn-login {
  max-width: 220px;
}
#mx-modal-ops #mx-point-conn-password {
  max-width: 260px;
}
#mx-modal-ops #mx-point-operator,
#mx-modal-ops #mx-point-existing-operator {
  max-width: 360px;
}
#mx-modal-ops #mx-operator-number,
#mx-modal-ops #mx-operator-number-new {
  max-width: 260px;
}
#mx-modal-ops #mx-operator-first-name,
#mx-modal-ops #mx-operator-last-name {
  max-width: 260px;
}
#mx-modal-ops #mx-operator-phone {
  max-width: 240px;
}
#mx-modal-ops #mx-operator-address-registered,
#mx-modal-ops #mx-operator-address-actual {
  max-width: 360px;
}
#mx-modal-ops #mx-operator-passport-data {
  max-width: 380px;
}
#mx-modal-ops #mx-operator-notes {
  max-width: 420px;
}
#mx-modal-ops #mx-operator-points-select {
  width: min(680px, 100%);
  max-width: 680px;
}
#mx-modal-ops .mx-check-dropdown {
  max-width: 360px;
}
#mx-modal-ops .mx-inline-actions button,
#mx-modal-ops #mx-point-delete-btn,
#mx-modal-ops #mx-point-bulk-set-lang,
#mx-modal-ops #mx-point-bulk-delete,
#mx-modal-ops #mx-operator-offboard,
#mx-modal-ops #mx-operator-delete {
  flex: 0 0 auto;
  width: auto;
  white-space: nowrap;
}
#mx-modal-ops label:has(#mx-point-customer-lang),
#mx-modal-ops label:has(#mx-point-conn-port),
#mx-modal-ops label:has(#mx-operator-number),
#mx-modal-ops label:has(#mx-operator-first-name),
#mx-modal-ops label:has(#mx-operator-last-name),
#mx-modal-ops label:has(#mx-operator-phone) {
  max-width: max-content;
}
#mx-modal-ops .grid3 label input,
#mx-modal-ops .grid3 label select {
  width: 100%;
}
@media (max-width: 920px) {
  #mx-modal-ops #mx-point-new-name,
  #mx-modal-ops #mx-point-existing,
  #mx-modal-ops #mx-point-delete,
  #mx-modal-ops #mx-point-country,
  #mx-modal-ops #mx-point-new-timezone,
  #mx-modal-ops #mx-point-conn-software,
  #mx-modal-ops #mx-point-conn-host,
  #mx-modal-ops #mx-point-operator,
  #mx-modal-ops #mx-point-existing-operator,
  #mx-modal-ops #mx-operator-address-registered,
  #mx-modal-ops #mx-operator-address-actual,
  #mx-modal-ops #mx-operator-passport-data,
  #mx-modal-ops #mx-operator-notes,
  #mx-modal-ops #mx-operator-points-select,
  #mx-modal-ops .mx-check-dropdown {
    max-width: none;
    width: 100%;
  }
}

/* Maxim operators base modal unified card style. */
#mx-modal-operators-base.mx-dashboard-modal {
  z-index: 2320;
  background: rgba(2, 6, 23, 0.68);
  backdrop-filter: blur(4px);
}
#mx-modal-operators-base .modal-content.large {
  width: min(1760px, 98vw);
  max-width: min(1760px, 98vw);
  max-height: 92vh;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 18px;
  background: #0b162b !important;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-modal-operators-base .modal-content.large::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(96,165,250,.62), rgba(45,212,191,.12));
}
#mx-modal-operators-base .modal-header {
  margin: 0;
  padding: 18px 20px 15px;
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.13);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
#mx-modal-operators-base .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 22px;
  letter-spacing: -.035em;
}
#mx-modal-operators-base .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  background: rgba(15, 23, 42, .76) !important;
}
#mx-modal-operators-base .mx-base-intro {
  margin: 12px 20px 10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #bfdbfe;
  background: rgba(8, 20, 40, .58);
  border: 1px solid rgba(96,165,250,.12);
  font-size: 13px;
  line-height: 1.3;
}
#mx-modal-operators-base > .modal-content.large > .grid3,
#mx-modal-operators-base .mx-finance-panel,
#mx-modal-operators-base .mx-textq-grid,
#mx-modal-operators-base #mx-base-operators-list,
#mx-modal-operators-base .mx-textq-toolbar,
#mx-modal-operators-base > .modal-content.large > .row,
#mx-modal-operators-base #mx-text-quality-summary,
#mx-modal-operators-base #mx-payroll-period-summary,
#mx-modal-operators-base #mx-load-profit-summary,
#mx-modal-operators-base #mx-hr-alerts {
  margin-left: 20px;
  margin-right: 20px;
}
#mx-modal-operators-base > .modal-content.large > .grid3 {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  grid-template-columns: repeat(5, minmax(150px, max-content));
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-operators-base label {
  color: #cbd5e1;
  font-weight: 800;
  font-size: 12px;
  line-height: 1.15;
}
#mx-modal-operators-base select,
#mx-modal-operators-base input:not([type="checkbox"]),
#mx-modal-operators-base textarea {
  box-sizing: border-box;
  margin-top: 4px;
  height: 36px;
  min-height: 36px;
  padding: 5px 9px;
  border-radius: 9px !important;
  border: 1px solid rgba(203,213,225,.32) !important;
  background: #dfe7f4 !important;
  color: #0f172a !important;
  color-scheme: light;
  font-size: 13px;
  line-height: 1.2;
}
#mx-modal-operators-base #mx-base-operator-select { width: 320px; max-width: 320px; }
#mx-modal-operators-base #mx-base-operator-number { width: 110px; max-width: 110px; }
#mx-modal-operators-base #mx-base-operator-name { width: 340px; max-width: 340px; }
#mx-modal-operators-base #mx-base-operator-address { width: 360px; max-width: 360px; }
#mx-modal-operators-base #mx-base-operator-status { width: 190px; max-width: 190px; }
#mx-modal-operators-base #mx-base-operator-salary { width: 170px; max-width: 170px; }
#mx-modal-operators-base #mx-base-doc-passport-main,
#mx-modal-operators-base #mx-base-doc-passport-registration,
#mx-modal-operators-base #mx-base-doc-inn {
  width: 310px;
  max-width: 310px;
}
#mx-modal-operators-base > .modal-content.large > .row {
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(3, 12, 27, .24);
  border: 1px solid rgba(96,165,250,.08);
  gap: 10px;
  align-items: center;
}
#mx-modal-operators-base button,
#mx-modal-operators-base .as-btn,
#mx-modal-operators-base .mx-check-dropdown > summary {
  min-height: 34px;
  padding-top: 7px;
  padding-bottom: 7px;
  border-radius: 10px !important;
  font-size: 13px;
  white-space: nowrap;
}
#mx-modal-operators-base .inline-check {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border-radius: 10px;
  background: rgba(15, 23, 42, .48);
  border: 1px solid rgba(96,165,250,.12);
}
#mx-modal-operators-base .inline-check input[type="checkbox"] {
  width: auto;
  min-height: 0;
  margin: 0;
}
#mx-modal-operators-base .hint {
  color: #bfdbfe;
}
#mx-modal-operators-base .mx-finance-panel {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
}
#mx-modal-operators-base .mx-finance-title {
  color: #e0f2fe;
  font-size: 15px;
  font-weight: 900;
  margin-bottom: 10px;
}
#mx-modal-operators-base .mx-finance-grid {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-operators-base #mx-payroll-period { width: 170px; }
#mx-modal-operators-base #mx-eur-uah-rate { width: 190px; }
#mx-modal-operators-base #mx-payroll-op-id { width: 130px; }
#mx-modal-operators-base #mx-payroll-amount { width: 160px; }
#mx-modal-operators-base #mx-payroll-kind { width: 180px; }
#mx-modal-operators-base .mx-finance-actions {
  gap: 8px;
  flex-wrap: wrap;
}
#mx-modal-operators-base #mx-payroll-period-summary,
#mx-modal-operators-base #mx-load-profit-summary,
#mx-modal-operators-base #mx-text-quality-summary,
#mx-modal-operators-base #mx-hr-alerts {
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(14, 35, 59, .42);
  border: 1px solid rgba(125, 211, 252, .12);
}
#mx-modal-operators-base .mx-textq-toolbar {
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  align-items: end;
}
#mx-modal-operators-base #mx-text-quality-days { width: 110px; }
#mx-modal-operators-base #mx-text-quality-filter { width: 220px; }
#mx-modal-operators-base .mx-textq-grid {
  display: grid;
  grid-template-columns: minmax(360px, .75fr) minmax(520px, 1.25fr);
  gap: 14px;
}
#mx-modal-operators-base #mx-text-quality-charts,
#mx-modal-operators-base #mx-text-quality-top,
#mx-modal-operators-base #mx-base-operators-list {
  padding: 10px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .52) !important;
  border: 1px solid rgba(96,165,250,.14) !important;
}
#mx-modal-operators-base #mx-base-operators-list .folder-card,
#mx-modal-operators-base #mx-base-operators-list .folder-item {
  background: rgba(6, 18, 38, .72) !important;
  border-color: rgba(96,165,250,.16) !important;
}
@media (max-width: 1100px) {
  #mx-modal-operators-base > .modal-content.large > .grid3,
  #mx-modal-operators-base .mx-finance-grid,
  #mx-modal-operators-base .mx-textq-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 720px) {
  #mx-modal-operators-base .modal-content.large { width: 98vw; max-height: 96vh; }
  #mx-modal-operators-base .mx-base-intro,
  #mx-modal-operators-base > .modal-content.large > .grid3,
  #mx-modal-operators-base .mx-finance-panel,
  #mx-modal-operators-base .mx-textq-grid,
  #mx-modal-operators-base #mx-base-operators-list,
  #mx-modal-operators-base .mx-textq-toolbar,
  #mx-modal-operators-base > .modal-content.large > .row,
  #mx-modal-operators-base #mx-text-quality-summary,
  #mx-modal-operators-base #mx-payroll-period-summary,
  #mx-modal-operators-base #mx-load-profit-summary,
  #mx-modal-operators-base #mx-hr-alerts {
    margin-left: 12px;
    margin-right: 12px;
  }
  #mx-modal-operators-base > .modal-content.large > .grid3,
  #mx-modal-operators-base .mx-finance-grid,
  #mx-modal-operators-base .mx-textq-grid {
    grid-template-columns: 1fr;
  }
  #mx-modal-operators-base select,
  #mx-modal-operators-base input:not([type="checkbox"]),
  #mx-modal-operators-base textarea {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Maxim operators base finance layout correction. */
#mx-modal-operators-base .mx-finance-grid-top,
#mx-modal-operators-base .mx-finance-grid-bottom {
  grid-template-columns: max-content max-content max-content max-content;
  justify-content: start;
  align-items: end;
}
#mx-modal-operators-base .mx-finance-grid-top > label:nth-child(1),
#mx-modal-operators-base .mx-finance-grid-top > label:nth-child(2),
#mx-modal-operators-base .mx-finance-grid-bottom > label:nth-child(1),
#mx-modal-operators-base .mx-finance-grid-bottom > label:nth-child(2),
#mx-modal-operators-base .mx-finance-grid-bottom > label:nth-child(3),
#mx-modal-operators-base .mx-finance-grid-top .mx-finance-actions,
#mx-modal-operators-base .mx-finance-grid-bottom .mx-finance-actions {
  grid-column: auto;
}
#mx-modal-operators-base .mx-finance-grid-top .mx-finance-actions,
#mx-modal-operators-base .mx-finance-grid-bottom .mx-finance-actions {
  align-self: end;
}
@media (max-width: 920px) {
  #mx-modal-operators-base .mx-finance-grid-top,
  #mx-modal-operators-base .mx-finance-grid-bottom {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 720px) {
  #mx-modal-operators-base .mx-finance-grid-top,
  #mx-modal-operators-base .mx-finance-grid-bottom {
    grid-template-columns: 1fr;
  }
}

/* Maxim points base modal unified card style. */
#mx-modal-points-base.mx-dashboard-modal {
  z-index: 2320;
  background: rgba(2, 6, 23, 0.68);
  backdrop-filter: blur(4px);
}
#mx-modal-points-base .modal-content.large {
  width: min(1760px, 98vw);
  max-width: min(1760px, 98vw);
  max-height: 92vh;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 18px;
  background: #0b162b !important;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-modal-points-base .modal-content.large::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(96,165,250,.62), rgba(45,212,191,.12));
}
#mx-modal-points-base .modal-header {
  margin: 0;
  padding: 18px 20px 15px;
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.13);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
#mx-modal-points-base .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 22px;
  letter-spacing: -.035em;
}
#mx-modal-points-base .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  background: rgba(15, 23, 42, .76) !important;
}
#mx-modal-points-base #mx-base-point-editor.mx-sticky-editor {
  position: static;
  margin: 12px 20px 0;
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none;
}
#mx-modal-points-base .mx-base-intro {
  margin: 0 0 10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #bfdbfe;
  background: rgba(8, 20, 40, .58);
  border: 1px solid rgba(96,165,250,.12);
  font-size: 13px;
  line-height: 1.3;
}
#mx-modal-points-base #mx-base-point-editor > .grid3 {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  grid-template-columns: max-content max-content max-content max-content max-content;
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-points-base label {
  color: #cbd5e1;
  font-weight: 800;
  font-size: 12px;
  line-height: 1.15;
}
#mx-modal-points-base select,
#mx-modal-points-base input:not([type="checkbox"]),
#mx-modal-points-base textarea {
  box-sizing: border-box;
  margin-top: 4px;
  height: 36px;
  min-height: 36px;
  padding: 5px 9px;
  border-radius: 9px !important;
  border: 1px solid rgba(203,213,225,.32) !important;
  background: #dfe7f4 !important;
  color: #0f172a !important;
  color-scheme: light;
  font-size: 13px;
  line-height: 1.2;
}
#mx-modal-points-base #mx-base-point-name { width: 360px; max-width: 360px; }
#mx-modal-points-base #mx-base-point-customer-lang { width: 92px; max-width: 92px; }
#mx-modal-points-base #mx-base-point-timezone { width: 280px; max-width: 280px; }
#mx-modal-points-base #mx-base-point-logo-file { width: 330px; max-width: 330px; }
#mx-modal-points-base .mx-point-logo-inline {
  min-height: 36px;
  padding: 0 10px;
  border-radius: 10px;
  background: rgba(15, 23, 42, .48);
  border: 1px solid rgba(96,165,250,.12);
}
#mx-modal-points-base .mx-point-logo-inline input[type="checkbox"] {
  width: auto;
  min-height: 0;
  margin: 0 6px;
}
#mx-modal-points-base #mx-base-point-logo-status {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #9fb9db;
}
#mx-modal-points-base .mx-base-point-connections {
  grid-column: 1 / -1;
  margin-top: 6px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(3, 12, 27, .30);
  border: 1px solid rgba(96,165,250,.10);
}
#mx-modal-points-base .mx-base-point-connections-head {
  justify-content: space-between;
  align-items: center;
  margin: 0 0 8px;
}
#mx-modal-points-base .mx-base-point-connections-head b {
  color: #e0f2fe;
  font-size: 15px;
}
#mx-modal-points-base .mx-base-conn-row {
  margin-top: 8px;
  grid-template-columns: max-content max-content max-content max-content max-content auto;
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-points-base .mx-base-conn-row [data-f="software"] { width: 300px; }
#mx-modal-points-base .mx-base-conn-row [data-f="host"] { width: 300px; }
#mx-modal-points-base .mx-base-conn-row [data-f="port"] { width: 120px; }
#mx-modal-points-base .mx-base-conn-row [data-f="login"] { width: 180px; }
#mx-modal-points-base .mx-base-conn-row [data-f="password"] { width: 220px; }
#mx-modal-points-base .mx-base-conn-actions {
  display: flex;
  align-items: end;
  justify-content: flex-end;
}
#mx-modal-points-base #mx-base-point-editor > .row {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(3, 12, 27, .24);
  border: 1px solid rgba(96,165,250,.08);
  gap: 10px;
}
#mx-modal-points-base button,
#mx-modal-points-base .as-btn {
  min-height: 34px;
  padding-top: 7px;
  padding-bottom: 7px;
  border-radius: 10px !important;
  font-size: 13px;
  white-space: nowrap;
}
#mx-modal-points-base #mx-base-points-list {
  margin: 14px 20px 20px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .52) !important;
  border: 1px solid rgba(96,165,250,.14) !important;
}
#mx-modal-points-base #mx-base-points-list .folder-item {
  padding: 10px 12px;
  border-radius: 13px;
  background: rgba(6, 18, 38, .72) !important;
  border-color: rgba(96,165,250,.16) !important;
  min-height: 58px;
}
#mx-modal-points-base #mx-base-points-list .folder-title {
  font-size: 17px;
  line-height: 1.15;
}
#mx-modal-points-base #mx-base-points-list .folder-sub,
#mx-modal-points-base #mx-base-points-list .hint {
  font-size: 12px;
  color: #9fb9db;
  line-height: 1.25;
}
#mx-modal-points-base #mx-base-points-list .folder-actions {
  gap: 8px;
}
@media (max-width: 1280px) {
  #mx-modal-points-base #mx-base-point-editor > .grid3,
  #mx-modal-points-base .mx-base-conn-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #mx-modal-points-base .mx-base-conn-actions { justify-content: flex-start; }
}
@media (max-width: 720px) {
  #mx-modal-points-base .modal-content.large { width: 98vw; max-height: 96vh; }
  #mx-modal-points-base #mx-base-point-editor,
  #mx-modal-points-base #mx-base-points-list { margin-left: 12px; margin-right: 12px; }
  #mx-modal-points-base #mx-base-point-editor > .grid3,
  #mx-modal-points-base .mx-base-conn-row { grid-template-columns: 1fr; }
  #mx-modal-points-base select,
  #mx-modal-points-base input:not([type="checkbox"]),
  #mx-modal-points-base textarea {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Maxim remaining admin modals unified refresh. */
#mx-modal-log.mx-dashboard-modal,
#mx-modal-customers.mx-dashboard-modal,
#mx-modal-smart-events.mx-dashboard-modal,
#mx-modal-trainees.mx-dashboard-modal,
#mx-modal-rules.mx-dashboard-modal,
#mx-modal-registrations.mx-dashboard-modal {
  z-index: 2320;
  background: rgba(2, 6, 23, 0.68);
  backdrop-filter: blur(4px);
}
#mx-modal-log .modal-content.large,
#mx-modal-customers .modal-content.large,
#mx-modal-smart-events .modal-content.large,
#mx-modal-trainees .modal-content.large,
#mx-modal-rules .modal-content.large,
#mx-modal-registrations .modal-content.large {
  width: min(1760px, 98vw);
  max-width: min(1760px, 98vw);
  max-height: 92vh;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 18px;
  background: #0b162b !important;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}
#mx-modal-log .modal-content.large::before,
#mx-modal-customers .modal-content.large::before,
#mx-modal-smart-events .modal-content.large::before,
#mx-modal-trainees .modal-content.large::before,
#mx-modal-rules .modal-content.large::before,
#mx-modal-registrations .modal-content.large::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(96,165,250,.62), rgba(45,212,191,.12));
}
#mx-modal-log .modal-header,
#mx-modal-customers .modal-header,
#mx-modal-smart-events .modal-header,
#mx-modal-trainees .modal-header,
#mx-modal-rules .modal-header,
#mx-modal-registrations .modal-header {
  margin: 0;
  padding: 18px 20px 15px;
  background: rgba(9, 19, 36, 0.99) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.13);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
#mx-modal-log .modal-header h3,
#mx-modal-customers .modal-header h3,
#mx-modal-smart-events .modal-header h3,
#mx-modal-trainees .modal-header h3,
#mx-modal-rules .modal-header h3,
#mx-modal-registrations .modal-header h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 22px;
  letter-spacing: -.035em;
}
#mx-modal-log .modal-close,
#mx-modal-customers .modal-close,
#mx-modal-smart-events .modal-close,
#mx-modal-trainees .modal-close,
#mx-modal-rules .modal-close,
#mx-modal-registrations .modal-close {
  min-width: 44px;
  min-height: 44px;
  border-radius: 13px !important;
  background: rgba(15, 23, 42, .76) !important;
}
#mx-modal-customers #mx-customer-editor.mx-sticky-editor,
#mx-modal-rules > .modal-content.large > .grid3,
#mx-modal-trainees .training-admin-layout,
#mx-modal-smart-events > .modal-content.large > .row,
#mx-modal-smart-events .mx-kpi-grid,
#mx-modal-smart-events #mx-smart-events-table,
#mx-modal-smart-events > .modal-content.large > .hint.mt,
#mx-modal-registrations > .modal-content.large > .row,
#mx-modal-registrations #mx-reg-table,
#mx-modal-log #log {
  margin-left: 20px;
  margin-right: 20px;
}
#mx-modal-smart-events .mx-base-intro,
#mx-modal-trainees .mx-base-intro {
  margin: 12px 20px 10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #bfdbfe;
  background: rgba(8, 20, 40, .58);
  border: 1px solid rgba(96,165,250,.12);
  font-size: 13px;
  line-height: 1.3;
}
#mx-modal-customers #mx-customer-editor.mx-sticky-editor {
  position: static;
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
#mx-modal-customers #mx-customer-editor .grid3 {
  grid-template-columns: max-content max-content max-content;
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-rules > .modal-content.large > .grid3,
#mx-modal-smart-events > .modal-content.large > .row,
#mx-modal-registrations > .modal-content.large > .row {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-rules > .modal-content.large > label,
#mx-modal-rules > .modal-content.large > .row,
#mx-modal-rules #mx-rules-list,
#mx-modal-customers #mx-customers-list {
  margin-left: 20px;
  margin-right: 20px;
}
#mx-modal-rules > .modal-content.large > label {
  display: block;
  margin-top: 10px;
}
#mx-modal-rules > .modal-content.large > .row {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(3, 12, 27, .24);
  border: 1px solid rgba(96,165,250,.08);
}
#mx-modal-log label,
#mx-modal-customers label,
#mx-modal-smart-events label,
#mx-modal-trainees label,
#mx-modal-rules label,
#mx-modal-registrations label {
  color: #cbd5e1;
  font-weight: 800;
  font-size: 12px;
  line-height: 1.15;
}
#mx-modal-log select,
#mx-modal-log input:not([type="checkbox"]),
#mx-modal-log textarea,
#mx-modal-customers select,
#mx-modal-customers input:not([type="checkbox"]),
#mx-modal-customers textarea,
#mx-modal-smart-events select,
#mx-modal-smart-events input:not([type="checkbox"]),
#mx-modal-smart-events textarea,
#mx-modal-trainees select,
#mx-modal-trainees input:not([type="checkbox"]),
#mx-modal-trainees textarea,
#mx-modal-rules select,
#mx-modal-rules input:not([type="checkbox"]),
#mx-modal-rules textarea,
#mx-modal-registrations select,
#mx-modal-registrations input:not([type="checkbox"]),
#mx-modal-registrations textarea {
  box-sizing: border-box;
  margin-top: 4px;
  min-height: 36px;
  padding: 5px 9px;
  border-radius: 9px !important;
  border: 1px solid rgba(203,213,225,.32) !important;
  background: #dfe7f4 !important;
  color: #0f172a !important;
  color-scheme: light;
  font-size: 13px;
  line-height: 1.2;
}
#mx-modal-log textarea,
#mx-modal-customers textarea,
#mx-modal-smart-events textarea,
#mx-modal-trainees textarea,
#mx-modal-rules textarea,
#mx-modal-registrations textarea {
  background: #0a1730 !important;
  color: #e5edf7 !important;
  border-color: rgba(96,165,250,.20) !important;
  min-height: 86px;
}
#mx-modal-customers #mx-customer-name { width: 330px; }
#mx-modal-customers #mx-customer-lang { width: 260px; }
#mx-modal-customers #mx-customer-channel { width: 230px; }
#mx-modal-customers #mx-customer-telegram { width: 460px; }
#mx-modal-customers #mx-customer-emails { width: 420px; }
#mx-modal-rules #mx-rules-point { width: 430px; }
#mx-modal-rules #mx-rule-sort { width: 140px; }
#mx-modal-rules #mx-rule-title { width: min(820px, 100%); }
#mx-modal-rules #mx-rule-description,
#mx-modal-rules #mx-rules-bulk { width: 100%; min-height: 116px; }
#mx-modal-smart-events #mx-smart-events-days { width: 130px; }
#mx-modal-trainees #mx-training-video-title,
#mx-modal-trainees #mx-training-video-point,
#mx-modal-trainees #mx-training-video-scenario { width: 260px; }
#mx-modal-trainees #mx-training-video-lang { width: 120px; }
#mx-modal-trainees #mx-training-video-file,
#mx-modal-trainees #mx-training-example-file { width: 380px; max-width: 100%; }
#mx-modal-trainees #mx-training-example-title { width: 260px; }
#mx-modal-trainees #mx-training-example-vtype { width: 260px; }
#mx-modal-trainees #mx-training-trainee-select { width: 320px; }
#mx-modal-trainees #mx-training-video-desc,
#mx-modal-trainees #mx-training-example-desc,
#mx-modal-trainees #mx-training-example-note,
#mx-modal-trainees #mx-training-review-comment { width: 100%; }
#mx-modal-log button,
#mx-modal-customers button,
#mx-modal-smart-events button,
#mx-modal-trainees button,
#mx-modal-rules button,
#mx-modal-registrations button,
#mx-modal-log .as-btn,
#mx-modal-customers .as-btn,
#mx-modal-smart-events .as-btn,
#mx-modal-trainees .as-btn,
#mx-modal-rules .as-btn,
#mx-modal-registrations .as-btn {
  min-height: 34px;
  padding-top: 7px;
  padding-bottom: 7px;
  border-radius: 10px !important;
  font-size: 13px;
  white-space: nowrap;
}
#mx-modal-smart-events .mx-kpi-grid {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 10px;
}
#mx-modal-smart-events .mx-kpi-card,
#mx-modal-trainees .card.inner-card,
#mx-modal-trainees .training-review-score-card,
#mx-modal-customers #mx-customers-list,
#mx-modal-rules #mx-rules-list,
#mx-modal-log #log {
  border-radius: 14px;
  background: rgba(7, 18, 36, .70) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
#mx-modal-trainees .training-admin-layout {
  margin-top: 12px;
  grid-template-columns: minmax(420px, .9fr) minmax(520px, 1.1fr);
  gap: 14px;
}
#mx-modal-trainees .card.inner-card {
  padding: 16px;
}
#mx-modal-trainees .grid2.report-compact,
#mx-modal-trainees .training-admin-review .grid2 {
  grid-template-columns: repeat(2, max-content);
  gap: 9px 12px;
  align-items: end;
}
#mx-modal-trainees .inline-check {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border-radius: 10px;
  background: rgba(15, 23, 42, .48);
  border: 1px solid rgba(96,165,250,.12);
}
#mx-modal-trainees .inline-check input[type="checkbox"] { width: auto; min-height: 0; margin: 0; }
#mx-modal-trainees #mx-training-video-list .folder-item,
#mx-modal-trainees #mx-training-example-list .folder-item,
#mx-modal-customers #mx-customers-list .folder-item,
#mx-modal-rules #mx-rules-list .folder-item {
  padding: 10px 12px;
  border-radius: 13px;
  background: rgba(6, 18, 38, .72) !important;
  border-color: rgba(96,165,250,.16) !important;
  min-height: 58px;
}
#mx-modal-smart-events #mx-smart-events-table,
#mx-modal-registrations #mx-reg-table {
  width: calc(100% - 40px);
  margin-top: 12px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 14px;
  background: rgba(7, 18, 36, .52) !important;
  border: 1px solid rgba(96,165,250,.14) !important;
}
#mx-modal-smart-events #mx-smart-events-table th,
#mx-modal-smart-events #mx-smart-events-table td,
#mx-modal-registrations #mx-reg-table th,
#mx-modal-registrations #mx-reg-table td {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(96,165,250,.10);
}
#mx-modal-log #log {
  margin-top: 14px;
  margin-bottom: 20px;
  padding: 16px;
  min-height: 120px;
  max-height: 55vh;
  overflow: auto;
  color: #dbeafe;
}
@media (max-width: 1100px) {
  #mx-modal-customers #mx-customer-editor .grid3,
  #mx-modal-trainees .training-admin-layout,
  #mx-modal-smart-events .mx-kpi-grid { grid-template-columns: 1fr 1fr; }
  #mx-modal-trainees .grid2.report-compact,
  #mx-modal-trainees .training-admin-review .grid2 { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  #mx-modal-log .modal-content.large,
  #mx-modal-customers .modal-content.large,
  #mx-modal-smart-events .modal-content.large,
  #mx-modal-trainees .modal-content.large,
  #mx-modal-rules .modal-content.large,
  #mx-modal-registrations .modal-content.large { width: 98vw; max-height: 96vh; }
  #mx-modal-customers #mx-customer-editor.mx-sticky-editor,
  #mx-modal-rules > .modal-content.large > .grid3,
  #mx-modal-rules > .modal-content.large > label,
  #mx-modal-rules > .modal-content.large > .row,
  #mx-modal-rules #mx-rules-list,
  #mx-modal-customers #mx-customers-list,
  #mx-modal-trainees .training-admin-layout,
  #mx-modal-smart-events .mx-base-intro,
  #mx-modal-trainees .mx-base-intro,
  #mx-modal-smart-events > .modal-content.large > .row,
  #mx-modal-smart-events .mx-kpi-grid,
  #mx-modal-smart-events #mx-smart-events-table,
  #mx-modal-smart-events > .modal-content.large > .hint.mt,
  #mx-modal-registrations > .modal-content.large > .row,
  #mx-modal-registrations #mx-reg-table,
  #mx-modal-log #log { margin-left: 12px; margin-right: 12px; }
  #mx-modal-customers #mx-customer-editor .grid3,
  #mx-modal-rules > .modal-content.large > .grid3,
  #mx-modal-trainees .training-admin-layout,
  #mx-modal-smart-events .mx-kpi-grid { grid-template-columns: 1fr; }
  #mx-modal-smart-events #mx-smart-events-table,
  #mx-modal-registrations #mx-reg-table { width: calc(100% - 24px); }
  #mx-modal-log select,
  #mx-modal-log input:not([type="checkbox"]),
  #mx-modal-log textarea,
  #mx-modal-customers select,
  #mx-modal-customers input:not([type="checkbox"]),
  #mx-modal-customers textarea,
  #mx-modal-smart-events select,
  #mx-modal-smart-events input:not([type="checkbox"]),
  #mx-modal-smart-events textarea,
  #mx-modal-trainees select,
  #mx-modal-trainees input:not([type="checkbox"]),
  #mx-modal-trainees textarea,
  #mx-modal-rules select,
  #mx-modal-rules input:not([type="checkbox"]),
  #mx-modal-rules textarea,
  #mx-modal-registrations select,
  #mx-modal-registrations input:not([type="checkbox"]),
  #mx-modal-registrations textarea { width: 100% !important; max-width: none !important; }
}

/* Maxim safety/workflow UX refresh: confirmations, human log, smart actions, training tabs, mobile. */
.mx-role-note {
  margin: 12px 20px 10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #dbeafe;
  background: rgba(14, 35, 59, .52);
  border: 1px solid rgba(125, 211, 252, .16);
  font-size: 13px;
  line-height: 1.35;
}
#mx-modal-ops .mx-role-note,
#mx-modal-points-base #mx-base-point-editor .mx-role-note {
  margin-left: 0;
  margin-right: 0;
}
.mx-confirm-action-modal { z-index: 2800; }
.mx-confirm-action-modal .modal-content {
  width: min(720px, 94vw);
  border-radius: 18px;
  background: #0b162b !important;
  border: 1px solid rgba(248, 113, 113, .32) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.68);
}
.mx-confirm-action-list,
.mx-confirm-action-result,
.mx-confirm-archive-note {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(7, 18, 36, .72);
  border: 1px solid rgba(96,165,250,.14);
  color: #dbeafe;
}
.mx-confirm-archive-note { border-color: rgba(251, 191, 36, .28); color: #fde68a; }
.mx-confirm-action-result { border-color: rgba(34, 197, 94, .30); color: #bbf7d0; }
.mx-confirm-action-list ul { margin: 8px 0 0; padding-left: 20px; max-height: 240px; overflow: auto; }
.mx-confirm-action-list li { margin: 4px 0; }
.mx-log-toolbar {
  margin: 12px 20px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.mx-log-toolbar .active { border-color: rgba(96,165,250,.60) !important; background: rgba(37,99,235,.25) !important; }
.mx-human-log {
  margin: 12px 20px 20px;
  display: grid;
  gap: 8px;
  max-height: 58vh;
  overflow: auto;
}
.mx-log-entry {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(7, 18, 36, .70);
  border: 1px solid rgba(96,165,250,.14);
}
.mx-log-entry.mx-log-error { border-color: rgba(248,113,113,.36); background: rgba(69, 10, 10, .28); }
.mx-log-entry.mx-log-danger { border-color: rgba(251,191,36,.30); background: rgba(69, 38, 10, .24); }
.mx-log-line { display: flex; gap: 10px; align-items: center; color: #e0f2fe; }
.mx-log-line span { color: #93c5fd; font-size: 12px; }
.mx-log-message { margin-top: 4px; color: #dbeafe; font-size: 13px; }
.mx-log-entry details { margin-top: 8px; }
.mx-log-entry details pre { white-space: pre-wrap; max-height: 220px; overflow: auto; font-size: 12px; color: #cbd5e1; }
.mx-ai-events-review { display: grid; gap: 10px; }
.mx-ai-event-review-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; border: 1px solid #233a66; border-radius: 14px; padding: 12px; background: rgba(8,19,38,.92); }
.mx-ai-event-main { min-width: 0; }
.mx-ai-event-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 360px; }
.mx-ai-event-actions button { white-space: nowrap; }
@media (max-width: 900px) { .mx-ai-event-review-card { grid-template-columns: 1fr; } .mx-ai-event-actions { justify-content: flex-start; max-width: none; } }

.mx-smart-events-cards {
  margin-left: 20px;
  margin-right: 20px;
  display: grid;
  grid-template-columns: repeat(3, minmax(280px, 1fr));
  gap: 12px;
}
.mx-smart-event-card {
  padding: 12px;
  border-radius: 14px;
  background: rgba(7, 18, 36, .72);
  border: 1px solid rgba(96,165,250,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.mx-smart-event-card.mx-smart-high { border-color: rgba(248,113,113,.40); }
.mx-smart-event-card.mx-smart-medium { border-color: rgba(251,191,36,.34); }
.mx-smart-event-head { display: flex; justify-content: space-between; gap: 8px; align-items: center; color: #e0f2fe; }
.mx-smart-event-title { margin: 8px 0 4px; color: #f8fafc; font-weight: 900; }
.mx-smart-event-actions { margin-top: 10px; gap: 8px; flex-wrap: wrap; }
.mx-training-tabs {
  margin: 12px 20px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mx-training-tabs button.active {
  border-color: rgba(96,165,250,.65) !important;
  background: rgba(37,99,235,.28) !important;
  color: #eff6ff;
}
#mx-modal-trainees .training-admin-layout[data-training-active-tab="materials"] [data-training-panel]:not([data-training-panel="materials"]),
#mx-modal-trainees .training-admin-layout[data-training-active-tab="examples"] [data-training-panel]:not([data-training-panel="examples"]),
#mx-modal-trainees .training-admin-layout[data-training-active-tab="review"] [data-training-panel]:not([data-training-panel~="review"]),
#mx-modal-trainees .training-admin-layout[data-training-active-tab="history"] [data-training-panel]:not([data-training-panel~="history"]) {
  display: none !important;
}
#mx-modal-trainees .training-admin-layout[data-training-active-tab="materials"],
#mx-modal-trainees .training-admin-layout[data-training-active-tab="examples"],
#mx-modal-trainees .training-admin-layout[data-training-active-tab="review"],
#mx-modal-trainees .training-admin-layout[data-training-active-tab="history"] {
  grid-template-columns: 1fr;
}
@media (max-width: 900px) {
  .mx-smart-events-cards { grid-template-columns: 1fr; margin-left: 12px; margin-right: 12px; }
  .mx-log-toolbar, .mx-human-log, .mx-training-tabs, .mx-role-note { margin-left: 12px; margin-right: 12px; }
  .mx-confirm-action-modal .modal-content { width: 96vw; max-height: 92vh; overflow: auto; }
  .mx-confirm-action-list ul { max-height: 180px; }
  .mx-smart-event-actions button, .mx-log-toolbar button, .mx-training-tabs button { width: 100%; justify-content: center; }
  #mx-modal-smart-events #mx-smart-events-table,
  #mx-modal-registrations #mx-reg-table,
  #mx-modal-queue #mx-reports-table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}
@media (max-width: 560px) {
  .mx-log-line { flex-direction: column; align-items: flex-start; gap: 2px; }
  .mx-smart-event-head { flex-direction: column; align-items: flex-start; }
  .mx-confirm-action-modal .row { flex-direction: column; align-items: stretch; }
  .mx-confirm-action-modal .row button { width: 100%; }
}
.mx-confirm-action-input {
  display: block;
  margin-top: 12px;
  color: #cbd5e1;
  font-weight: 800;
  font-size: 12px;
}
.mx-confirm-action-input input {
  width: 100%;
  box-sizing: border-box;
  margin-top: 6px;
  min-height: 38px;
  padding: 6px 10px;
  border-radius: 10px !important;
  border: 1px solid rgba(203,213,225,.32) !important;
  background: #dfe7f4 !important;
  color: #0f172a !important;
  color-scheme: light;
}
@media (max-width: 720px) {
  #mx-modal-trainees .training-admin-layout { margin-left: 12px; margin-right: 12px; }
  #mx-modal-trainees .card.inner-card { padding: 12px; }
  #mx-modal-trainees .report-list { overflow-x: auto; }
  .mx-human-log { max-height: 62vh; }
}

/* Maxim mobile modal system: real phone-first layout, not just shrink-to-fit. */
@media (max-width: 720px) {
  body.modal-open {
    overflow: hidden !important;
    position: fixed;
    inset: 0;
    width: 100%;
  }
  .mx-dashboard-modal.modal,
  #mx-preview-modal.modal,
  #mx-link-modal.modal {
    align-items: stretch !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    background: rgba(2, 6, 23, .88) !important;
  }
  .mx-dashboard-modal .modal-content,
  .mx-dashboard-modal .modal-content.large,
  #mx-preview-modal .modal-content,
  #mx-preview-modal .modal-content.large,
  #mx-link-modal .modal-content,
  #mx-link-modal .modal-content.large {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .mx-dashboard-modal .modal-header,
  #mx-preview-modal .modal-header,
  #mx-link-modal .modal-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    min-height: 58px;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 12px 10px !important;
    gap: 8px !important;
    background: rgba(9, 19, 36, .98) !important;
    backdrop-filter: blur(8px);
  }
  .mx-dashboard-modal .modal-header h3,
  #mx-preview-modal .modal-header h3,
  #mx-link-modal .modal-header h3 {
    font-size: 18px !important;
    line-height: 1.1 !important;
    letter-spacing: -.02em !important;
    max-width: calc(100vw - 74px);
  }
  .mx-dashboard-modal .mx-modal-kicker {
    font-size: 10px !important;
    letter-spacing: .09em !important;
  }
  .mx-dashboard-modal .modal-close,
  #mx-preview-modal .modal-close,
  #mx-link-modal .modal-close {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    flex: 0 0 44px !important;
    font-size: 24px !important;
  }
  .mx-dashboard-modal .row:not(.modal-header):not(.mx-smart-event-actions),
  .mx-dashboard-modal .between,
  .mx-dashboard-modal .mx-inline-actions,
  .mx-dashboard-modal .folder-actions,
  .mx-dashboard-modal .mx-finance-actions,
  .mx-dashboard-modal .mx-send-actions,
  .mx-dashboard-modal .mx-ops-row-tight,
  .mx-dashboard-modal .mx-base-point-connections-head {
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }
  .mx-dashboard-modal button:not(.modal-close),
  .mx-dashboard-modal .as-btn,
  .mx-dashboard-modal summary,
  #mx-preview-modal button:not(.modal-close),
  #mx-link-modal button:not(.modal-close) {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: normal !important;
  }
  .mx-dashboard-modal label,
  .mx-dashboard-modal .mx-pass-field,
  .mx-dashboard-modal .mx-send-customer-label,
  .mx-dashboard-modal .mx-send-destination-label,
  .mx-dashboard-modal .mx-send-message-label {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .mx-dashboard-modal input:not([type="checkbox"]),
  .mx-dashboard-modal select,
  .mx-dashboard-modal textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    font-size: 16px !important; /* prevents iOS zoom */
  }
  .mx-dashboard-modal input[type="file"] {
    min-height: 44px !important;
  }
  .mx-dashboard-modal .grid2,
  .mx-dashboard-modal .grid3,
  .mx-dashboard-modal .mx-send-grid,
  .mx-dashboard-modal .mx-ops-card,
  .mx-dashboard-modal .mx-ops-intro,
  .mx-dashboard-modal .training-admin-layout,
  .mx-dashboard-modal .mx-kpi-grid,
  .mx-dashboard-modal .mx-finance-grid,
  .mx-dashboard-modal .mx-textq-grid,
  .mx-dashboard-modal .mx-base-conn-row,
  .mx-dashboard-modal #mx-base-point-editor > .grid3,
  .mx-dashboard-modal #mx-customer-editor .grid3 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .mx-dashboard-modal .mx-ops-card,
  .mx-dashboard-modal .mx-ops-group,
  .mx-dashboard-modal .mx-send-section,
  .mx-dashboard-modal .card.inner-card,
  .mx-dashboard-modal .mx-base-point-connections,
  .mx-dashboard-modal #mx-customer-editor.mx-sticky-editor,
  .mx-dashboard-modal #mx-base-point-editor.mx-sticky-editor,
  .mx-dashboard-modal #mx-base-operators-list,
  .mx-dashboard-modal #mx-base-points-list,
  .mx-dashboard-modal #mx-customers-list,
  .mx-dashboard-modal #mx-rules-list,
  .mx-dashboard-modal .mx-base-intro,
  .mx-dashboard-modal .mx-role-note,
  .mx-dashboard-modal .mx-send-intro,
  .mx-dashboard-modal .mx-log-toolbar,
  .mx-dashboard-modal .mx-human-log,
  .mx-dashboard-modal .mx-training-tabs,
  .mx-dashboard-modal .mx-smart-events-cards,
  .mx-dashboard-modal .mx-date-filter-row,
  .mx-dashboard-modal #mx-queue-kpis,
  .mx-dashboard-modal #mx-queue-kpis + table,
  .mx-dashboard-modal .mx-finance-panel,
  .mx-dashboard-modal .mx-textq-toolbar {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  .mx-dashboard-modal .mx-ops-group,
  .mx-dashboard-modal .mx-send-section,
  .mx-dashboard-modal .card.inner-card,
  .mx-dashboard-modal .mx-base-point-connections,
  .mx-dashboard-modal #mx-customer-editor.mx-sticky-editor,
  .mx-dashboard-modal #mx-base-point-editor > .grid3,
  .mx-dashboard-modal #mx-modal-operators-base > .modal-content.large > .grid3 {
    padding: 10px !important;
    border-radius: 14px !important;
  }
  .mx-dashboard-modal table {
    display: block !important;
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    margin-left: 10px !important;
    margin-right: 10px !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  .mx-dashboard-modal .folder-item,
  .mx-dashboard-modal .training-review-card-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  .mx-dashboard-modal .hint,
  .mx-dashboard-modal .folder-sub,
  .mx-dashboard-modal .folder-title {
    overflow-wrap: anywhere;
  }
  .mx-check-dropdown-body {
    position: static !important;
    width: 100% !important;
    max-height: 45dvh !important;
    overflow: auto !important;
  }
}
@media (max-width: 720px) {
  .mx-dashboard-modal .modal-content,
  .mx-dashboard-modal .modal-content.large,
  #mx-preview-modal .modal-content,
  #mx-preview-modal .modal-content.large,
  #mx-link-modal .modal-content,
  #mx-link-modal .modal-content.large {
    box-sizing: border-box !important;
  }
}

/* Maxim queue mobile fix: table becomes readable report cards. */
@media (max-width: 720px) {
  #mx-modal-queue .modal-content.large {
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
  }
  #mx-modal-queue .mx-date-filter-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
    border-radius: 14px !important;
    background: rgba(7, 18, 36, .70) !important;
    border: 1px solid rgba(96,165,250,.16) !important;
  }
  #mx-modal-queue .mx-date-filter-row label {
    width: 100% !important;
  }
  #mx-modal-queue .mx-date-filter-row #mx-refresh {
    grid-column: 1 / -1;
  }
  #mx-modal-queue #mx-queue-kpis {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  #mx-modal-queue #mx-queue-kpis .mx-kpi-card {
    min-height: 68px !important;
    padding: 10px !important;
    border-radius: 13px !important;
  }
  #mx-modal-queue #mx-reports-table {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    margin: 12px 10px 0 !important;
    border: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    white-space: normal !important;
  }
  #mx-modal-queue #mx-reports-table thead {
    display: none !important;
  }
  #mx-modal-queue #mx-reports-table tbody {
    display: grid !important;
    gap: 10px !important;
  }
  #mx-modal-queue #mx-reports-table tr {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    padding: 12px !important;
    border-radius: 14px !important;
    background: rgba(7, 18, 36, .74) !important;
    border: 1px solid rgba(96,165,250,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  }
  #mx-modal-queue #mx-reports-table td {
    display: grid !important;
    grid-template-columns: minmax(94px, .42fr) 1fr !important;
    gap: 8px !important;
    align-items: start !important;
    padding: 0 !important;
    border: 0 !important;
    color: #dbeafe !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  #mx-modal-queue #mx-reports-table td::before {
    color: #93c5fd;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  #mx-modal-queue #mx-reports-table td:nth-child(1)::before { content: 'Выбор'; }
  #mx-modal-queue #mx-reports-table td:nth-child(2)::before { content: 'Точка'; }
  #mx-modal-queue #mx-reports-table td:nth-child(3)::before { content: 'Максиму'; }
  #mx-modal-queue #mx-reports-table td:nth-child(4)::before { content: 'Оператор'; }
  #mx-modal-queue #mx-reports-table td:nth-child(5)::before { content: 'Действия'; }
  #mx-modal-queue #mx-reports-table td[colspan] {
    display: block !important;
    text-align: center !important;
    color: #bfdbfe !important;
  }
  #mx-modal-queue #mx-reports-table td[colspan]::before {
    content: '' !important;
    display: none !important;
  }
  #mx-modal-queue #mx-reports-table td:first-child {
    grid-template-columns: 1fr auto !important;
  }
  #mx-modal-queue #mx-reports-table td input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;
    justify-self: end;
  }
  #mx-modal-queue #mx-reports-table td .row,
  #mx-modal-queue #mx-reports-table td .folder-actions,
  #mx-modal-queue #mx-reports-table td:last-child {
    gap: 6px !important;
  }
  #mx-modal-queue #mx-reports-table td button,
  #mx-modal-queue #mx-reports-table td a.as-btn {
    width: 100% !important;
    min-height: 38px !important;
    font-size: 12px !important;
  }
  #mx-modal-queue .modal-content.large > .hint.mt {
    margin: 12px 10px !important;
    padding: 10px !important;
    border-radius: 12px;
    background: rgba(14, 35, 59, .38);
    border: 1px solid rgba(96,165,250,.12);
    font-size: 12px;
    line-height: 1.35;
  }
  #mx-modal-queue .modal-content.large > .row.mt:last-child {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 18 !important;
    margin: 0 !important;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    border-top: 1px solid rgba(96,165,250,.16) !important;
    background: rgba(9, 19, 36, .98) !important;
    backdrop-filter: blur(8px);
  }
  #mx-modal-queue .modal-content.large > .row.mt:last-child .hint {
    text-align: center;
    padding: 4px 0;
  }
}
@media (max-width: 420px) {
  #mx-modal-queue .mx-date-filter-row,
  #mx-modal-queue #mx-queue-kpis {
    grid-template-columns: 1fr !important;
  }
  #mx-modal-queue #mx-reports-table td {
    grid-template-columns: 1fr !important;
  }
  #mx-modal-queue #mx-reports-table td::before {
    margin-bottom: -3px;
  }
}
@media (max-width: 720px) {
  #mx-modal-queue #mx-reports-table {
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* Maxim queue mobile: bulk actions are not sticky; they must not cover report cards. */
@media (max-width: 720px) {
  #mx-modal-queue .modal-content.large {
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }
  #mx-modal-queue .modal-content.large > .row.mt:last-child {
    position: static !important;
    bottom: auto !important;
    z-index: auto !important;
    margin: 12px 10px 18px !important;
    padding: 10px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(96,165,250,.16) !important;
    background: rgba(7, 18, 36, .74) !important;
    backdrop-filter: none !important;
  }
}

/* Maxim mobile rest fix: remove redundant smart table and cardify registrations. */
@media (max-width: 720px) {
  #mx-modal-smart-events #mx-smart-events-table {
    display: none !important;
  }
  #mx-modal-smart-events > .modal-content.large > .hint.mt {
    margin: 12px 10px 18px !important;
  }
  #mx-modal-registrations #mx-reg-table {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 12px 10px 18px !important;
    border: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    white-space: normal !important;
    box-sizing: border-box !important;
  }
  #mx-modal-registrations #mx-reg-table thead {
    display: none !important;
  }
  #mx-modal-registrations #mx-reg-table tbody {
    display: grid !important;
    gap: 10px !important;
  }
  #mx-modal-registrations #mx-reg-table tr {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    padding: 12px !important;
    border-radius: 14px !important;
    background: rgba(7, 18, 36, .74) !important;
    border: 1px solid rgba(96,165,250,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  }
  #mx-modal-registrations #mx-reg-table td {
    display: grid !important;
    grid-template-columns: 94px 1fr !important;
    gap: 8px !important;
    align-items: start !important;
    padding: 0 !important;
    border: 0 !important;
    color: #dbeafe !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  #mx-modal-registrations #mx-reg-table td::before {
    color: #93c5fd;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  #mx-modal-registrations #mx-reg-table td:nth-child(1)::before { content: 'ID'; }
  #mx-modal-registrations #mx-reg-table td:nth-child(2)::before { content: 'ФИО'; }
  #mx-modal-registrations #mx-reg-table td:nth-child(3)::before { content: 'Телефон'; }
  #mx-modal-registrations #mx-reg-table td:nth-child(4)::before { content: 'Пароль'; }
  #mx-modal-registrations #mx-reg-table td:nth-child(5)::before { content: 'Статус'; }
  #mx-modal-registrations #mx-reg-table td:nth-child(6)::before { content: 'Создана'; }
  #mx-modal-registrations #mx-reg-table td:nth-child(7)::before { content: 'Действия'; }
  #mx-modal-registrations #mx-reg-table td button {
    width: 100% !important;
    min-height: 38px !important;
    font-size: 12px !important;
    margin-top: 4px;
  }
  #mx-modal-registrations #mx-reg-table td[colspan] {
    display: block !important;
    text-align: center !important;
  }
  #mx-modal-registrations #mx-reg-table td[colspan]::before {
    content: '' !important;
    display: none !important;
  }
}
@media (max-width: 420px) {
  #mx-modal-registrations #mx-reg-table td {
    grid-template-columns: 1fr !important;
  }
}

/* EVA operator assistant MVP */
.eva-assist-box {
  border: 1px solid rgba(96, 165, 250, 0.38);
  background: rgba(15, 23, 42, 0.72);
  color: #e5e7eb;
  border-radius: 12px;
  padding: 10px;
}
.eva-draft-btn { border-color: #60a5fa !important; color: #bfdbfe !important; }
.eva-draft-result {
  margin-top: 8px;
  padding: 8px;
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.26);
}
.eva-draft-result ul { margin: 6px 0 0 18px; padding: 0; color: #fde68a; }

/* EVA button moved to episode actions row */
.episode-actions-row .eva-draft-btn {
  margin-left: auto;
  min-width: 210px;
  border-color: #60a5fa !important;
  color: #bfdbfe !important;
  background: rgba(15, 23, 42, 0.72) !important;
}
.eva-draft-status { margin-top: 6px; text-align: right; }

.eva-workflow-mode {
  display: inline-flex;
  align-items: center;
  margin-top: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.14);
  color: #bfdbfe;
  border: 1px solid rgba(96, 165, 250, 0.28);
  font-weight: 700;
}

@media (max-width: 720px) {
  .episode-actions-row .eva-draft-btn { margin-left: 0; width: 100%; }
  .eva-draft-status { text-align: left; }
}

/* EVA candidates modal */
.eva-candidates-list { display: grid; gap: 10px; }
.eva-candidate-card {
  border: 1px solid rgba(96, 165, 250, 0.35);
  border-radius: 12px;
  padding: 10px;
  background: rgba(15, 23, 42, 0.78);
  color: #e5e7eb;
}
.eva-candidate-card .eva-candidate-title { font-weight: 800; color: #bfdbfe; }
.eva-candidate-card .eva-candidate-meta { color: #cbd5e1; font-size: 13px; margin-top: 4px; }
.eva-candidate-card .eva-candidate-actions { margin-top: 8px; display: flex; gap: 8px; flex-wrap: wrap; }
.eva-candidates-intro {
  font-weight: 800;
  color: #e5e7eb;
  margin-bottom: 8px;
}
.eva-choice-buttons {
  display: grid;
  gap: 10px;
}
.eva-choice-button {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
  font-size: 15px;
  line-height: 1.25;
  padding: 12px 14px;
}
.eva-guidance-box {
  border: 1px solid rgba(250, 204, 21, 0.35);
  border-radius: 12px;
  padding: 10px 12px;
  background: rgba(120, 53, 15, 0.18);
  color: #fef3c7;
}
.eva-guidance-box ol {
  margin: 8px 0 0 20px;
  padding: 0;
}
.eva-guidance-box li { margin: 5px 0; }

/* EVA candidates must appear above the incident editor modal */
#eva-candidates-modal {
  z-index: 2600 !important;
}
#eva-candidates-modal .modal-content {
  position: relative;
  z-index: 2601 !important;
}

/* Maxim queue: return-report dialog must appear above the ready-reports modal. */
#mx-modal-return-report.mx-dashboard-modal {
  z-index: 2450;
}

/* Customer dashboard MVP: decision cockpit for EVAS clients. */
body.customer-dashboard-bg header.customer-header {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 22px 28px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
  background: linear-gradient(135deg, rgba(4, 21, 32, 0.86), rgba(8, 31, 44, 0.72));
  backdrop-filter: blur(16px);
}
.customer-eyebrow { color: #67e8f9; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; font-weight: 800; }
.customer-header-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.customer-main { max-width: 1480px; margin: 0 auto; padding: 22px; display: grid; gap: 16px; }
.customer-hero-card { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr); gap: 20px; padding: 28px !important; background: linear-gradient(135deg, rgba(7, 34, 50, .92), rgba(11, 48, 60, .78)) !important; }
.customer-hero-card::after { content: ''; position: absolute; inset: auto -80px -130px auto; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(20, 184, 166, .25), transparent 62%); pointer-events: none; }
.customer-badge, .customer-pill { display: inline-flex; align-items: center; width: fit-content; border: 1px solid rgba(103, 232, 249, .28); background: rgba(8, 145, 178, .16); color: #a5f3fc; border-radius: 999px; padding: 6px 10px; font-size: 12px; font-weight: 800; }
.customer-hero-copy h2 { font-size: clamp(30px, 4.2vw, 58px); line-height: .98; margin: 16px 0 12px; max-width: 980px; }
.customer-hero-text { font-size: 16px; max-width: 760px; }
.customer-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.customer-health-panel { position: relative; z-index: 1; border: 1px solid rgba(148, 163, 184, .18); border-radius: 24px; padding: 20px; background: rgba(2, 12, 24, .48); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
.customer-health-title { color: #e2e8f0; font-weight: 900; margin-bottom: 14px; }
.customer-progress { height: 12px; background: rgba(15, 23, 42, .72); border-radius: 999px; overflow: hidden; border: 1px solid rgba(148, 163, 184, .18); }
.customer-progress span { display: block; height: 100%; background: linear-gradient(90deg, #22c55e, #06b6d4); border-radius: inherit; box-shadow: 0 0 24px rgba(34, 197, 94, .35); }
.customer-health-grid { display: grid; gap: 10px; margin-top: 18px; }
.customer-health-grid div { padding: 13px; border-radius: 16px; background: rgba(15, 23, 42, .55); border: 1px solid rgba(148, 163, 184, .14); }
.customer-health-grid b { display: block; color: #f8fafc; font-size: 19px; }
.customer-health-grid span { color: #94a3b8; font-size: 13px; }
.customer-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.customer-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(320px, .55fr); gap: 16px; }
.customer-layout-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.customer-control-card, .customer-decision-card, .customer-process-card, .customer-proof-card, .customer-roi-card, .customer-onboarding-card { background: linear-gradient(135deg, rgba(9, 31, 48, .86), rgba(8, 24, 40, .76)) !important; }
.customer-controls-list { display: grid; gap: 12px; }
.customer-control { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 15px; border-radius: 18px; border: 1px solid rgba(148, 163, 184, .16); background: rgba(15, 23, 42, .48); cursor: pointer; transition: transform .16s ease, border-color .16s ease, background .16s ease; }
.customer-control:hover { transform: translateY(-1px); border-color: rgba(103, 232, 249, .38); background: rgba(15, 42, 58, .62); }
.customer-control.selected { border-color: rgba(34, 197, 94, .42); box-shadow: 0 0 0 1px rgba(34,197,94,.08), 0 18px 60px rgba(8,47,73,.22); }
.customer-control input { margin-top: 4px; accent-color: #22c55e; }
.customer-control b { display: block; color: #f8fafc; margin-bottom: 4px; }
.customer-control small { display: block; color: #a7b3c4; line-height: 1.42; }
.customer-control em { font-style: normal; color: #a5f3fc; background: rgba(6, 182, 212, .12); border: 1px solid rgba(103,232,249,.16); padding: 4px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.customer-checklist, .customer-timeline { display: grid; gap: 12px; margin-top: 14px; }
.customer-checklist div, .customer-timeline div, .customer-onboarding-grid div { display: grid; grid-template-columns: 36px minmax(0,1fr); gap: 10px; align-items: start; padding: 12px; border-radius: 16px; background: rgba(15, 23, 42, .46); border: 1px solid rgba(148,163,184,.13); }
.customer-checklist b, .customer-timeline b { width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; background: rgba(20,184,166,.17); color: #99f6e4; }
.customer-note { margin-top: 14px; padding: 14px; border-radius: 16px; background: rgba(34, 197, 94, .10); border: 1px solid rgba(34, 197, 94, .18); color: #d1fae5; }
.customer-proof-card ul { color: #cbd5e1; line-height: 1.75; padding-left: 20px; }
.customer-roi-row { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid rgba(148,163,184,.12); color: #cbd5e1; }
.customer-roi-row b { color: #f8fafc; text-align: right; }
.customer-onboarding-card { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 18px; align-items: start; }
.customer-onboarding-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.customer-onboarding-grid div { grid-template-columns: 1fr; }
.customer-onboarding-grid b { color: #f8fafc; }
.customer-onboarding-grid span { color: #a7b3c4; }
@media (max-width: 980px) {
  body.customer-dashboard-bg header.customer-header, .customer-hero-card, .customer-layout, .customer-layout-3, .customer-onboarding-card { grid-template-columns: 1fr; }
  body.customer-dashboard-bg header.customer-header { align-items: stretch; }
  .customer-kpi-grid, .customer-onboarding-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .customer-main { padding: 12px; }
  .customer-kpi-grid, .customer-onboarding-grid { grid-template-columns: 1fr; }
  .customer-control { grid-template-columns: 24px minmax(0, 1fr); }
  .customer-control em { grid-column: 2; width: fit-content; }
}

/* Customer dashboard v2 — simplified decision cockpit with modal details. */
body.customer-dashboard-v2 { --cv2-bg: #06111d; --cv2-card: rgba(10, 24, 40, .78); --cv2-card2: rgba(8, 35, 48, .72); --cv2-line: rgba(148, 163, 184, .15); --cv2-text: #f8fafc; --cv2-muted: #a8b4c5; --cv2-cyan: #22d3ee; --cv2-green: #34d399; }
body.customer-dashboard-v2::before { content: ''; position: fixed; inset: 0; background: radial-gradient(circle at 24% 18%, rgba(34, 211, 238, .13), transparent 28%), radial-gradient(circle at 82% 4%, rgba(52, 211, 153, .10), transparent 24%), linear-gradient(180deg, rgba(2, 6, 23, .24), rgba(2, 6, 23, .72)); pointer-events: none; z-index: -1; }
.customer-topbar-v2 { max-width: 1180px; margin: 0 auto; padding: 20px 22px 14px !important; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: transparent !important; border: 0 !important; }
.customer-topbar-v2 h1 { margin: 2px 0 3px; font-size: 26px; letter-spacing: -.02em; }
.customer-topbar-v2 p { margin: 0; color: var(--cv2-muted); max-width: 620px; }
.customer-shell-v2 { max-width: 1180px; margin: 0 auto; padding: 14px 22px 40px; display: grid; gap: 16px; }
.customer-hero-v2 { display: grid; grid-template-columns: minmax(0, 1.2fr) 340px; gap: 16px; align-items: stretch; }
.customer-hero-main-v2, .customer-focus-card-v2, .customer-summary-tile-v2, .customer-decision-strip-v2, .customer-modal-content-v2 { border: 1px solid var(--cv2-line); background: linear-gradient(135deg, rgba(11, 27, 45, .82), rgba(5, 18, 31, .76)); box-shadow: 0 20px 80px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter: blur(14px); }
.customer-hero-main-v2 { border-radius: 24px; padding: 34px; min-height: 310px; display: flex; flex-direction: column; justify-content: center; }
.customer-hero-main-v2 h2 { margin: 14px 0 12px; max-width: 760px; font-size: clamp(36px, 5.2vw, 68px); line-height: .94; letter-spacing: -.055em; color: var(--cv2-text); }
.customer-hero-main-v2 p { max-width: 680px; color: #cbd5e1; font-size: 17px; line-height: 1.55; }
.customer-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.customer-focus-card-v2 { border-radius: 24px; padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; position: relative; overflow: hidden; }
.customer-focus-card-v2::before { content: ''; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -100px; top: -100px; background: radial-gradient(circle, rgba(34,211,238,.28), transparent 64%); }
.customer-focus-card-v2 span { color: var(--cv2-cyan); font-weight: 900; text-transform: uppercase; font-size: 11px; letter-spacing: .12em; }
.customer-focus-card-v2 b { display: block; position: relative; margin: 12px 0; font-size: 27px; line-height: 1.05; color: var(--cv2-text); }
.customer-focus-card-v2 p { position: relative; margin: 0; color: var(--cv2-muted); line-height: 1.48; }
.customer-summary-grid-v2 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.customer-summary-tile-v2 { text-align: left; border-radius: 18px; padding: 18px; cursor: pointer; color: var(--cv2-text); transition: transform .16s ease, border-color .16s ease, background .16s ease; }
.customer-summary-tile-v2:hover { transform: translateY(-2px); border-color: rgba(34, 211, 238, .38); background: linear-gradient(135deg, rgba(13, 43, 60, .86), rgba(6, 22, 36, .82)); }
.customer-summary-tile-v2 span { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 12px; background: rgba(34, 211, 238, .12); color: #a5f3fc; font-weight: 900; margin-bottom: 14px; }
.customer-summary-tile-v2 b { display: block; font-size: 18px; margin-bottom: 6px; }
.customer-summary-tile-v2 small { display: block; color: var(--cv2-muted); line-height: 1.42; }
.customer-decision-strip-v2 { border-radius: 22px; padding: 22px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; }
.customer-decision-strip-v2 h2 { margin: 10px 0 8px; font-size: 30px; }
.customer-decision-strip-v2 p { margin: 0; max-width: 760px; color: var(--cv2-muted); line-height: 1.5; }
.customer-mini-metrics-v2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; min-width: 430px; }
.customer-mini-metrics-v2 div { border: 1px solid rgba(148,163,184,.12); background: rgba(15, 23, 42, .42); border-radius: 16px; padding: 14px; }
.customer-mini-metrics-v2 b { display: block; color: var(--cv2-text); font-size: 18px; }
.customer-mini-metrics-v2 span { color: var(--cv2-muted); font-size: 12px; }
.customer-modal-v2 { z-index: 2600; }
.customer-modal-v2 .modal-content.large { max-width: min(980px, 94vw); }
.customer-modal-content-v2 { border-radius: 24px !important; padding: 22px !important; }
.customer-modal-content-v2 .modal-header { align-items: flex-start; border-bottom: 1px solid var(--cv2-line); padding-bottom: 14px; margin-bottom: 16px; }
.customer-modal-content-v2 h3 { margin-bottom: 4px; font-size: 26px; }
.customer-modal-grid-v2 { display: grid; gap: 12px; }
.customer-control-v2 { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 16px; border-radius: 18px; border: 1px solid rgba(148,163,184,.14); background: rgba(15,23,42,.46); }
.customer-control-v2.selected { border-color: rgba(52, 211, 153, .44); background: rgba(6, 78, 59, .18); }
.customer-control-v2 input { margin-top: 3px; accent-color: var(--cv2-green); }
.customer-control-v2 b { display: block; color: var(--cv2-text); margin-bottom: 4px; }
.customer-control-v2 small { display: block; color: var(--cv2-muted); line-height: 1.42; }
.customer-control-v2 em { font-style: normal; padding: 5px 9px; border-radius: 999px; background: rgba(34,211,238,.11); color: #a5f3fc; font-size: 11px; font-weight: 900; }
.customer-modal-note-v2, .customer-roi-compact-v2 { margin-top: 14px; padding: 14px; border-radius: 16px; background: rgba(34, 197, 94, .10); border: 1px solid rgba(34, 197, 94, .18); color: #d1fae5; }
.customer-flow-v2, .customer-proof-grid-v2, .customer-pilot-grid-v2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.customer-flow-v2 div, .customer-proof-grid-v2 div, .customer-pilot-grid-v2 div { padding: 17px; border-radius: 18px; background: rgba(15,23,42,.48); border: 1px solid rgba(148,163,184,.13); }
.customer-flow-v2 b { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 13px; background: rgba(34,211,238,.12); color: #a5f3fc; margin-bottom: 12px; }
.customer-proof-grid-v2 b, .customer-pilot-grid-v2 b { display: block; color: var(--cv2-text); font-size: 20px; margin-bottom: 6px; }
.customer-flow-v2 span, .customer-proof-grid-v2 span, .customer-pilot-grid-v2 span { color: var(--cv2-muted); line-height: 1.45; }
.customer-roi-compact-v2 span { display: block; color: #86efac; font-weight: 900; margin-bottom: 4px; }
.customer-roi-compact-v2 b { color: #ecfdf5; }
@media (max-width: 980px) {
  .customer-topbar-v2, .customer-hero-v2, .customer-decision-strip-v2 { grid-template-columns: 1fr; flex-direction: column; align-items: stretch; }
  .customer-summary-grid-v2, .customer-mini-metrics-v2 { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
}
@media (max-width: 640px) {
  .customer-shell-v2 { padding: 10px 12px 28px; }
  .customer-hero-main-v2 { padding: 24px; min-height: auto; }
  .customer-summary-grid-v2, .customer-mini-metrics-v2, .customer-flow-v2, .customer-proof-grid-v2, .customer-pilot-grid-v2 { grid-template-columns: 1fr; }
  .customer-control-v2 { grid-template-columns: 24px minmax(0, 1fr); }
  .customer-control-v2 em { grid-column: 2; width: fit-content; }
}

/* Customer dashboard v3 — calmer executive cabinet, less landing-page noise. */
body.customer-dashboard-v3 {
  --cv2-bg: #07111d;
  --cv2-card: rgba(8, 20, 34, .82);
  --cv2-card2: rgba(9, 27, 43, .66);
  --cv2-line: rgba(129, 153, 178, .16);
  --cv2-text: #f8fafc;
  --cv2-muted: #aebacc;
  --cv2-cyan: #66d9e8;
  --cv2-green: #8bffd1;
}
body.customer-dashboard-v3::before {
  background:
    radial-gradient(circle at 78% 2%, rgba(34, 211, 238, .13), transparent 25%),
    radial-gradient(circle at 4% 82%, rgba(244, 63, 94, .07), transparent 28%),
    linear-gradient(180deg, rgba(4, 10, 20, .32), rgba(2, 6, 23, .86));
}
body.customer-dashboard-v3 .customer-topbar-v2 { padding-top: 18px !important; }
body.customer-dashboard-v3 .customer-eyebrow,
body.customer-dashboard-v3 .customer-badge,
body.customer-dashboard-v3 .customer-pill {
  background: rgba(102, 217, 232, .09);
  border: 1px solid rgba(102, 217, 232, .16);
  color: #b8f4fb;
}
body.customer-dashboard-v3 .customer-hero-v2 { grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; }
body.customer-dashboard-v3 .customer-hero-main-v2,
body.customer-dashboard-v3 .customer-focus-card-v2,
body.customer-dashboard-v3 .customer-summary-tile-v2,
body.customer-dashboard-v3 .customer-decision-strip-v2,
body.customer-dashboard-v3 .customer-modal-content-v2 {
  background: linear-gradient(145deg, rgba(9, 22, 37, .88), rgba(6, 16, 29, .82));
  border-color: rgba(124, 151, 178, .17);
  box-shadow: 0 18px 60px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}
body.customer-dashboard-v3 .customer-hero-main-v2 { min-height: 330px; padding: 42px 44px; }
body.customer-dashboard-v3 .customer-hero-main-v2 h2 {
  max-width: 720px;
  font-size: clamp(34px, 4.1vw, 56px);
  line-height: 1.03;
  letter-spacing: -.045em;
  text-wrap: balance;
}
body.customer-dashboard-v3 .customer-hero-main-v2 p { max-width: 650px; font-size: 16px; color: #c7d2df; }
body.customer-dashboard-v3 .customer-header-actions .primary,
body.customer-dashboard-v3 .customer-hero-actions .primary {
  background: linear-gradient(135deg, #f04454, #ff6b5d);
  box-shadow: 0 12px 30px rgba(240, 68, 84, .18);
}
body.customer-dashboard-v3 .customer-header-actions .ghost,
body.customer-dashboard-v3 .customer-hero-actions .ghost {
  background: rgba(9, 20, 35, .68);
  border-color: rgba(148, 163, 184, .20);
}
body.customer-dashboard-v3 .customer-focus-card-v2 { padding: 28px; justify-content: center; }
body.customer-dashboard-v3 .customer-focus-card-v2::before { opacity: .55; right: -120px; top: -120px; }
body.customer-dashboard-v3 .customer-focus-card-v2 span { color: #93e8f2; }
body.customer-dashboard-v3 .customer-focus-card-v2 b { font-size: 25px; line-height: 1.14; margin: 14px 0 18px; }
.customer-benefit-list-v3 { display: grid; gap: 10px; padding: 0; margin: 0; list-style: none; }
.customer-benefit-list-v3 li { position: relative; padding-left: 23px; color: #cbd5e1; line-height: 1.4; }
.customer-benefit-list-v3 li::before { content: '✓'; position: absolute; left: 0; top: 0; color: #8bffd1; font-weight: 900; }
body.customer-dashboard-v3 .customer-summary-grid-v2 { gap: 14px; }
body.customer-dashboard-v3 .customer-summary-tile-v2 {
  background: rgba(9, 22, 37, .76);
  border-radius: 20px;
  min-height: 150px;
  padding: 20px;
}
body.customer-dashboard-v3 .customer-summary-tile-v2:hover {
  background: linear-gradient(145deg, rgba(12, 34, 52, .88), rgba(8, 22, 38, .84));
  border-color: rgba(102, 217, 232, .34);
}
body.customer-dashboard-v3 .customer-summary-tile-v2 span {
  width: auto;
  height: auto;
  place-items: start;
  background: transparent;
  color: #79dcea;
  margin-bottom: 18px;
  font-size: 12px;
  letter-spacing: .1em;
}
body.customer-dashboard-v3 .customer-summary-tile-v2 b { font-size: 20px; }
body.customer-dashboard-v3 .customer-summary-tile-v2 small { color: #abb8c8; font-size: 13px; }
body.customer-dashboard-v3 .customer-decision-strip-v2 { padding: 26px; }
body.customer-dashboard-v3 .customer-mini-metrics-v2 div { background: rgba(5, 13, 26, .42); }
@media (max-width: 900px) {
  body.customer-dashboard-v3 .customer-hero-v2 { grid-template-columns: 1fr; }
  body.customer-dashboard-v3 .customer-hero-main-v2 { padding: 28px; min-height: auto; }
}

/* Customer dashboard v3 refinements after visual check. */
body.customer-dashboard-v3 .customer-eyebrow {
  display: inline-flex;
  width: fit-content;
  padding: 0;
  background: transparent;
  border: 0;
  color: #7ee8f4;
}
body.customer-dashboard-v3 .customer-topbar-v2 {
  padding: 16px 22px 12px !important;
  border-bottom: 1px solid rgba(124, 151, 178, .08) !important;
}
body.customer-dashboard-v3 .customer-topbar-v2 h1 { font-size: 22px; }
body.customer-dashboard-v3 .customer-topbar-v2 p { font-size: 15px; max-width: 720px; }
body.customer-dashboard-v3 .customer-hero-main-v2 { min-height: 290px; padding: 36px 44px; }
body.customer-dashboard-v3 .customer-hero-main-v2 h2 {
  max-width: 690px;
  font-size: clamp(32px, 3.55vw, 48px);
  line-height: 1.08;
  letter-spacing: -.04em;
}
body.customer-dashboard-v3 .customer-hero-main-v2 p { max-width: 720px; }
body.customer-dashboard-v3 .customer-focus-card-v2 b { font-size: 23px; }
body.customer-dashboard-v3 .customer-summary-tile-v2 { min-height: 132px; }
body.customer-dashboard-v3 .customer-decision-strip-v2 h2 { font-size: 28px; }

/* Customer practical dashboard — connected customer workspace, not a landing page. */
body.customer-dashboard-practical .customer-work-topbar { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(18px); background: rgba(6, 17, 29, .86) !important; }
body.customer-dashboard-practical .customer-workspace { gap: 18px; }
.customer-status-grid { display: grid; grid-template-columns: 1.05fr .8fr .8fr 1.15fr; gap: 14px; }
.customer-status-card,
.customer-panel {
  border: 1px solid rgba(124,151,178,.16);
  background: linear-gradient(145deg, rgba(9,22,37,.88), rgba(6,16,29,.82));
  box-shadow: 0 16px 50px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.035);
  border-radius: 22px;
  padding: 20px;
}
.customer-status-card span { display: block; color: #9eeaf4; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; font-weight: 900; margin-bottom: 10px; }
.customer-status-card b { display: block; color: #f8fafc; font-size: 30px; line-height: 1.05; letter-spacing: -.03em; }
.customer-status-card small { display: block; color: #aebacc; margin-top: 8px; line-height: 1.4; }
.customer-status-card.primary-status { border-color: rgba(248,113,113,.28); background: linear-gradient(145deg, rgba(42,18,28,.88), rgba(10,18,32,.84)); }
.customer-status-card.primary-status span { color: #fecdd3; }
.customer-status-card.brand-note { background: radial-gradient(circle at 92% 0%, rgba(34,211,238,.18), transparent 36%), linear-gradient(145deg, rgba(9,22,37,.88), rgba(6,16,29,.82)); }
.customer-status-card.brand-note b { font-size: 22px; line-height: 1.16; }
.customer-main-grid { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 18px; align-items: start; }
.customer-bottom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.customer-panel-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; margin-bottom: 16px; }
.customer-panel-head.compact { align-items: center; }
.customer-panel-head h2 { margin: 0; color: #f8fafc; font-size: 24px; letter-spacing: -.025em; }
.customer-panel-head p { margin: 5px 0 0; color: #aebacc; }
.customer-event-list { display: grid; gap: 10px; }
.customer-event-row,
.customer-report-row,
.customer-check-row {
  border: 1px solid rgba(124,151,178,.13);
  background: rgba(5,13,26,.38);
  border-radius: 16px;
  padding: 14px;
}
.customer-event-row { display: flex; justify-content: space-between; gap: 14px; align-items: center; }
.customer-event-row b,
.customer-report-row b,
.customer-check-row b { display: block; color: #f8fafc; margin-bottom: 4px; }
.customer-event-row span,
.customer-report-row span,
.customer-check-row small { display: block; color: #aebacc; line-height: 1.35; }
.customer-event-row em { font-style: normal; white-space: nowrap; border-radius: 999px; padding: 6px 10px; font-size: 12px; font-weight: 900; }
.customer-event-row.attention em { background: rgba(248,113,113,.12); color: #fecdd3; border: 1px solid rgba(248,113,113,.22); }
.customer-event-row.done em { background: rgba(34,197,94,.11); color: #bbf7d0; border: 1px solid rgba(34,197,94,.18); }
.customer-checks-panel { display: grid; gap: 10px; }
.customer-check-row { width: 100%; color: inherit; text-align: left; display: grid; grid-template-columns: 12px 1fr; gap: 12px; align-items: center; cursor: pointer; }
.customer-check-row span { width: 10px; height: 10px; border-radius: 999px; background: #64748b; box-shadow: 0 0 0 4px rgba(100,116,139,.12); }
.customer-check-row.selected span { background: #8bffd1; box-shadow: 0 0 0 4px rgba(139,255,209,.12); }
.customer-check-row:hover { border-color: rgba(102,217,232,.30); }
.customer-report-row + .customer-report-row { margin-top: 10px; }
.customer-setup-list { display: grid; gap: 10px; }
.customer-setup-list span { padding: 12px 14px; border-radius: 14px; background: rgba(5,13,26,.38); border: 1px solid rgba(124,151,178,.13); color: #cbd5e1; }
.customer-setup-list .done::before { content: '✓ '; color: #8bffd1; font-weight: 900; }
.customer-setup-list .progress::before { content: '• '; color: #fbbf24; font-weight: 900; }
body.customer-dashboard-practical .customer-hero-v2,
body.customer-dashboard-practical .customer-summary-grid-v2,
body.customer-dashboard-practical .customer-decision-strip-v2 { display: none; }
body.customer-dashboard-practical .small { padding: 8px 11px; font-size: 13px; }
@media (max-width: 980px) {
  .customer-status-grid, .customer-main-grid, .customer-bottom-grid { grid-template-columns: 1fr; }
  .customer-event-row { align-items: flex-start; flex-direction: column; }
}

/* Practical dashboard refinement: active checks are work rows, not promo blocks. */
body.customer-dashboard-practical .customer-check-row,
body.customer-dashboard-practical .customer-check-row.selected {
  background: rgba(5,13,26,.42);
  border-color: rgba(124,151,178,.14);
  border-radius: 16px;
}
body.customer-dashboard-practical .customer-check-row:hover,
body.customer-dashboard-practical .customer-check-row.selected:hover {
  background: rgba(10, 27, 43, .62);
  border-color: rgba(102,217,232,.30);
}
body.customer-dashboard-practical .customer-check-row.selected b,
body.customer-dashboard-practical .customer-check-row b { color: #f8fafc; }
body.customer-dashboard-practical .customer-check-row.selected small,
body.customer-dashboard-practical .customer-check-row small { color: #aebacc; }