.detail-note {
  margin: -4px 0 18px;
  padding: 11px 13px;
  border-radius: 9px;
  background: #eef6ff;
  color: #426486;
  font-size: 11px;
  line-height: 1.6;
}

/* Daily operations: readable tables, compact overview and persistent actions. */
body { font-size: 14px; line-height: 1.5; }
.sidebar { background: #142238; }
.nav-item { font-size: 14px; }
.side-foot { flex-direction: column; align-items: stretch; gap: 6px; padding-top: 16px; }
.side-foot a { display: block; padding: 7px 8px; color: #c7d7eb; font-size: 13px; text-decoration: none; border-radius: 6px; }
.side-foot a:hover, .side-foot a:focus-visible { color: #fff; background: #243b57; }
.side-foot #modeBadge { align-self: flex-start; margin-bottom: 4px; font-size: 12px; }
.topbar { height: 72px; padding: 0 24px; }
.view { padding: 24px 24px 48px; }
.overview-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.overview-heading h2 { margin: 0 0 6px; font-size: 22px; }
.overview-heading p { margin: 0; color: #526174; font-size: 14px; }
.overview-heading button { flex-shrink: 0; }
.metric-grid { gap: 12px; margin: 20px 0; }
.metric { border-radius: 10px; padding: 16px 18px; box-shadow: none; }
.metric-label { font-size: 14px; }
.metric strong { font-size: 30px; margin: 10px 0 6px; }
.metric small { font-size: 12px; line-height: 1.5; }
.metric-icon { display: none; }
.content-grid { grid-template-columns: minmax(0, 1.4fr) minmax(250px, 1fr); }
.quick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.quick-grid button { text-align: left; }
.quick-grid b { font-size: 14px; }
.quick-grid small, .runtime-row, .section-title p { font-size: 13px; }
.card { border-radius: 10px; box-shadow: none; }
.stat-table th, .stat-table td, .table-card th, .table-card td { font-size: 14px; line-height: 1.55; vertical-align: top; padding: 12px; }
.stat-table th, .table-card th { font-size: 13px; background: #f5f7fa; }
.table-card button, .row-actions button { font-size: 13px; min-height: 34px; }
.row-actions { flex-wrap: wrap; align-items: flex-start; }
.admin-task-table { table-layout: fixed; min-width: 880px; }
.admin-task-table .task-id-col { width: 5%; }
.admin-task-table .task-name-col { width: 25%; }
.admin-task-table .task-company-col { width: 18%; }
.admin-task-table .task-money-col { width: 10%; }
.admin-task-table .task-progress-col { width: 13%; }
.admin-task-table .task-payment-col { width: 16%; }
.admin-task-table .task-actions-col { width: 13%; }
.table-card .admin-task-table td { white-space: normal; overflow-wrap: anywhere; }
.admin-task-table td:nth-child(4) { white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; }
.task-code { display: block; margin-top: 6px; color: #526174; font: 13px/1.6 ui-monospace, Consolas, monospace; overflow-wrap: anywhere; }
.task-stage { display: block; margin-bottom: 5px; }
.task-checks { font-size: 13px; }
.task-checks summary { color: #175fbd; cursor: pointer; }
.task-checks dl { margin: 10px 0 0; }
.task-checks dt { color: #526174; margin-top: 8px; }
.task-checks dd { margin: 2px 0 0; }
.admin-task-table th:last-child, .admin-task-table td:last-child { position: sticky; right: 0; z-index: 1; background: #fff; box-shadow: -1px 0 var(--line); }
.admin-task-table th:last-child { background: #f5f7fa; }
.task-actions .row-actions { flex-direction: column; }
.task-actions .row-actions span { font-size: 12px; color: #526174; }
.table-scroll-hint { position: sticky; left: 0; margin: 0; padding: 10px 12px; color: #526174; font-size: 12px; white-space: normal; }
.company-form { grid-template-columns: minmax(130px, 1fr) minmax(220px, 2fr) minmax(180px, 1.5fr) 90px auto auto; align-items: end; }
.company-form label { display: grid; gap: 7px; min-width: 0; font-size: 13px; }
.company-form input, .company-form select { width: 100%; min-width: 0; }
@media (max-width: 1180px) {
  .content-grid { grid-template-columns: 1fr; }
  .company-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .view { padding: 18px 14px 32px; }
  .topbar { padding: 0 14px; }
  .overview-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .company-form { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric { padding: 14px 12px; }
}

.toast.warning {
  background: #8b6019;
}

.mobile-nav-toggle,
.mobile-nav-scrim {
  display: none;
}

.sidebar {
  overflow-y: auto;
}

.mobile-nav-icon {
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 -5px 0 currentColor, 0 5px 0 currentColor;
}

.section-title .eyebrow {
  color: #175fbd;
}

.card .eyebrow {
  color: #175fbd;
}

.quick-grid small {
  color: #526174;
}

.metric small {
  color: #526174;
}

.metric.metric-blue {
  --metric: #2474ee;
  --metric-soft: #eaf2ff;
}

.metric.metric-green {
  --metric: #15a878;
  --metric-soft: #e5f8f1;
}

.metric.metric-gold {
  --metric: #e79525;
  --metric-soft: #fff4df;
}

.metric.metric-purple {
  --metric: #8c67d9;
  --metric-soft: #f2edff;
}

.login-meta {
  color: #526174;
}

.login-card > p {
  color: #526174;
}

.login-card label small {
  color: #526174;
}

.login-card .eyebrow {
  color: #175fbd;
}

.config-field small {
  color: #526174;
}

.primary {
  background: #1f6bd9;
}

.section-title p,
.table-card .empty-state {
  color: #526174;
}

.stat-table th,
.table-card th {
  color: #526174;
}

#configDetailDialog .eyebrow,
#taskDetailDialog .eyebrow,
#taskApprovalDialog .eyebrow {
  color: #175fbd;
}

.detail-note {
  margin: -7px 0 18px;
  color: #526174;
  font-size: 11px;
  line-height: 1.65;
}

#repaymentDetailContent p {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 13px;
  line-height: 1.5;
}
#repaymentQueryForm textarea { width: 100%; }
#repayments .filters label { min-width: 0; }
#repayments .filters select { width: 100%; }
#repayments button:disabled, #repaymentQueryForm button:disabled { cursor: default; opacity: .55; }

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

.config-detail-item {
  min-width: 0;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fafbfd;
}

.config-detail-item span,
.config-detail-item b {
  display: block;
}

.config-detail-item span {
  margin-bottom: 7px;
  color: #526174;
  font-size: 10px;
}

.config-detail-item b {
  overflow-wrap: anywhere;
  color: #203048;
  font-size: 12px;
  line-height: 1.55;
}

@media (max-width: 820px) {
  .mobile-nav-toggle {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid #dce5f0;
    border-radius: 10px;
    background: #f4f7fb;
    color: #203048;
    font-size: 18px;
  }

  .sidebar {
    transition: transform 180ms ease;
  }

  .sidebar.mobile-open {
    transform: translateX(0);
  }

  .mobile-nav-scrim:not([hidden]) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 9;
    padding: 0;
    border: 0;
    background: rgba(13, 24, 42, 0.54);
  }

  body.mobile-nav-open {
    overflow: hidden;
  }

  .config-detail-grid {
    grid-template-columns: 1fr;
  }
}