.ops-container {
  max-width: min(1760px, calc(100vw - 18px));
  margin: 0 auto;
  padding: 28px 18px 42px;
}

/* DashControl 2027 staff console refinement */
body.has-dash-menu.staff-mode .main-header {
  max-width: min(1480px, calc(100vw - 24px));
  margin: 10px auto 14px;
  border-radius: 8px;
}

body.has-dash-menu.staff-mode .hero-main {
  width: 100%;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border-radius: 8px;
}

body.has-dash-menu.staff-mode .header-titles h1 {
  margin: 3px 0 2px;
  font-size: clamp(1.55rem, 2.4vw, 2.2rem);
  letter-spacing: -0.03em;
}

body.has-dash-menu.staff-mode .header-titles .txt-muted {
  max-width: 860px;
  font-size: 0.88rem;
  line-height: 1.35;
}

body.has-dash-menu.staff-mode .hero-kicker {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

body.has-dash-menu.staff-mode .staff-hero-tools {
  flex-wrap: nowrap;
}

body.has-dash-menu.staff-mode .user-badge {
  min-height: 48px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
}

body.has-dash-menu.staff-mode .panel-inner {
  border-radius: 8px;
}

body.has-dash-menu.staff-mode .queue-layout {
  gap: 14px;
}

.main-header {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 18px;
}

.hero-main,
.hero-side,
.panel-inner {
  border-radius: var(--radius-xl);
  border: 1px solid rgba(255, 255, 255, 0.74);
  background:
    linear-gradient(135deg, rgba(95, 130, 230, 0.08), transparent 42%),
    rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-md);
}

.hero-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  padding: 22px 24px;
}

.hero-side {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 22px;
}

.logo-wrapper {
  flex: 0 0 auto;
}

.company-logo {
  width: 76px;
  height: 76px;
  object-fit: contain;
  border-radius: 22px;
  border: 2px solid rgba(95, 130, 230, 0.16);
  background: #ffffff;
  padding: 8px;
  box-shadow: 0 16px 34px rgba(95, 130, 230, 0.16);
}

.header-titles {
  min-width: 0;
}

.hero-kicker {
  display: inline-flex;
  align-items: center;
  padding: 7px 11px;
  border-radius: 999px;
  background: var(--primary-accent-soft);
  border: 1px solid #dce6ff;
}

.header-titles h1 {
  margin: 10px 0 8px;
  font-size: clamp(2.1rem, 3.8vw, 3.15rem);
  line-height: 0.98;
  letter-spacing: -0.06em;
}

.header-titles p {
  margin: 0;
  max-width: 760px;
  line-height: 1.6;
  font-weight: 650;
}

.header-pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.header-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 11px;
  border-radius: 999px;
  background: #f5f8ff;
  border: 1px solid var(--border);
  color: var(--text-soft);
  font-size: 0.78rem;
  font-weight: 800;
}

.hero-side strong {
  color: var(--text-primary);
  font-size: 1.05rem;
  line-height: 1.45;
}

.hero-side .txt-muted {
  line-height: 1.6;
}

.staff-hero-tools {
  display: none;
  margin-left: auto;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.user-badge {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: #ffffff;
  box-shadow: var(--shadow-sm);
}

.session-avatar {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #ffffff;
  background: linear-gradient(135deg, var(--primary-accent), var(--secondary-accent));
  font-size: 0.92rem;
  font-weight: 950;
  letter-spacing: -0.04em;
}

.session-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.user-copy {
  display: grid;
  gap: 2px;
}

.top-action-buttons {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

body.staff-mode .main-header {
  grid-template-columns: 1fr;
}

body.staff-mode .hero-side {
  display: none;
}

body.staff-mode .staff-hero-tools {
  display: flex;
}

body.staff-mode .hero-main {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

body.staff-mode .header-titles h1 {
  font-size: clamp(1.8rem, 2.8vw, 2.35rem);
}

.public-panel {
  margin-bottom: 16px;
}

.panel-inner {
  display: grid;
  gap: 16px;
  padding: 22px;
}

.public-shell {
  display: grid;
  gap: 16px;
}

.public-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}

.public-head h2 {
  margin: 4px 0 0;
  font-size: 1.5rem;
  letter-spacing: -0.03em;
}

.public-copy {
  margin-top: 8px;
  max-width: 620px;
  line-height: 1.58;
}

.public-actions {
  justify-content: flex-end;
}

.public-toolbar {
  display: grid;
}

.toolbar {
  display: flex;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: rgba(246, 248, 252, 0.92);
}

.toolbar-left {
  flex: 1 1 240px;
  min-width: 0;
}

.toolbar-left label,
.filter-inline label,
.ticket-form-field label,
.user-filter label {
  display: block;
  margin-bottom: 6px;
  color: #4b5872;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.loading-copy {
  margin: 0;
}

.public-result {
  display: grid;
  gap: 14px;
}

.badge-row {
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: none;
}

.badge-row::-webkit-scrollbar {
  display: none;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.kv {
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: #ffffff;
}

.kv .k {
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.kv .v {
  margin-top: 5px;
  color: var(--text-primary);
  font-weight: 800;
  line-height: 1.45;
  word-break: break-word;
}

.intro-bubble {
  background: #ffffff;
}

.ticket-section {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid var(--border);
  background: #ffffff;
}

.board {
  display: grid;
  grid-template-columns: minmax(420px, 31vw) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.panel {
  min-width: 0;
  min-height: 0;
}

.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
}

.panel-head h2 {
  margin: 4px 0 0;
  font-size: 1.45rem;
  letter-spacing: -0.04em;
}

.panel-copy {
  margin: 0;
  line-height: 1.5;
}

.panel-head-actions {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.panel-head-actions .panel-copy {
  max-width: 240px;
  text-align: right;
}

.admin-queue-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 132px;
  gap: 10px 12px;
  align-items: center;
}

.queue-tab-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.queue-tab {
  width: 100%;
  min-height: 46px;
  display: grid;
  justify-items: start;
  gap: 2px;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 9px 12px;
  color: var(--primary-accent-strong);
  background: #f8fbff;
  font-weight: 900;
  cursor: pointer;
}

.queue-tab span {
  color: inherit;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.queue-tab strong,
.queue-closed-trigger strong {
  color: inherit;
  font-size: 1rem;
  line-height: 1;
}

.queue-tab.active {
  color: #ffffff;
  background: linear-gradient(135deg, var(--primary-accent), var(--primary-accent-strong));
  border-color: transparent;
}

.queue-closed-trigger {
  display: grid;
  justify-items: start;
  gap: 2px;
  justify-self: end;
  min-height: 46px;
  padding: 9px 12px;
}

.queue-closed-trigger span {
  color: inherit;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 900;
}

.list-controls {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: #ffffff;
}

.list-controls.is-collapsed .toolbar,
.list-controls.is-collapsed .simple-filters {
  display: none;
}

.simple-filters {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.filter-inline {
  display: grid;
  gap: 7px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.list-controls .toolbar {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.filter-trigger {
  justify-content: space-between;
}

.filter-help {
  min-height: 1.2em;
}

.list {
  min-height: 420px;
  min-width: 0;
}

.mail-list {
  display: grid;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: #ffffff;
  overflow: hidden;
  height: 100%;
}

.mail-list-head,
.mail-row {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(150px, 0.95fr) minmax(0, 1.65fr) 110px;
  gap: 14px;
  align-items: center;
  padding: 11px 14px;
}

.mail-list-head {
  border-bottom: 1px solid var(--border);
  background: #f8fbff;
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 2;
}

.mail-row {
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  background: transparent;
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
  box-shadow: none;
}

.mail-row:last-child {
  border-bottom: 0;
}

.mail-row:hover {
  background: #f9fbff;
}

.mail-row.selected {
  background: #eef4ff;
  box-shadow: inset 3px 0 0 var(--primary-accent);
}

.mail-row.new-item {
  position: relative;
}

.mail-row.new-item::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--secondary-accent);
  transform: translateY(-50%);
}

.mail-row-col {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.mail-row-col-assigned {
  justify-items: start;
}

.mail-row-meta,
.ticket-topline,
.case-actions-summary-top,
.case-actions-summary-badges,
.case-actions-summary-meta,
.discipline-modal-actions,
.recommendation-grid,
.recommendation-dates,
.status-filter-footer,
.closed-cases-toolbar,
.closed-cases-summary,
.compact-section-title,
.modal-ticket-actions {
  display: flex;
  align-items: center;
  gap: 8px 12px;
  flex-wrap: wrap;
}

.mail-row-name,
.mail-row-title {
  color: var(--text-primary);
}

.mail-row-name {
  font-size: 0.95rem;
  line-height: 1.15;
  font-weight: 900;
}

.mail-row-date,
.mail-row-meta-text,
.mail-row-status-text {
  color: var(--text-secondary);
}

.mail-row-date {
  font-size: 0.8rem;
}

.mail-row-title {
  min-width: 0;
  font-weight: 850;
  font-size: 0.88rem;
  line-height: 1.28;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mail-row-meta-text {
  min-width: 0;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.mail-row-assigned {
  color: var(--text-primary);
  font-size: 0.86rem;
  font-weight: 900;
}

.mail-row-status-text {
  font-size: 0.76rem;
  font-weight: 700;
}

.ticket-avatar,
.ticket-avatar-compact {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #ffffff;
  background: linear-gradient(135deg, var(--primary-accent), var(--secondary-accent));
  font-weight: 900;
  letter-spacing: 0.04em;
}

.ticket-avatar img,
.ticket-avatar-compact img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.list-empty,
.closed-cases-empty {
  text-align: center;
}

.detail-shell {
  min-height: 620px;
}

.detail-empty {
  min-height: 360px;
  display: grid;
  place-items: center;
  padding: 28px;
  text-align: center;
  border: 1px dashed var(--border-strong);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.62);
}

.reader-shell {
  display: grid;
  gap: 16px;
}

.reader-topbar,
.reader-paper,
.case-actions-summary-card,
.discipline-history-strip,
.closed-case-row {
  border: 1px solid var(--border);
  border-radius: 20px;
  background: #ffffff;
  box-shadow: none;
}

.reader-topbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 18px;
}

.reader-ticket-line,
.compact-ticket-identity {
  min-width: 0;
  display: grid;
}

.compact-ticket-identity {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.compact-ticket-person {
  min-width: 0;
}

.compact-ticket-badges {
  margin-bottom: 10px;
}

.ticket-title {
  margin: 0;
  font-size: clamp(1.45rem, 2.6vw, 1.95rem);
  line-height: 1.04;
  letter-spacing: -0.04em;
}

.ticket-subtitle {
  margin-top: 4px;
  color: var(--text-secondary);
  line-height: 1.45;
}

.ticket-subtitle.subtle {
  color: var(--text-soft);
}

.subject-meta-line {
  display: flex;
  align-items: center;
  gap: 6px 10px;
  flex-wrap: wrap;
  margin-top: 10px;
  color: var(--text-secondary);
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.45;
}

.subject-meta-line span {
  display: inline-flex;
  align-items: center;
}

.subject-meta-sep {
  color: #c0c8de;
  font-weight: 900;
}

.reader-topbar-actions {
  flex: 0 0 auto;
}

.reader-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.9fr);
  gap: 16px;
}

.reader-paper {
  overflow: hidden;
}

.reader-paper-band {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 18px;
  background: #fbfcff;
  border-bottom: 1px solid var(--border);
}

.reader-paper-band span {
  color: var(--text-secondary);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reader-paper-band strong {
  color: var(--text-secondary);
  font-size: 0.82rem;
}

.reader-paper-head {
  padding: 16px 18px 0;
}

.email-label {
  display: block;
  margin-bottom: 6px;
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reader-paper-head h3 {
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.18;
  letter-spacing: -0.03em;
}

.reader-paper-body {
  padding: 18px;
}

.request-overview-card {
  display: grid;
  gap: 12px;
  padding: 0;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  background: transparent;
}

.request-overview-head h3 {
  margin: 4px 0 0;
  font-size: 1.26rem;
  line-height: 1.2;
}

.request-fact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 16px;
}

.request-fact {
  display: grid;
  gap: 3px;
  padding: 12px 0;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  background: transparent;
}

.request-fact span {
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.request-fact strong {
  color: var(--text-primary);
  line-height: 1.45;
}

.request-note {
  display: grid;
  gap: 12px;
  padding-top: 16px;
}

.reader-copy p {
  margin: 0;
  color: var(--text-soft);
  line-height: 1.72;
  white-space: pre-wrap;
  word-break: break-word;
}

.reader-side {
  display: grid;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: #ffffff;
  overflow: hidden;
}

.reader-side-card {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.reader-side-card + .reader-side-card {
  border-top: 1px solid var(--border);
}

.reader-side-kicker {
  color: var(--text-secondary);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reader-side-card strong {
  color: var(--text-primary);
}

.reader-side-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.55;
}

.reader-side-link-card a {
  color: var(--primary-accent-strong);
  font-weight: 900;
  text-decoration: none;
}

.reader-side-link-card a.btn-primary {
  color: #ffffff;
}

.compact-link-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 1161px) {
  body.staff-mode {
    overflow: hidden;
  }

  body.staff-mode .ops-container {
    height: 100vh;
    height: 100svh;
    max-height: 100vh;
    max-height: 100svh;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 12px 14px 14px;
    overflow: hidden;
  }

  body.staff-mode .main-header {
    flex: 0 0 auto;
    margin-bottom: 0;
  }

  body.staff-mode .hero-main {
    gap: 14px;
    padding: 16px 18px;
    align-items: center;
  }

  body.staff-mode .company-logo {
    width: 60px;
    height: 60px;
    border-radius: 18px;
    padding: 6px;
  }

  body.staff-mode .header-titles h1 {
    margin: 6px 0 4px;
  }

  body.staff-mode .header-titles p {
    line-height: 1.42;
    max-width: 880px;
  }

  body.staff-mode .panel-inner {
    height: 100%;
    min-height: 0;
    padding: 18px;
  }

  body.staff-mode #app {
    flex: 1 1 auto;
    min-height: 0;
    display: block;
  }

  body.staff-mode .board {
    height: 100%;
    min-height: 0;
    align-items: stretch;
  }

  body.staff-mode .panel-nav .panel-inner,
  body.staff-mode .panel-detail .panel-inner {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  body.staff-mode .panel-nav,
  body.staff-mode .panel-detail,
  body.staff-mode #detail,
  body.staff-mode .detail-shell,
  body.staff-mode .reader-shell {
    min-height: 0;
  }

  body.staff-mode .list {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }

  body.staff-mode .mail-list {
    overflow: auto;
  }

  body.staff-mode #detail {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding-right: 4px;
  }

  body.staff-mode .detail-shell {
    min-height: 0;
  }
}

.reader-thread-section {
  gap: 12px;
  border-radius: 20px;
  box-shadow: none;
}

.compact-section-title {
  justify-content: space-between;
}

.compact-section-title span {
  color: var(--text-secondary);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reader-thread {
  margin: 0;
  position: relative;
  display: grid;
  gap: 0;
}

.reader-thread::before {
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 17px;
  width: 1px;
  background: var(--border);
}

.reader-thread .thread-mail-item {
  position: relative;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  padding: 0 0 18px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.reader-thread .thread-mail-item + .thread-mail-item {
  margin-top: 2px;
}

.reader-thread .thread-mail-avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  box-shadow: 0 0 0 4px #ffffff;
}

.reader-thread .thread-mail-content {
  padding-top: 2px;
}

.reader-thread .thread-mail-item:not(:last-child) .thread-mail-content {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.reader-thread .thread-mail-copy {
  color: var(--text-soft);
  line-height: 1.72;
}

.request-overview-card .ticket-eyebrow {
  display: inline-flex;
}

.workflow-badge {
  color: #7b4fb6;
  background: #f3ebff;
  border-color: #e1d1ff;
}

.compact-status {
  color: var(--primary-accent-strong);
}

.discipline-history-strip {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
}

.discipline-modal {
  width: min(100%, 720px);
}

.discipline-modal-list {
  display: grid;
  gap: 10px;
}

.discipline-modal-row {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--card-2);
}

.discipline-modal-row strong {
  color: var(--text-primary);
}

.discipline-modal-row p {
  margin: 0;
  color: var(--text-soft);
  line-height: 1.55;
}

.case-actions-summary-card {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.case-actions-summary-top {
  justify-content: space-between;
  align-items: flex-start;
}

.case-actions-summary-top h3 {
  margin: 0 0 6px;
  font-size: 1.24rem;
  line-height: 1.2;
}

.case-actions-summary-top p {
  margin: 8px 0 0;
  color: var(--text-secondary);
}

.case-actions-summary-meta {
  padding-top: 10px;
  border-top: 1px solid var(--border);
  color: var(--text-soft);
  font-size: 0.88rem;
}

.case-summary-line {
  margin-top: 0;
}

.case-actions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.ticket-form-field {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: #ffffff;
}

.ticket-form-field-wide {
  grid-column: 1 / -1;
}

.ticket-help {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.5;
}

.recommendation-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.recommendation-grid,
.recommendation-dates {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.recommendation-dates {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.modal-ticket-actions {
  justify-content: space-between;
  padding-top: 4px;
}

.user-toolbar {
  justify-content: space-between;
}

.user-filter {
  flex: 1 1 260px;
  min-width: 0;
}

.users-area {
  overflow: auto;
}

.user-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 22px;
  overflow: hidden;
}

.user-table th,
.user-table td {
  padding: 12px 14px;
  text-align: left;
  border-bottom: 1px solid var(--border);
}

.user-table th {
  color: var(--text-secondary);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: #f8fbff;
}

.user-table tbody tr:last-child td {
  border-bottom: 0;
}

.roleSel {
  min-width: 140px;
}

.status-filter-options,
.closed-cases-list {
  display: grid;
  gap: 10px;
}

.status-option,
.closed-case-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 14px;
  cursor: pointer;
}

.status-option.checked,
.closed-case-row.checked {
  border-color: rgba(95, 130, 230, 0.34);
  background: #f8fbff;
}

.status-option-input,
.closed-case-check {
  width: 18px;
  height: 18px;
  margin-top: 2px;
}

.status-option-copy,
.closed-case-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.status-option-copy strong,
.closed-case-copy strong {
  color: var(--text-primary);
}

.closed-case-copy span,
.closed-case-copy small {
  color: var(--text-secondary);
  line-height: 1.5;
}

.closed-cases-toolbar {
  justify-content: space-between;
}

.closed-cases-summary {
  justify-content: flex-end;
}

@media (max-width: 1160px) {
  .main-header,
  .board,
  .reader-layout {
    grid-template-columns: 1fr;
  }

  .detail-shell {
    min-height: 0;
  }
}

@media (max-width: 900px) {
  .hero-main {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .staff-hero-tools {
    grid-column: 1 / -1;
    margin-left: 0;
    justify-content: flex-start;
  }

  body.staff-mode .hero-main {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ops-container {
    padding: 20px 12px 30px;
  }

  .hero-main,
  .hero-side,
  .panel-inner {
    border-radius: 24px;
  }

  .hero-main {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .public-head,
  .panel-head,
  .reader-topbar,
  .closed-cases-toolbar,
  .case-actions-summary-top {
    flex-direction: column;
    align-items: stretch;
  }

  .public-actions,
  .top-action-buttons,
  .panel-head-actions,
  .user-toolbar,
  .closed-cases-summary,
  .modal-ticket-actions {
    justify-content: stretch;
  }

  .panel-head-actions {
    justify-items: start;
  }

  .panel-head-actions .panel-copy {
    text-align: left;
    max-width: none;
  }

  .toolbar,
  .simple-filters,
  .summary-grid,
  .request-fact-grid,
  .case-actions-grid,
  .recommendation-dates {
    grid-template-columns: 1fr;
  }

  .toolbar,
  .status-filter-footer,
  .comment-actions,
  .closed-cases-summary {
    align-items: stretch;
  }

  .admin-queue-tools,
  .queue-tab-bar {
    grid-template-columns: 1fr;
  }

  .queue-closed-trigger {
    justify-self: stretch;
  }

  .btn-primary,
  .btn-outline,
  .btn-link,
  .btn-ghost,
  .btn-danger,
  .btn-logout {
    width: 100%;
  }

  .mail-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .mail-list-head {
    display: none;
  }

  .mail-row-col-assigned {
    justify-items: start;
  }

  .reader-thread-section,
  .ticket-section {
    padding: 14px;
  }
}
/* Voice workspaces: employee intake and Performance delivery */
.queue-stream-bar {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.queue-stream {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #cfe2df;
  border-radius: 14px;
  color: #173438;
  background: #f8fcfb;
  text-align: left;
  cursor: pointer;
}

.queue-stream span { min-width: 0; }
.queue-stream strong,
.queue-stream small { display: block; }
.queue-stream strong { font-size: .94rem; }
.queue-stream small { margin-top: 2px; color: #6b8084; font-size: .7rem; }
.queue-stream b {
  display: grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  border-radius: 999px;
  background: #e6f4f1;
}
.queue-stream.active {
  border-color: #34b7a2;
  background: linear-gradient(135deg, #e4f8f4, #f3fbfa);
  box-shadow: inset 3px 0 0 #12a58e;
}

.performance-delivery-inline,
.performance-delivery-buttons {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.performance-delivery-actions {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.delivery-state,
.delivery-mini {
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 5px 9px;
  font: inherit;
  font-size: .68rem;
  font-weight: 800;
  line-height: 1;
}
.delivery-state { cursor: default; }
.delivery-state[data-delivery-action="send"] { cursor: pointer; }
.delivery-pending { color: #755416; background: #fff3ce; border-color: #e7c86f; }
.delivery-sent { color: #17604f; background: #e4f6ef; border-color: #a9dccb; }
.delivery-opened { color: #175e94; background: #e5f2ff; border-color: #9fc9ec; }
.delivery-mini { color: #31545a; background: #fff; border-color: #cddedb; cursor: pointer; }
.delivery-mini.delivery-delete { color: #9c3945; }

body.voice-console-page #app .performance-delivery-inline .delivery-state {
  display: grid;
  justify-items: start;
  gap: 3px;
  min-height: 42px;
  padding: 6px 10px 7px;
  border-style: solid;
  border-width: 1px;
  border-radius: 11px;
  font-size: .66rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

body.voice-console-page #app .delivery-state-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  letter-spacing: .045em;
  text-transform: uppercase;
}

body.voice-console-page #app .delivery-state-label i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .55);
}

body.voice-console-page #app .delivery-state-time {
  color: inherit;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 0;
  opacity: .78;
  text-transform: none;
}

body.voice-console-page #app .performance-delivery-inline .delivery-opened {
  color: #0f5e98;
  border-color: #83bae6;
  background: #dceeff;
  box-shadow: inset 0 0 0 1px rgba(23, 94, 148, .06);
}

body.voice-console-page #app .performance-delivery-inline .delivery-sent {
  color: #17604f;
  border-color: #a9dccb;
  background: #e4f6ef;
}

body.voice-console-page #app .performance-delivery-inline .delivery-pending {
  color: #755416;
  border-color: #e7c86f;
  background: #fff3ce;
}

body.voice-console-page #app .performance-delivery-actions .delivery-mini {
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid #cddedb;
  border-radius: 10px;
  background: #fff;
  font-size: .66rem;
  line-height: 1;
}

body.voice-console-page #app .performance-delivery-actions .delivery-mini:hover {
  border-color: #8ebeb7;
  background: #f1faf8;
}

body.voice-console-page #app .performance-delivery-actions .delivery-delete:hover {
  border-color: #e2aab0;
  background: #fff4f5;
}

.performance-delivery-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #cde4df;
  border-radius: 14px;
  background: #f3faf8;
}
.performance-delivery-toolbar > div:first-child {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (max-width: 720px) {
  .queue-stream-bar { grid-template-columns: 1fr; }
  .performance-delivery-toolbar { align-items: flex-start; flex-direction: column; }
}