* { box-sizing: border-box; }
:root {
  --bg: #f4f6fb;
  --card: #ffffff;
  --border: #e2e8f0;
  --text: #0f172a;
  --muted: #64748b;
  --muted-dim: #94a3b8;
  --mod-mes: #16a34a;
  --mod-mes-soft: rgba(22, 163, 74, 0.1);
  --mod-mes-text: #15803d;
  --mod-mes-border: rgba(22, 163, 74, 0.22);
  --mes-radius-sm: 0.375rem;
  --mes-radius-md: 0.5rem;
  --mes-radius-lg: 0.625rem;
  --mes-radius-xl: 0.75rem;
  --mes-radius-2xl: 1rem;
  --mes-radius-pill: 9999px;
  --mes-table-hover: #f8fafc;
  --mes-table-head: #f1f5f9;
  --mes-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.06);
  --mes-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08);
}
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); font-family: Inter, system-ui, sans-serif; }
#mesApp, #mesApp .mes-shell { min-height: 100%; height: 100%; }
.muted { color: var(--muted); }
.err { color: #dc2626; font-size: 0.82rem; }
.field__input {
  width: 100%;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: #ffffff;
  color: var(--text);
  padding: .55rem .7rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.field__input:focus {
  outline: none;
  border-color: rgba(22, 163, 74, 0.45);
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.12);
}
.btn { border: 0; border-radius: 10px; padding: .55rem .85rem; cursor: pointer; font-weight: 600; font-family: inherit; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease; }
.btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.22); }
.btn-primary { background: linear-gradient(180deg, #16a34a, #15803d); color: #fff; box-shadow: 0 4px 14px rgba(22, 163, 74, 0.25); }
.btn-primary:hover { filter: brightness(1.05); }
.btn-secondary { background: #f8fafc; color: #334155; border: 1px solid var(--border); }
.btn-secondary:hover { background: #f1f5f9; }
.btn-ghost { background: transparent; color: var(--muted); border: 1px solid transparent; }
.btn-ghost:hover { background: #f8fafc; color: var(--text); border-color: var(--border); }
.btn-sm { padding: .35rem .65rem; font-size: .78rem; }
.mes-link-btn--anchor { text-decoration: none; display: inline-flex; align-items: center; color: var(--muted); font-size: 0.78rem; margin-top: 10px; }
.mes-link-btn--anchor:hover { color: var(--text); }
.mes-app__cabinet-link { display: inline-flex; margin-top: 10px; color: var(--muted); }
.mes-app__cabinet-link:hover { color: var(--mod-mes-text); }
.mes-module-gate { display: flex; align-items: center; justify-content: center; min-height: calc(100vh - 62px); padding: 2rem; }
.mes-module-gate__box { max-width: 28rem; text-align: center; background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 2rem; box-shadow: var(--mes-shadow); }
.mes-module-gate__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 1rem; }
.mes-board {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mes-board__head {
  display: flex;
  justify-content: space-between;
  gap: 0.85rem;
  align-items: flex-start;
  flex-wrap: wrap;
}

.mes-board__actions {
  display: flex;
  gap: 0.55rem;
  align-items: center;
}

.mes-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0.55rem;
}

.mes-kpi {
  padding: 0.75rem 0.9rem;
}

.mes-kpi span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
}

.mes-kpi strong {
  display: block;
  margin-top: 0.2rem;
  font-size: 1.1rem;
}

.mes-stages {
  min-height: 0;
}

.mes-kanban {
  min-height: 420px;
}

.mes-kanban-scroll {
  display: flex;
  gap: 0.85rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
  min-height: 380px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, 0.55) transparent;
}

.mes-kanban-empty {
  padding: 2rem;
  text-align: center;
  border: 1px dashed #cbd5e1;
  border-radius: var(--mes-radius-xl, 0.75rem);
  background: #f8fafc;
  color: #64748b;
}

.mes-kanban-col {
  width: 248px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 280px);
}

.mes-kanban-col__head {
  padding: 0 0 0.35rem;
}

.mes-kanban-col__title-row {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.mes-kanban-col__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.mes-kanban-col__name {
  flex: 1;
  min-width: 0;
  font-weight: 600;
  font-size: 0.8rem;
  padding: 0.22rem 0.4rem;
}

.mes-kanban-col__count {
  font-size: 0.68rem;
  padding: 0.1rem 0.35rem;
  border-radius: 5px;
  background: #f1f5f9;
  color: #94a3b8;
}

.mes-kanban-col__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.15rem;
  font-size: 0.68rem;
  color: #64748b;
}

.mes-kanban-col__del {
  border: 0;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1;
  padding: 0 0.15rem;
}

.mes-kanban-col__del:hover {
  color: #f87171;
}

.mes-kanban-col__body {
  flex: 1;
  min-height: 160px;
  padding: 0.35rem;
  border-radius: 12px;
  border: 1px dashed rgba(148, 163, 184, 0.28);
  background: #f8fafc;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  overflow-y: auto;
  transition: 0.15s;
}

.mes-kanban-col__body.is-over {
  border-color: rgba(22, 163, 74, 0.45);
  background: rgba(22, 163, 74, 0.08);
}

.mes-kanban-col__empty {
  padding: 1rem 0.35rem;
  text-align: center;
  font-size: 0.68rem;
  color: #64748b;
}

.mes-kanban-col__add {
  margin-top: 0.35rem;
}

.mes-kanban-col__add-row {
  display: grid;
  gap: 0.3rem;
}

.mes-kanban-col__add-row--main {
  grid-template-columns: 1fr 52px auto;
  align-items: center;
}

.mes-kanban-col__qty {
  padding-left: 0.35rem !important;
  padding-right: 0.35rem !important;
  text-align: center;
}

.mes-kanban-col__add-btn {
  min-width: 2rem;
  padding: 0.28rem 0.45rem !important;
}

.mes-kanban-col__add .field__input,
.mes-kanban-card .field__input {
  padding: 0.24rem 0.38rem;
  font-size: 0.72rem;
  border-radius: 8px;
}

.mes-kanban-card {
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 10px;
  padding: 0.38rem 0.45rem;
  background: #ffffff;
  cursor: grab;
  transition: 0.15s;
}

.mes-kanban-card:hover {
  border-color: rgba(22, 163, 74, 0.35);
}

.mes-kanban-card.is-dragging {
  opacity: 0.45;
}

.mes-kanban-card__head {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.mes-kanban-card__title {
  flex: 1;
  min-width: 0;
  font-size: 0.78rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mes-kanban-card__qty {
  flex-shrink: 0;
  font-size: 0.68rem;
  color: #94a3b8;
}

.mes-kanban-card__del {
  border: 0;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1;
  padding: 0;
  flex-shrink: 0;
}

.mes-kanban-card__del:hover {
  color: #f87171;
}

.mes-kanban-card__foot {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.28rem;
  margin-top: 0.32rem;
}

.mes-kanban-card__status,
.mes-kanban-card__order {
  min-width: 0;
}

.mes-stage {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  min-height: 250px;
}

.mes-stage__head,
.mes-stage__add,
.mes-op {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.45rem;
  align-items: center;
}

.mes-stage__add {
  grid-template-columns: 1fr 80px auto;
}

.mes-stage__name {
  width: 100%;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: #ffffff;
  color: #334155;
  font-weight: 600;
  padding: 0.5rem 0.6rem;
}

.mes-stage__ops {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.mes-op {
  grid-template-columns: 1fr 105px 84px auto;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 10px;
  padding: 0.45rem 0.55rem;
  background: #f8fafc;
}

.mes-op__main {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.mes-op__main strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mes-op__status {
  border-radius: 8px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: #f8fafc;
  color: #334155;
  padding: 0.35rem 0.45rem;
}

.mes-op__pill {
  justify-self: start;
  border-radius: 999px;
  font-size: 0.72rem;
  padding: 0.14rem 0.45rem;
  border: 1px solid transparent;
}

.mes-op__pill--todo {
  background: rgba(148, 163, 184, 0.2);
  color: #475569;
}

.mes-op__pill--doing {
  background: rgba(245, 158, 11, 0.22);
  color: #fcd34d;
}

.mes-op__pill--done {
  background: rgba(16, 185, 129, 0.22);
  color: #86efac;
}

/* MES production dashboard shell */
.mes-shell {
  padding: 0 !important;
  background: #f4f6fb;
}

.mes-app,
.mes-shell .mes-app {
  display: flex;
  min-height: calc(100vh - var(--platform-topnav-h, 56px));
  color: #0f172a;
}

#mesApp,
#mesApp .mes-shell {
  min-height: calc(100vh - var(--platform-topnav-h, 56px));
}

#mesApp .mes-app {
  min-height: calc(100vh - var(--platform-topnav-h, 56px));
}

.mes-app__sidebar {
  width: 240px;
  flex-shrink: 0;
  background: #ffffff;
  border-right: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  padding: 16px 12px;
}

.mes-app__nav {
  display: flex;
  flex-direction: column;
  gap: 0.42rem;
  flex: 1;
  overflow-y: auto;
  font-size: 0.92rem;
}

.mes-nav__btn {
  display: flex;
  align-items: center;
  gap: 0.46rem;
  width: 100%;
  border: 1px solid transparent;
  background: transparent;
  color: #475569;
  padding: 0.62rem 0.72rem;
  border-radius: 10px;
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.15;
  text-align: left;
  cursor: pointer;
  font-family: Inter, system-ui, sans-serif;
  transition:
    background 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.mes-nav__btn:hover {
  background: #f8fafc;
  color: #0f172a;
  border-color: #e2e8f0;
}

.mes-nav__btn--active {
  background: rgba(22, 163, 74, 0.1);
  color: #15803d;
  border-color: rgba(22, 163, 74, 0.22);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.mes-nav__group {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 2px 0 6px;
}

.mes-nav__sub {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding-left: 0.35rem;
  margin-left: 0.35rem;
  border-left: 1px solid #e2e8f0;
}

.mes-nav__btn--sub {
  padding-left: 1.35rem;
  font-size: 0.88rem;
  gap: 0.46rem;
}

.mes-nav__sub-num {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 0.62rem;
  font-weight: 700;
  background: rgba(22, 163, 74, 0.12);
  color: #86efac;
}

.mes-nav__sub-label {
  line-height: 1.25;
}

.mes-nav__icon {
  width: 16px;
  height: 16px;
  opacity: 0.85;
}

.mes-app__sidebar-foot {
  margin-top: 12px;
  padding: 12px 10px 0;
  border-top: 1px solid #e2e8f0;
  font-size: 0.75rem;
  color: #64748b;
}

.mes-app__sidebar-muted {
  color: #64748b;
  margin-top: 2px;
}

.mes-app__sidebar-version {
  margin-top: 8px;
  color: #475569;
}

.mes-app__cabinet-link {
  display: inline-flex;
  margin-top: 10px;
  color: #94a3b8;
  font-size: 0.78rem;
  text-decoration: none;
}

.mes-app__cabinet-link:hover {
  color: #334155;
}

.mes-app__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.mes-app__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
}

.mes-app__title {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.mes-app__header-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.mes-icon-btn {
  position: relative;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 10px;
  width: 38px;
  height: 38px;
  cursor: pointer;
}

.mes-icon-btn__badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  line-height: 16px;
  width: 16px;
  border-radius: 999px;
  text-align: center;
}

.mes-user-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.mes-user-chip__avatar {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #16a34a, #8b5cf6);
  font-weight: 700;
  font-size: 0.85rem;
}

.mes-user-chip__name {
  font-size: 0.82rem;
  font-weight: 600;
}

.mes-user-chip__role {
  font-size: 0.7rem;
  color: #64748b;
}

.mes-filter-chip {
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  font-size: 0.78rem;
  color: #475569;
  cursor: pointer;
}

.mes-proj-status-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 0 0 1.1rem;
  padding: 0.9rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

.mes-proj-status-toolbar__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.85rem 1.25rem;
}

.mes-proj-status-toolbar__row--dates {
  padding-top: 0.75rem;
  border-top: 1px solid #e2e8f0;
  align-items: center;
}

.mes-proj-status-toolbar__block {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}

.mes-proj-status-toolbar__label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

.mes-proj-status-toolbar__group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.mes-proj-status-toolbar .mes-filter-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 0.9rem;
  border-radius: 999px;
  border: 1px solid #dbe3ee;
  background: #fff;
  font-size: 0.82rem;
  font-weight: 600;
  color: #334155;
  line-height: 1;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.mes-proj-status-toolbar .mes-filter-chip:hover {
  border-color: #94a3b8;
  background: #fff;
}

.mes-proj-status-toolbar .mes-filter-chip--active {
  border-color: #16a34a;
  background: #16a34a;
  color: #fff;
  box-shadow: none;
}

.mes-proj-status-toolbar__date {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
  color: #475569;
}

.mes-proj-status-toolbar__date .field__input {
  min-width: 10rem;
  height: 36px;
  padding: 0 0.7rem;
  border-radius: 10px;
  border: 1px solid #dbe3ee;
  background: #fff;
  font-size: 0.82rem;
  color: #0f172a;
}

.mes-proj-status-toolbar__dash {
  color: #94a3b8;
  font-weight: 600;
  line-height: 1;
}

.mes-proj-status-toolbar__apply {
  min-height: 36px;
  padding: 0 1rem;
  border-radius: 10px;
  font-size: 0.82rem;
  font-weight: 600;
}

.mes-proj-status-row--done {
  opacity: 0.88;
}

.mes-app__main {
  flex: 1;
  overflow: auto;
  padding: 20px 24px 28px;
}

.mes-app__body--messenger {
  min-height: 0;
  overflow: hidden;
}

.mes-app__main--messenger {
  padding: 12px 16px 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.mes-messenger-page {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.mes-messenger-page .chat-messenger {
  flex: 1;
  min-height: 0;
  height: auto;
}

.mes-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.mes-kpi-card {
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  border: 1px solid #e2e8f0;
  border-radius: var(--mes-radius-xl, 0.75rem);
  padding: 14px;
  min-height: 110px;
  box-shadow: var(--mes-shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.08));
}

.mes-kpi-card--danger {
  border-color: rgba(239, 68, 68, 0.35);
}

.mes-kpi-card__icon {
  font-size: 1.1rem;
  margin-bottom: 8px;
}

.mes-kpi-card__label {
  font-size: 0.72rem;
  color: #94a3b8;
}

.mes-kpi-card__value {
  font-size: 1.6rem;
  font-weight: 800;
  margin-top: 4px;
}

.mes-kpi-card__sub {
  font-size: 0.72rem;
  color: #64748b;
  margin-top: 6px;
}

.mes-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--mes-radius-2xl, 1rem);
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: var(--mes-shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.08));
}

.mes-card--wide {
  width: 100%;
}

.mes-card__title {
  margin: 0 0 14px;
  font-size: 0.95rem;
  font-weight: 700;
}

.mes-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.mes-card__head .mes-card__title {
  margin: 0;
}

.mes-pipeline {
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: 8px;
}

.mes-pipeline__step {
  text-align: center;
  padding: 10px 6px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.mes-pipeline__step--click {
  width: 100%;
  cursor: pointer;
  color: inherit;
  font: inherit;
  transition: background 0.15s, border-color 0.15s, transform 0.12s;
}

.mes-pipeline__step--click:hover {
  background: rgba(22, 163, 74, 0.08);
  border-color: rgba(22, 163, 74, 0.35);
}

.mes-pipeline__step--active {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.45);
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.15);
}

.mes-pipeline-hint {
  margin: -0.25rem 0 0.75rem;
  font-size: 0.78rem;
}

.mes-line-tabs {
  margin-bottom: 1rem;
}

.mes-line-tabs .mes-pipeline {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}

.mes-line-empty {
  padding: 1.75rem 1rem;
  text-align: center;
  border: 1px dashed #cbd5e1;
  border-radius: var(--mes-radius-xl, 0.75rem);
  background: #f8fafc;
  color: #64748b;
}

.mes-pipeline__num {
  width: 22px;
  height: 22px;
  margin: 0 auto 6px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 0.7rem;
  background: rgba(22, 163, 74, 0.15);
  color: #86efac;
}

.mes-pipeline__count {
  font-size: 1.2rem;
  font-weight: 800;
}

.mes-pipeline__label {
  font-size: 0.62rem;
  color: #94a3b8;
  margin-top: 4px;
  line-height: 1.2;
}

.mes-grid-2 {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
}

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

.mes-ws-grid--wide {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mes-ws-grid--interactive {
  grid-template-columns: 1fr;
  gap: 10px;
}

.mes-ws-page {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.mes-ws-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 16px;
  border-radius: 16px;
  background: linear-gradient(135deg, #ffffff 0%, #f0fdf4 100%);
  border: 1px solid #dcfce7;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-ws-toolbar__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mes-ws-stat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: #64748b;
  font-size: 0.78rem;
}

.mes-ws-stat strong {
  color: #0f172a;
  font-weight: 700;
}

.mes-ws-stat--warn {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #c2410c;
}

.mes-ws-stat--warn strong {
  color: #9a3412;
}

.mes-ws-add {
  padding: 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-ws-add[hidden] {
  display: none !important;
}

.mes-ws-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.95fr) minmax(340px, 1.15fr);
  gap: 14px;
  align-items: start;
}

.mes-ws-layout__list,
.mes-ws-layout__detail {
  min-width: 0;
}

.mes-ws-empty {
  padding: 28px 18px;
  text-align: center;
  color: #64748b;
  border: 1px dashed #cbd5e1;
  border-radius: 16px;
  background: #f8fafc;
}

.mes-ws-card {
  display: block;
  width: 100%;
  text-align: left;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 14px;
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-ws-card:hover {
  border-color: #86efac;
  box-shadow: 0 8px 24px rgba(22, 163, 74, 0.08);
  transform: translateY(-1px);
}

.mes-ws-card--selected {
  border-color: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.16), 0 10px 28px rgba(22, 163, 74, 0.1);
  background: linear-gradient(180deg, #ffffff 0%, #f0fdf4 100%);
}

.mes-ws-card--warn {
  border-color: #fdba74;
}

.mes-ws-card--warn.mes-ws-card--selected {
  border-color: #f97316;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.14), 0 10px 28px rgba(249, 115, 22, 0.08);
  background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%);
}

.mes-ws-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.mes-ws-card__head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.mes-ws-card__head strong {
  font-size: 0.95rem;
  color: #0f172a;
  line-height: 1.25;
}

.mes-ws-card__head span {
  font-size: 0.78rem;
  color: #64748b;
}

.mes-ws-card__ring {
  --ws-load: 0;
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at center, #fff 58%, transparent 59%),
    conic-gradient(#22c55e calc(var(--ws-load) * 1%), #e2e8f0 0);
  font-size: 0.72rem;
  font-weight: 700;
  color: #166534;
}

.mes-ws-card--warn .mes-ws-card__ring {
  background:
    radial-gradient(circle at center, #fff 58%, transparent 59%),
    conic-gradient(#f97316 calc(var(--ws-load) * 1%), #ffedd5 0);
  color: #c2410c;
}

.mes-ws-card__team {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 28px;
  margin-bottom: 12px;
}

.mes-ws-card__empty {
  color: #c2410c;
  font-size: 0.78rem;
  font-weight: 600;
}

.mes-ws-card__foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.74rem;
  color: #94a3b8;
  border-top: 1px solid #f1f5f9;
  padding-top: 10px;
}

.mes-ws-detail {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  position: sticky;
  top: 12px;
}

.mes-ws-detail--empty {
  display: grid;
  place-items: center;
  text-align: center;
  min-height: 320px;
  gap: 8px;
  color: #64748b;
}

.mes-ws-detail__empty-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: #f0fdf4;
  color: #16a34a;
  font-size: 1.4rem;
  margin-bottom: 4px;
}

.mes-ws-detail__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.mes-ws-detail__eyebrow {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #94a3b8;
}

.mes-ws-detail__title {
  margin: 4px 0 0;
  font-size: 1.2rem;
  color: #0f172a;
}

.mes-ws-detail__badge {
  flex: 0 0 auto;
  padding: 6px 10px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #166534;
  font-size: 0.74rem;
  font-weight: 700;
}

.mes-ws-detail__badge--warn {
  background: #fff7ed;
  color: #c2410c;
}

.mes-ws-detail__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}

.mes-ws-detail__stats > div {
  padding: 10px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #f1f5f9;
}

.mes-ws-detail__stats span {
  display: block;
  font-size: 0.68rem;
  color: #94a3b8;
  margin-bottom: 4px;
}

.mes-ws-detail__stats strong {
  font-size: 0.95rem;
  color: #0f172a;
}

.mes-ws-employees-field__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  font-size: 0.78rem;
  color: #475569;
}

.mes-ws-employees__empty {
  color: #94a3b8;
  font-size: 0.8rem;
}

.mes-ws-bar {
  display: grid;
  grid-template-columns: 52px 1fr 36px;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 0.68rem;
  color: #94a3b8;
}

.mes-ws-bar em {
  font-style: normal;
  text-align: right;
  color: #334155;
}

.mes-loadbar {
  height: 8px;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
}

.mes-loadbar i {
  display: block;
  height: 100%;
  border-radius: inherit;
}

.mes-loadbar--ok i {
  background: linear-gradient(90deg, #22c55e, #4ade80);
}

.mes-loadbar--warn i {
  background: linear-gradient(90deg, #f59e0b, #fbbf24);
}

.mes-loadbar--danger i {
  background: linear-gradient(90deg, #ef4444, #f87171);
}

.mes-loadbar--forecast i {
  opacity: 0.85;
}

.mes-chart {
  width: 100%;
  height: auto;
}

.mes-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-top: 10px;
}

.mes-chart-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.68rem;
  color: #94a3b8;
}

.mes-chart-legend__item i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  display: inline-block;
}

.mes-table-wrap {
  overflow: auto;
}

.mes-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.78rem;
}

.mes-table th,
.mes-table td {
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
  white-space: nowrap;
}

.mes-table thead th {
  background: var(--mes-table-head, #f1f5f9);
  position: relative;
}

.mes-table tbody tr {
  transition: background-color 0.14s ease;
}

.mes-table tbody tr:hover {
  background: var(--mes-table-hover, #f8fafc);
}

.mes-table th {
  color: #64748b;
  font-weight: 600;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.mes-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 0.375rem;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
  color: #ffffff;
}

.mes-badge--orange { background: #ea580c; }
.mes-badge--red { background: #ea580c; }
.mes-badge--purple { background: #7c3aed; }
.mes-badge--green { background: #16a34a; }
.mes-badge--blue { background: #2563eb; }
.mes-badge--gray { background: #64748b; }
.mes-badge--amber { background: #f59e0b; }
.mes-badge--teal { background: #0d9488; }

.mes-progress-cell {
  min-width: 90px;
}

.mes-progress-cell span {
  display: block;
  font-size: 0.68rem;
  margin-bottom: 4px;
}

.mes-progress {
  height: 6px;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
}

.mes-progress i {
  display: block;
  height: 100%;
}

.mes-progress--green i { background: #22c55e; }
.mes-progress--amber i { background: #f59e0b; }
.mes-progress--red i { background: #ef4444; }

.mes-risk--high { color: #f87171; font-weight: 600; }
.mes-risk--medium { color: #fbbf24; font-weight: 600; }
.mes-risk--low { color: #86efac; font-weight: 600; }

.mes-warn-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.mes-warn {
  border-radius: 12px;
  padding: 12px;
  border: 1px solid #e2e8f0;
}

.mes-warn--high { background: rgba(239, 68, 68, 0.08); border-color: rgba(239, 68, 68, 0.25); }
.mes-warn--medium { background: rgba(245, 158, 11, 0.08); border-color: rgba(245, 158, 11, 0.25); }
.mes-warn--low { background: rgba(34, 197, 94, 0.06); border-color: rgba(34, 197, 94, 0.2); }

.mes-warn__title { font-weight: 700; font-size: 0.82rem; }
.mes-warn__text { font-size: 0.75rem; color: #94a3b8; margin-top: 4px; }
.mes-warn__time { font-size: 0.68rem; color: #64748b; margin-top: 8px; }

.mes-link-btn {
  border: 0;
  background: transparent;
  color: #818cf8;
  font-size: 0.75rem;
  cursor: pointer;
}

.mes-board-tools {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.mes-loading { padding: 24px; }

.mes-kpi-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mes-kpi-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mes-kpi-card--accent {
  border-color: rgba(245, 158, 11, 0.35);
  background:
    radial-gradient(420px 120px at 0% 0%, rgba(245, 158, 11, 0.12), transparent 60%),
    linear-gradient(180deg, #fffbeb 0%, #ffffff 70%);
}

.mes-table--employees td {
  vertical-align: middle;
}

.mes-table--employees tbody tr.mes-emp-row--working {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.06), transparent 42%);
}

.mes-table--employees tbody tr.mes-emp-row--shift {
  background: linear-gradient(90deg, rgba(34, 197, 94, 0.04), transparent 36%);
}

.mes-emp-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mes-emp-cell--btn {
  width: 100%;
  margin: 0;
  padding: 4px 6px 4px 4px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.mes-emp-cell--btn:hover {
  background: rgba(22, 163, 74, 0.08);
}

.mes-emp-cell--btn:hover strong {
  color: #15803d;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.mes-emp-cell--btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.22);
}

.mes-emp-cell__photo,
.mes-emp-cell__avatar {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  flex-shrink: 0;
}

.mes-emp-cell__photo {
  object-fit: cover;
}

.mes-emp-cell__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(22, 163, 74, 0.15);
  color: #86efac;
  font-weight: 700;
}

.mes-emp-cell__meta {
  font-size: 0.72rem;
  color: #64748b;
  margin-top: 2px;
}

.mes-emp-cell__meta--role {
  color: #2563eb;
  font-weight: 600;
}

.mes-emp-load {
  min-width: 148px;
  max-width: 220px;
}

.mes-emp-load__top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.mes-emp-load__pct {
  font-size: 0.82rem;
  font-weight: 750;
  color: #0f172a;
  letter-spacing: -0.02em;
}

.mes-emp-load__detail {
  font-size: 0.7rem;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 140px;
}

.mes-emp-load__track {
  height: 7px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.04);
}

.mes-emp-load__fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  width: 0;
  transition: width 0.35s ease;
  background: linear-gradient(90deg, #94a3b8, #64748b);
}

.mes-emp-load--idle .mes-emp-load__pct {
  color: #94a3b8;
  font-weight: 650;
}

.mes-emp-load--low .mes-emp-load__fill {
  background: linear-gradient(90deg, #34d399, #10b981);
}

.mes-emp-load--mid .mes-emp-load__fill {
  background: linear-gradient(90deg, #fbbf24, #f59e0b);
}

.mes-emp-load--high .mes-emp-load__fill {
  background: linear-gradient(90deg, #fb7185, #ef4444);
}

.mes-emp-load--high .mes-emp-load__pct {
  color: #b91c1c;
}

.mes-emp-status {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 118px;
}

.mes-emp-status__pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.2;
  border: 1px solid transparent;
}

.mes-emp-status__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

.mes-emp-status__hint {
  font-size: 0.68rem;
  color: #64748b;
  max-width: 160px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 2px;
}

.mes-emp-status--working .mes-emp-status__pill {
  color: #9a3412;
  background: #fff7ed;
  border-color: #fdba74;
}

.mes-emp-status--working .mes-emp-status__dot {
  background: #f59e0b;
  box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.55);
  animation: mes-emp-pulse 1.6s ease-out infinite;
}

.mes-emp-status--shift .mes-emp-status__pill {
  color: #166534;
  background: #ecfdf5;
  border-color: #86efac;
}

.mes-emp-status--shift .mes-emp-status__dot {
  background: #22c55e;
}

.mes-emp-status--off .mes-emp-status__pill {
  color: #475569;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

@keyframes mes-emp-pulse {
  0% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.5); }
  70% { box-shadow: 0 0 0 8px rgba(245, 158, 11, 0); }
  100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}

@media (max-width: 1100px) {
  .mes-kpi-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .mes-kpi-grid--4 {
    grid-template-columns: 1fr;
  }
}

.mes-emp-ops em {
  font-style: normal;
  color: #334155;
  font-weight: 600;
}

.mes-link-btn--anchor,
a.mes-link-btn {
  text-decoration: none;
}

a.mes-link-btn:hover {
  color: #4ade80;
}

.mes-grid-2--tasks,
.mes-grid-2--orders {
  align-items: start;
}

.mes-orders-hint {
  margin: 4px 0 0;
  font-size: 0.84rem;
  color: #64748b;
  line-height: 1.4;
  max-width: 42rem;
}

.mes-orders-panel {
  padding-top: 1rem;
}

.mes-orders-head {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 1rem;
}

.mes-orders-head__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px 16px;
}

.mes-orders-head__intro .mes-card__title {
  margin: 0;
}

.mes-orders-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(10rem, 12.5rem) minmax(10rem, 12.5rem);
  gap: 12px;
  align-items: end;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-orders-toolbar__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.mes-orders-toolbar__field--search {
  min-width: 0;
}

.mes-orders-toolbar__label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
  line-height: 1;
}

.mes-orders-search {
  position: relative;
  display: block;
  width: 100%;
  max-width: none;
}

.mes-orders-search__icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
  display: inline-flex;
  line-height: 0;
}

.mes-orders-search__input,
.mes-orders-toolbar__select {
  width: 100%;
  min-height: 48px;
  height: 48px;
  border-radius: 12px;
  font-size: 0.95rem;
  font-weight: 500;
  padding: 0 14px;
  border: 1px solid #dbe3ee;
  background: #ffffff;
  color: #0f172a;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mes-orders-search__input {
  padding-left: 44px;
}

.mes-orders-search__input:hover,
.mes-orders-toolbar__select:hover {
  border-color: #cbd5e1;
}

.mes-orders-search__input:focus,
.mes-orders-toolbar__select:focus {
  outline: none;
  border-color: rgba(22, 163, 74, 0.55);
  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.14);
}

.mes-orders-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.mes-orders-actions .btn {
  min-height: 40px;
  padding: 0.55rem 0.95rem;
  border-radius: 11px;
  font-weight: 600;
}

.mes-orders-empty {
  margin: 0.5rem 0 0;
  padding: 0 0.25rem;
}

@media (max-width: 980px) {
  .mes-orders-toolbar {
    grid-template-columns: 1fr 1fr;
  }
  .mes-orders-toolbar__field--search {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .mes-orders-toolbar {
    grid-template-columns: 1fr;
    padding: 10px;
  }
  .mes-orders-actions {
    width: 100%;
  }
  .mes-orders-actions .btn {
    flex: 1 1 auto;
  }
}

.mes-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.mes-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, 0.38);
  backdrop-filter: blur(6px);
  cursor: pointer;
}

.mes-modal__box {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  margin: 0;
  border-radius: var(--mes-radius-2xl, 1rem);
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.14);
}

.mes-modal__close {
  border: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 0.25rem;
}

.mes-modal__close:hover {
  color: #334155;
}

.mes-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.mes-task-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mes-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.82rem;
  color: #94a3b8;
}

.mes-task-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.mes-task-form__textarea {
  min-height: 84px;
  resize: vertical;
}

.mes-task-form__err {
  margin: 0;
}

.mes-task-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.mes-task-filters .field__input {
  min-width: 160px;
}

.mes-task-filters__check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
  color: rgba(226, 232, 240, 0.8);
  white-space: nowrap;
}

.mes-badge--warn {
  box-shadow: 0 0 0 1px rgba(234, 88, 12, 0.35);
}

.mes-task-card__assignees {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
}

.mes-task-card__edit {
  margin: 8px 0;
  font-size: 0.85rem;
}

.mes-task-card__edit summary {
  cursor: pointer;
  color: rgba(147, 197, 253, 0.95);
}

.mes-task-card__edit select {
  margin-top: 8px;
  width: 100%;
}

.mes-task-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.mes-task-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 14px;
  background: #ffffff;
}

.mes-task-card__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.mes-task-card__title {
  margin: 0 0 4px;
  font-size: 1rem;
  color: #0f172a;
}

.mes-task-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 0.78rem;
  color: #64748b;
}

.mes-task-card__badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.mes-task-card__desc {
  margin: 10px 0 0;
  color: #475569;
  font-size: 0.86rem;
  line-height: 1.45;
}

.mes-task-card__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  flex-wrap: wrap;
}

.mes-task-card__status {
  max-width: 180px;
}

.mes-ws-form {
  display: grid;
  grid-template-columns: 1.2fr 1fr 0.7fr 1.2fr auto;
  gap: 10px;
  align-items: center;
}

.mes-ws-form__capacity {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.mes-ws-card__capacity {
  font-size: 0.76rem;
  margin: 6px 0 8px;
}

.mes-ws-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #166534;
  border: 1px solid #bbf7d0;
  font-size: 0.74rem;
  font-weight: 600;
}

.mes-ws-chip--more {
  background: #f1f5f9;
  color: #64748b;
  border-color: #e2e8f0;
}

.mes-ws-chip--editable {
  padding-right: 4px;
}

.mes-ws-chip__remove {
  border: 0;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px;
}

.mes-ws-chip__remove:hover {
  color: #dc2626;
}

.mes-field--full {
  grid-column: 1 / -1;
}

.mes-ws-employees__list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 36px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #f1f5f9;
}

.mes-ws-employees__add {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.mes-ws-form__err {
  margin: 10px 0 0;
}

.mes-ws-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mes-ws-editor {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 14px;
  background: #ffffff;
}

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

.mes-ws-editor__fields .mes-field--full,
.mes-ws-editor__fields .mes-ws-employees-field {
  grid-column: 1 / -1;
}

.mes-ws-editor__meta {
  margin-top: 10px;
  font-size: 0.78rem;
}

.mes-ws-editor__actions {
  display: flex;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f1f5f9;
}

@media (max-width: 1100px) {
  .mes-ws-layout {
    grid-template-columns: 1fr;
  }

  .mes-ws-detail {
    position: static;
  }
}

@media (max-width: 900px) {
  .mes-ws-form,
  .mes-ws-editor__fields {
    grid-template-columns: 1fr;
  }

  .mes-ws-detail__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.mes-alert--error {
  background: rgba(239, 68, 68, 0.12);
  border: 1px solid rgba(239, 68, 68, 0.25);
  color: #fecaca;
  padding: 12px 14px;
  border-radius: 12px;
}

.mes-placeholder {
  min-height: 240px;
}

.mes-projects-page {
  max-width: none;
}

.mes-projects-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 1rem;
}

.mes-projects-search {
  position: relative;
  flex: 1 1 16rem;
  min-width: 12rem;
  max-width: 28rem;
}

.mes-projects-search__icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted-dim);
  pointer-events: none;
  font-size: 0.9rem;
}

.mes-projects-search__input {
  padding-left: 2rem !important;
}

.mes-projects-table-wrap {
  margin-top: 0.25rem;
}

.mes-projects-table__th-photo {
  width: 3.5rem;
}

.mes-projects-table__thumb {
  width: 3.5rem;
  padding: 0.35rem 0.5rem 0.35rem 0.75rem;
  vertical-align: middle;
}

.mes-projects-table__thumb-frame {
  display: block;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 8px;
  overflow: hidden;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}

.mes-projects-table__thumb-frame--empty::after {
  content: "⌼";
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--muted-dim, #64748b);
  font-size: 1rem;
  line-height: 1;
}

.mes-projects-table__thumb-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mes-projects-table tbody tr {
  cursor: pointer;
  transition: background 0.12s;
}

.mes-projects-table__row:hover,
.mes-projects-table__row:focus-visible {
  background: rgba(22, 163, 74, 0.08);
  outline: none;
}

.mes-projects-table__row--active {
  background: rgba(22, 163, 74, 0.08);
}

.mes-projects-table__name strong {
  font-weight: 600;
  font-size: 0.86rem;
}

.mes-projects-table__extra {
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mes-projects-table__empty {
  text-align: center;
  padding: 2.25rem 1rem !important;
  color: #64748b !important;
  white-space: normal;
}

.mes-projects-table__hint {
  margin: 0.75rem 0 0;
  font-size: 0.82rem;
}

.mes-grid-2--projects {
  align-items: start;
}

.mes-project-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-project-list__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
  text-align: left;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 10px;
  padding: 10px 12px;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
}

.mes-project-list__item:hover,
.mes-project-list__item.is-active {
  border-color: rgba(22, 163, 74, 0.4);
  background: rgba(22, 163, 74, 0.08);
}

.mes-project-list__item strong {
  font-size: 0.86rem;
}

.mes-project-list__item span {
  font-size: 0.72rem;
  color: #94a3b8;
}

.mes-project-detail__sub {
  margin: 4px 0 0;
  font-size: 0.78rem;
}

.mes-project-section-title {
  margin: 0 0 10px;
  font-size: 0.88rem;
  color: #475569;
}

.mes-project-qty-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
  margin-bottom: 14px;
}

.mes-project-qty-row .mes-field {
  min-width: 180px;
  margin: 0;
}

.mes-project-qty-row .btn {
  height: 38px;
}

.mes-project-materials-status {
  margin: -6px 0 12px;
  font-size: 0.82rem;
  color: #93c5fd;
}

.mes-project-materials-status:not([hidden])::before {
  content: "";
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  margin-right: 0.4rem;
  border: 2px solid rgba(147, 197, 253, 0.35);
  border-top-color: #93c5fd;
  border-radius: 50%;
  vertical-align: -0.1rem;
  animation: mes-spin 0.8s linear infinite;
}

.btn.is-loading {
  opacity: 0.85;
  cursor: wait;
}

@keyframes mes-spin {
  to {
    transform: rotate(360deg);
  }
}

.mes-stock-check-modal {
  width: min(94vw, 52rem);
  max-height: min(88vh, 720px);
  overflow: auto;
}

.mes-stock-check-summary {
  margin: 0 0 0.85rem;
}

.mes-stock-check-summary__lead {
  margin: 0 0 0.5rem;
}

.mes-stock-check-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.mes-stock-check-table {
  margin-bottom: 0.75rem;
}

.mes-stock-check-hint {
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
}

.mes-stock-check-hint--ok {
  color: #86efac;
}

.mes-stock-check-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.mes-project-spec-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
  gap: 20px;
  align-items: start;
  margin-bottom: 14px;
}

.mes-project-spec-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.mes-project-spec-head .mes-project-section-title {
  margin: 0;
}

.mes-project-spec-form-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.mes-project-spec-form-grid--edit .mes-spec-field {
  outline: 1px dashed rgba(56, 189, 248, 0.35);
  border-radius: 10px;
  padding: 8px;
  background: #f8fafc;
}

.mes-spec-field--w-4 {
  grid-column: span 4;
}

.mes-spec-field--w-6 {
  grid-column: span 6;
}

.mes-spec-field--w-12 {
  grid-column: span 12;
}

.mes-spec-field__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.mes-spec-field__drag {
  cursor: grab;
  color: #64748b;
  font-size: 0.9rem;
  user-select: none;
  padding: 2px 6px;
  border-radius: 6px;
}

.mes-spec-field__drag:active {
  cursor: grabbing;
}

.mes-spec-field__width {
  min-width: 52px;
}

.mes-spec-field__label[contenteditable="true"] {
  outline: none;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.45);
  cursor: text;
}

.mes-spec-field--dragging {
  opacity: 0.55;
}

.mes-spec-field--drop-target {
  outline: 2px solid rgba(56, 189, 248, 0.65);
}

.mes-spec-field__body {
  margin: 0;
}

@media (max-width: 900px) {
  .mes-project-spec-layout {
    grid-template-columns: 1fr;
  }

  .mes-spec-field--w-4,
  .mes-spec-field--w-6 {
    grid-column: span 12;
  }
}

.mes-project-spec-form {
  min-width: 0;
}

.mes-proj-photos {
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: #ffffff;
}

.mes-proj-photos__lead {
  margin: 0 0 10px;
  font-size: 0.78rem;
}

.mes-proj-photos__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.mes-proj-photo {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-proj-photo__frame {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(2, 6, 23, 0.5);
}

.mes-proj-photo--main .mes-proj-photo__frame {
  border-color: rgba(34, 197, 94, 0.55);
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.25);
}

.mes-proj-photo__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mes-proj-photo__badge {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  color: #052e16;
  background: #4ade80;
}

.mes-proj-photo__badge--warehouse {
  top: auto;
  bottom: 8px;
  left: 8px;
  color: #1e3a5f;
  background: #bfdbfe;
}

.mes-proj-photo__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mes-proj-photo--add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 120px;
  border: 1px dashed rgba(148, 163, 184, 0.35);
  border-radius: 10px;
  cursor: pointer;
  color: #94a3b8;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.mes-proj-photo--add:hover {
  border-color: rgba(56, 189, 248, 0.55);
  color: #334155;
  background: rgba(56, 189, 248, 0.06);
}

.mes-proj-photo__add-icon {
  font-size: 1.5rem;
  line-height: 1;
}

.mes-proj-photo__add-label {
  font-size: 0.78rem;
}

.mes-proj-photo--empty {
  min-height: 120px;
  border-radius: 10px;
  border: 1px dashed rgba(148, 163, 184, 0.08);
}

.mes-mat-wh-wrap {
  position: relative;
  min-width: 220px;
}

.mes-mat-wh-cell {
  white-space: normal;
  min-width: 240px;
}

.mes-table-wrap--mat {
  overflow: auto;
}

.mes-table-wrap--mat-cost .mes-table {
  table-layout: fixed;
  width: 100%;
  min-width: 980px;
}

.mes-table-wrap--mat-cost th,
.mes-table-wrap--mat-cost td {
  vertical-align: middle;
}

.mes-table-wrap--mat-cost .mes-mat-col--name {
  width: 26%;
}

.mes-table-wrap--mat-cost .mes-mat-col--qty {
  width: 7.5%;
  text-align: right;
}

.mes-table-wrap--mat-cost .mes-mat-col--qty .field__input {
  text-align: right;
  max-width: 5.5rem;
  margin-left: auto;
  display: block;
}

.mes-table-wrap--mat-cost .mes-mat-col--num {
  width: 8.5%;
  text-align: right;
  white-space: nowrap;
}

.mes-table-wrap--mat-cost .mes-mat-col--note {
  width: 14%;
}

.mes-table-wrap--mat-cost .mes-mat-col--del {
  width: 2.75rem;
  text-align: center;
}

.mes-table-wrap--mat-cost .mes-mat-cost {
  white-space: nowrap;
  font-size: 0.82rem;
  color: #475569;
  text-align: right;
}

.mes-table-wrap--mat-cost .mes-mat-cost--batch {
  color: #15803d;
  font-weight: 600;
}

.mes-table-wrap--mat-cost .mes-mat-qty-batch {
  white-space: nowrap;
  font-size: 0.84rem;
  font-weight: 600;
  color: #0f172a;
  text-align: right;
}

.mes-table-wrap--mat-cost .mes-mat-unit-col {
  width: 4.5rem;
  max-width: 4.5rem;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  text-align: center;
}

.mes-table-wrap--mat-cost .mes-mat-unit-input {
  width: 100%;
  min-width: 0;
  padding: 0.35rem 0.2rem;
  text-align: center;
  font-size: 0.82rem;
}

.mes-table-wrap--mat-cost .mes-mat-stock-col {
  width: 5rem;
  max-width: 5.5rem;
  text-align: center;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}

.mes-mat-stock {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 600;
  white-space: nowrap;
}

.mes-mat-stock--ok {
  color: #4ade80;
  font-size: 1rem;
  line-height: 1;
}

.mes-mat-stock--short {
  color: #f87171;
}

.mes-mat-stock--unlinked,
.mes-mat-stock--idle {
  color: #64748b;
}

.mes-mat-stock--loading {
  color: #93c5fd;
}

.mes-project-cost-summary {
  margin: 12px 0 16px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(74, 222, 128, 0.25);
  background: rgba(22, 101, 52, 0.12);
  display: grid;
  gap: 8px;
  max-width: 420px;
}

.mes-project-cost-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

.mes-project-cost-summary__row--accent strong {
  color: #4ade80;
  font-size: 1.05rem;
}

.mes-project-cost-summary__total strong {
  color: #4ade80;
}

.mes-mat-wh-input-wrap {
  position: relative;
}

.mes-mat-wh-input-wrap .mes-mat-wh-input {
  padding-right: 2rem;
}

.mes-mat-wh-icon {
  position: absolute;
  right: 0.55rem;
  top: 50%;
  transform: translateY(-50%);
  color: #64748b;
  font-size: 0.95rem;
  pointer-events: none;
}

.mes-mat-wh-hint {
  display: block;
  margin-top: 4px;
  font-size: 0.72rem;
  line-height: 1.3;
}

.mes-mat-wh-portal {
  position: fixed;
  z-index: 10050;
  max-height: 280px;
  overflow: auto;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);
  padding: 6px;
}

.mes-mat-wh-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.mes-mat-wh-item:hover,
.mes-mat-wh-item--active {
  background: rgba(56, 189, 248, 0.14);
}

.mes-mat-wh-mark {
  padding: 0;
  background: rgba(250, 204, 21, 0.28);
  color: inherit;
  border-radius: 2px;
}

.mes-mat-wh-loading,
.mes-mat-wh-empty {
  margin: 0;
  padding: 8px;
  font-size: 0.82rem;
}

.mes-proj-tech-empty {
  padding: 0.5rem 0;
}

.mes-proj-tech-import {
  margin-top: 1rem;
  padding: 0.85rem 1rem;
  border-radius: 10px;
  border: 1px dashed rgba(148, 163, 184, 0.2);
  background: #f8fafc;
}

.mes-proj-tech-import__row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.5rem;
}

.mes-proj-tech-bridge {
  margin-top: 1rem;
}

.mes-tech-ops {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.mes-tech-ops__quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.mes-tech-ops__quick-input {
  flex: 1 1 220px;
  min-width: 180px;
}

.mes-tech-ops__presets {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.mes-tech-ops__chip {
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: #f8fafc;
  color: #475569;
  border-radius: 999px;
  padding: 0.28rem 0.7rem;
  font-size: 0.74rem;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.mes-tech-ops__chip:hover {
  background: rgba(22, 163, 74, 0.1);
  border-color: rgba(22, 163, 74, 0.4);
  color: #334155;
}

.mes-tech-ops__flow {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.mes-tech-ops__empty {
  padding: 1.25rem 1rem;
  border-radius: 12px;
  border: 1px dashed rgba(148, 163, 184, 0.22);
  background: #f8fafc;
}

.mes-tech-ops__empty-title {
  margin: 0 0 0.25rem;
  font-weight: 600;
}

.mes-tech-ops__foot {
  margin: 0;
  font-size: 0.76rem;
}

.mes-tech-op-card {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 0.65rem;
  align-items: stretch;
}

.mes-tech-op-card__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
}

.mes-tech-op-card__num {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 0.82rem;
  font-weight: 700;
  background: rgba(34, 197, 94, 0.18);
  color: #86efac;
  border: 1px solid rgba(34, 197, 94, 0.35);
}

.mes-tech-op-card__line {
  flex: 1;
  width: 2px;
  min-height: 12px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(34, 197, 94, 0.45), rgba(148, 163, 184, 0.15));
}

.mes-tech-op-card__panel {
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: #f1f5f9;
  overflow: hidden;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.mes-tech-op-card--open .mes-tech-op-card__panel,
.mes-tech-op-card__panel:hover {
  border-color: rgba(22, 163, 74, 0.35);
}

.mes-tech-op-card--open .mes-tech-op-card__panel {
  box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.08);
}

.mes-tech-op-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.7rem 0.8rem;
}

.mes-tech-op-card__toggle {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  padding: 0;
}

.mes-tech-op-card__toggle--static {
  cursor: default;
}

.mes-tech-op-card__title {
  display: block;
  font-size: 0.92rem;
  margin-bottom: 0.15rem;
}

.mes-tech-op-card__meta {
  display: block;
  font-size: 0.76rem;
}

.mes-tech-op-card__note {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.72rem;
  color: #94a3b8;
}

.mes-tech-op-card__toolbar {
  display: flex;
  gap: 0.15rem;
  flex-shrink: 0;
}

.mes-tech-op-card__del {
  color: #f87171;
}

.mes-tech-op-card__edit {
  padding: 0 0.8rem 0.8rem;
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  background: #f1f5f9;
}

.mes-tech-op-card__edit-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
}

.mes-field--compact {
  margin-bottom: 0.55rem;
}

.mes-field--compact > span {
  font-size: 0.72rem;
}

.mes-tech-op-card__edit-actions {
  display: flex;
  gap: 0.45rem;
  margin-top: 0.35rem;
}

.mes-tech-op-card__expand {
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  background: #f8fafc;
}

.mes-tech-op-card__hint {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.68rem;
  color: #818cf8;
}

.mes-tech-op-card__subs-badge {
  display: inline-block;
  margin-top: 0.2rem;
  padding: 0.08rem 0.45rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 600;
  background: rgba(22, 163, 74, 0.1);
  color: #4ade80;
  border: 1px solid rgba(22, 163, 74, 0.15);
}

.mes-tech-op-card__toggle--view {
  cursor: pointer;
}

.mes-tech-op-card__settings {
  border-top: 1px solid rgba(148, 163, 184, 0.1);
}

.mes-tech-op-card__settings > summary {
  padding: 0.55rem 0.8rem;
  font-size: 0.76rem;
  color: #94a3b8;
  cursor: pointer;
  user-select: none;
}

.mes-tech-op-card__settings > summary:hover {
  color: #475569;
}

.mes-tech-substeps {
  padding: 0.65rem 0.8rem 0.75rem;
}

.mes-tech-substeps__lead {
  margin: 0 0 0.5rem;
  font-size: 0.74rem;
  color: #94a3b8;
}

.mes-tech-substeps__empty {
  margin: 0 0 0.55rem;
  font-size: 0.74rem;
}

.mes-tech-substeps__list {
  list-style: none;
  margin: 0 0 0.55rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mes-tech-substep {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.12);
}

.mes-tech-substep__num {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  color: #86efac;
  min-width: 1.8rem;
}

.mes-tech-substep__body {
  flex: 1;
  min-width: 0;
  font-size: 0.82rem;
}

.mes-tech-substep__body strong {
  display: block;
  font-weight: 600;
}

.mes-tech-substep__meta {
  display: block;
  font-size: 0.72rem;
  margin-top: 0.1rem;
}

.mes-tech-substep__note {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.7rem;
  color: #94a3b8;
}

.mes-tech-substep__del {
  flex-shrink: 0;
  color: #f87171;
  line-height: 1;
}

.mes-tech-substeps__add {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}

.mes-tech-substeps__input {
  flex: 1;
  min-width: 0;
}

.mes-tech-assign {
  padding: 0.65rem 0.8rem 0.55rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.mes-tech-assign__row {
  display: flex;
  gap: 0.5rem;
  align-items: flex-end;
  flex-wrap: wrap;
}

.mes-tech-assign__stage {
  flex: 1;
  min-width: 180px;
  margin-bottom: 0;
}

.mes-tech-assign__btn {
  flex-shrink: 0;
}

.mes-tech-assign__hint {
  margin: 0.45rem 0 0;
  font-size: 0.72rem;
}

.mes-tech-assign__stage-name {
  display: block;
  padding: 0.45rem 0;
  font-size: 0.84rem;
  font-weight: 600;
}

.mes-tech-assign__badge {
  display: inline-block;
  margin-top: 0.35rem;
}

.mes-tech-op-card__task-badge {
  display: inline-block;
  margin-top: 0.2rem;
  margin-left: 0.25rem;
  padding: 0.08rem 0.45rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 600;
  background: rgba(34, 197, 94, 0.15);
  color: #86efac;
  border: 1px solid rgba(34, 197, 94, 0.25);
}

.mes-app__subtitle {
  margin: 0.15rem 0 0;
  font-size: 0.82rem;
}

.mes-quick-start {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.mes-quick-start__hint {
  margin: 0;
  font-size: 0.78rem;
}

.mes-kpi-card--link {
  cursor: pointer;
  transition: border-color 0.15s, transform 0.1s;
}

.mes-kpi-card--link:hover {
  border-color: rgba(22, 163, 74, 0.4);
  transform: translateY(-1px);
}

.mes-stages-toolbar {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 0.85rem;
}

.mes-stages-toolbar__input {
  flex: 1;
  min-width: 0;
}

.mes-stages-empty {
  padding: 1.75rem 1rem;
  text-align: center;
  border: 1px dashed #cbd5e1;
  border-radius: var(--mes-radius-xl, 0.75rem);
  background: #f8fafc;
  color: #64748b;
}

.mes-stages-empty__title {
  margin: 0 0 0.35rem;
  font-weight: 600;
}

.mes-stages-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.mes-stage-card {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 0.65rem;
}

.mes-stage-card__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.mes-stage-card__num {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 0.82rem;
  background: rgba(22, 163, 74, 0.12);
  color: #4ade80;
  border: 1px solid rgba(22, 163, 74, 0.28);
}

.mes-stage-card__line {
  flex: 1;
  width: 2px;
  min-height: 12px;
  margin-top: 0.35rem;
  background: linear-gradient(180deg, rgba(22, 163, 74, 0.18), rgba(148, 163, 184, 0.08));
}

.mes-stage-card__panel {
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: #f1f5f9;
  padding: 0.7rem 0.8rem;
}

.mes-stage-card--active .mes-stage-card__panel {
  border-color: rgba(251, 146, 60, 0.45);
  box-shadow: 0 0 0 1px rgba(251, 146, 60, 0.12);
}

.mes-stage-card--overdue .mes-stage-card__panel {
  border-color: rgba(248, 113, 113, 0.4);
}

.mes-stage-card__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.25rem;
}

.mes-stage-card__title {
  font-size: 0.92rem;
}

.mes-stage-card__meta {
  font-size: 0.76rem;
}

.mes-stage-checklist {
  list-style: none;
  margin: 0.45rem 0;
  padding: 0;
}

.mes-stage-checklist__item label {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
}

.mes-stage-card__actions {
  display: flex;
  gap: 0.4rem;
  align-items: center;
  margin-top: 0.5rem;
}

.mes-stage-card__status {
  max-width: 11rem;
}

.mes-stage-card__del {
  color: #f87171;
}

.mes-stage-card--locked .mes-stage-card__panel {
  opacity: 0.72;
}

.mes-stages-mode {
  display: inline-flex;
  gap: 0.25rem;
  margin-bottom: 0.75rem;
  padding: 0.2rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.15);
}

.mes-stages-mode__btn {
  border: 0;
  background: transparent;
  color: #94a3b8;
  padding: 0.35rem 0.75rem;
  border-radius: 8px;
  font-size: 0.8rem;
  cursor: pointer;
}

.mes-stages-mode__btn--active {
  background: rgba(22, 163, 74, 0.12);
  color: #334155;
}

.mes-stages-hint {
  margin: 0 0 0.65rem;
  font-size: 0.76rem;
}

.mes-process-flow {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mes-flow-row__arrow {
  text-align: center;
  color: #64748b;
  font-size: 1.1rem;
  line-height: 1;
  padding: 0.15rem 0;
}

.mes-flow-row__head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.35rem;
}

.mes-flow-row__label {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}

.mes-flow-row__lanes {
  display: grid;
  gap: 0.45rem;
}

.mes-flow-row__lanes--parallel {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.mes-flow-card {
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 10px;
  padding: 0.55rem 0.65rem;
  background: #f8fafc;
}

.mes-flow-card strong {
  display: block;
  font-size: 0.88rem;
  margin-bottom: 0.15rem;
}

.mes-flow-card__meta {
  display: block;
  font-size: 0.72rem;
  margin-bottom: 0.35rem;
}

.mes-flow-card__actions {
  display: flex;
  gap: 0.15rem;
}

@media (max-width: 700px) {
  .mes-tech-op-card__edit-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .mes-project-spec-layout {
    grid-template-columns: 1fr;
  }
}

.mes-grid-2--project {
  align-items: start;
  margin-bottom: 14px;
}

.mes-project-calc-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border-radius: 10px;
  background: #f8fafc;
  font-size: 0.78rem;
}

.mes-project-calc-summary div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: #94a3b8;
}

.mes-project-calc-summary strong {
  color: #334155;
}

.mes-project-actions {
  margin-top: 14px;
  justify-content: flex-start;
}

.mes-project-bridge {
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: #f8fafc;
}

.mes-project-bridge__title {
  margin: 0 0 4px;
  font-weight: 600;
  color: #334155;
}

.mes-project-bridge__lead {
  margin: 0 0 12px;
  font-size: 0.9rem;
}

.mes-project-bridge__row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.mes-project-bridge__select {
  min-width: 220px;
  flex: 1 1 220px;
}

.mes-project-bridge--linked,
.mes-project-bridge--empty {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.mes-project-bridge--linked .mes-project-bridge__lead,
.mes-project-bridge--empty .muted {
  margin: 0;
  flex: 1 1 240px;
}

.mes-project-empty {
  padding: 2rem 1rem;
  text-align: center;
}

.mes-project-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #e2e8f0;
}

.mes-project-tabs__btn {
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #64748b;
  border-radius: 999px;
  padding: 0.4rem 0.95rem;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  flex: 0 0 auto;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.mes-project-tabs__btn:hover {
  color: #0f172a;
  border-color: #cbd5e1;
  background: #f8fafc;
}

.mes-project-tabs__btn--active {
  color: #15803d;
  border-color: rgba(22, 163, 74, 0.35);
  background: rgba(22, 163, 74, 0.1);
}

.mes-project-tab-panels {
  display: block;
}

.mes-project-template {
  padding: 0.25rem 0 0.5rem;
}

.mes-project-template__empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 1rem 0 0.25rem;
}

.mes-project-template__fields {
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

.mes-project-template__row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0.75rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.16);
}

.mes-project-template__row dt {
  margin: 0;
  color: #94a3b8;
  font-size: 0.78rem;
  font-weight: 500;
}

.mes-project-template__row dd {
  margin: 0;
  color: #334155;
  font-size: 0.82rem;
  font-weight: 600;
  text-align: right;
}

.mes-project-template__hint {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
}

.mes-card__head--split {
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.mes-settings-crumb {
  margin: 0 0 0.35rem;
  font-size: 0.78rem;
}

.mes-settings-links {
  display: grid;
  gap: 10px;
  margin-top: 0.5rem;
}

.mes-settings-link {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  width: 100%;
  text-align: left;
  padding: 0.9rem 1rem;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.mes-settings-link:hover {
  border-color: rgba(34, 197, 94, 0.35);
  background: rgba(34, 197, 94, 0.08);
}

.mes-settings-link__title {
  font-size: 0.92rem;
  font-weight: 600;
}

.mes-table--templates th,
.mes-table--templates td {
  white-space: nowrap;
}

.mes-table--templates td:first-child {
  white-space: normal;
}

.mes-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mes-toast {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1200;
  padding: 0.75rem 1rem;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(34, 197, 94, 0.4);
  color: #334155;
  font-size: 0.82rem;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.1);
  max-width: min(22rem, calc(100vw - 2rem));
}

.mes-toast--error {
  border-color: rgba(220, 38, 38, 0.45);
  color: #991b1b;
  background: #fff7f7;
}

.mes-tpl-blocks-section {
  margin-top: 0.5rem;
}

.mes-tpl-blocks-section__head {
  margin-bottom: 0.75rem;
}

.mes-tpl-block-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}

.mes-tpl-block-card {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  padding: 0.9rem 1rem;
  background: #f1f5f9;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.mes-tpl-block-card--off {
  opacity: 0.72;
  border-style: dashed;
}

.mes-tpl-block-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.mes-tpl-block-card__title {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 600;
  color: #334155;
}

.mes-tpl-block-card__desc {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.45;
  min-height: 2.2em;
}

.mes-tpl-block-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-size: 0.76rem;
  color: #94a3b8;
}

.mes-tpl-block-card__meta strong {
  color: #334155;
}

.mes-tpl-block-empty {
  margin: 0;
  padding: 1rem 0;
}

.mes-tpl-fields-section {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.mes-table--tpl-fields td {
  vertical-align: top;
}

.mes-tpl-field-hint {
  margin-top: 0.2rem;
  font-size: 0.72rem;
}

.mes-tpl-field-row--off {
  opacity: 0.72;
}

.mes-tpl-list-empty {
  padding: 1rem 0;
  text-align: center;
}

.mes-tpl-list-empty p {
  margin: 0.2rem 0;
}

.mes-tc-list-section {
  margin-top: 1.25rem;
}

.mes-tc-list-empty {
  margin: 0.35rem 0 0.75rem;
  font-size: 0.82rem;
}

.mes-tc-form__field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mes-tc-form__label {
  font-size: 0.8rem;
  font-weight: 500;
  color: #475569;
}

.mes-tc-form__input {
  width: 100%;
}

.mes-tc-form__check {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: #94a3b8;
}

.mes-tc-form__checks {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mes-tc-form__actions {
  margin-top: 1rem;
  padding-top: 0.5rem;
}

.mes-tc-form__meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}

.mes-tc-form__field--error .mes-tc-form__label {
  color: #f87171;
}

.mes-tc-form__field--error .field__input,
.mes-tc-form__field--error .mes-tc-form__input {
  border-color: #f87171;
}

.mes-tc-form__size {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.mes-tc-form__size .mes-tc-form__input {
  flex: 1 1 6rem;
  min-width: 5rem;
}

.mes-tc-create-modal__hint {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
}

.mes-tc-detail__fields {
  margin: 0.75rem 0 0;
}

.mes-tc-detail__row {
  display: grid;
  grid-template-columns: minmax(120px, 38%) 1fr;
  gap: 0.5rem 0.75rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
  font-size: 0.82rem;
}

.mes-tc-detail__row dt {
  margin: 0;
  color: #94a3b8;
}

.mes-tc-detail__row dd {
  margin: 0;
  color: #334155;
}

/* Страница просмотра техкарты */
.mes-tc-view {
  padding-bottom: 1.5rem;
}

.mes-tc-view__hero {
  padding-bottom: 1rem;
  margin-bottom: 0.25rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}

.mes-tc-view__hero-main {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
}

.mes-tc-view__number {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.mes-tc-view__code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.82rem;
  color: #4ade80;
  background: rgba(22, 163, 74, 0.08);
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
}

.mes-tc-view__title {
  margin: 0;
}

.mes-tc-rename-title__view {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.mes-tc-rename-title__form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.15rem;
}

.mes-tc-rename-title__input {
  min-width: min(100%, 16rem);
  flex: 1 1 12rem;
}

.mes-tc-rename-title__edit {
  padding: 0.2rem 0.45rem;
  opacity: 0.75;
}

.mes-tc-rename-title__edit:hover {
  opacity: 1;
}

.mes-tc-view__sub {
  margin: 0.35rem 0 0;
  font-size: 0.8rem;
}

.mes-tc-view__status {
  flex-shrink: 0;
}

.mes-tc-view__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(148, 163, 184, 0.1);
}

.mes-tc-view__actions-empty {
  margin: 0.85rem 0 0;
  font-size: 0.78rem;
}

.mes-tc-view__tabs {
  margin-top: 0.75rem;
  flex-wrap: wrap;
}

.mes-tc-view__panels {
  margin-top: 1rem;
}

.mes-tc-view__meta {
  margin: 0;
}

.mes-tc-view__meta--grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.65rem 1.25rem;
  padding: 1rem;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.14);
}

.mes-tc-view__meta-row {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.mes-tc-view__meta-row dt {
  margin: 0;
  font-size: 0.72rem;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.mes-tc-view__meta-row dd {
  margin: 0;
  font-size: 0.86rem;
  color: #334155;
}

.mes-tc-view__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1rem 0 0.75rem;
}

.mes-tc-view__summary-pill {
  font-size: 0.74rem;
  color: #475569;
  background: rgba(148, 163, 184, 0.1);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
}

.mes-tc-view__section-title {
  margin: 0 0 0.75rem;
  font-size: 0.88rem;
  color: #475569;
}

.mes-tc-view__tab-lead {
  margin: 0 0 1rem;
  font-size: 0.8rem;
}

.mes-tc-view__sections {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mes-tc-view__sections--compact .mes-tc-view__block--compact {
  padding: 0.85rem 1rem;
}

.mes-tc-view__block {
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 12px;
  background: #ffffff;
  padding: 1rem 1.1rem;
}

.mes-tc-view__block-head {
  margin-bottom: 0.75rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.mes-tc-view__block-title {
  margin: 0;
  font-size: 0.92rem;
  color: #0f172a;
}

.mes-tc-view__block-desc {
  margin: 0.35rem 0 0;
  font-size: 0.76rem;
}

.mes-tc-view__fields {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.mes-tc-view__field {
  display: grid;
  grid-template-columns: minmax(140px, 34%) 1fr;
  gap: 0.5rem 0.85rem;
  align-items: start;
  padding: 0.35rem 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}

.mes-tc-view__field:last-child {
  border-bottom: none;
}

.mes-tc-view__field-label {
  margin: 0;
  font-size: 0.78rem;
  color: #94a3b8;
}

.mes-tc-view__field-value {
  margin: 0;
  font-size: 0.84rem;
  color: #334155;
  word-break: break-word;
}

.mes-tc-view__field-value--empty {
  color: #64748b;
  font-style: italic;
}

.mes-tc-view__placeholder {
  min-height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.5rem;
  padding: 2rem 1rem;
  border: 1px dashed rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  background: #f8fafc;
}

.mes-tc-view__placeholder-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(22, 163, 74, 0.08);
  color: #4ade80;
  font-size: 1.1rem;
}

.mes-tc-view__placeholder-title {
  margin: 0;
  font-size: 0.92rem;
  color: #334155;
}

.mes-tc-view__empty-inline {
  margin: 0;
  font-size: 0.82rem;
}

.mes-tpl-material-rules-section {
  padding-top: 0.25rem;
}

.mes-tpl-material-rules__lead {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  max-width: 42rem;
}

.mes-table--tpl-mat-rules td {
  vertical-align: top;
  font-size: 0.8rem;
}

.mes-tpl-mat-rule__cond {
  max-width: 12rem;
}

.mes-tpl-mat-rule__formula {
  display: inline-block;
  padding: 0.15rem 0.35rem;
  border-radius: 6px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.2);
  font-size: 0.72rem;
  color: #4ade80;
  word-break: break-word;
}

.mes-tpl-mat-rule__formula-input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.82rem;
}

.mes-modal__box--wide {
  max-width: 34rem;
}

.mes-tpl-operation-rules-section {
  padding-top: 0.25rem;
}

.mes-tpl-operation-rules__lead {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  max-width: 42rem;
}

.mes-table--tpl-op-rules td {
  vertical-align: top;
  font-size: 0.8rem;
}

.mes-tpl-op-rule__cond {
  max-width: 11rem;
}

.mes-tpl-edit-tabs {
  margin-top: 0.25rem;
}

.mes-wizard-tabs__hint {
  margin: 0 0 1rem;
  font-size: 0.82rem;
}

.mes-wizard-tabs .mes-wizard-tabs__btn--done:not(.mes-project-tabs__btn--active) {
  color: #86efac;
  border-color: rgba(34, 197, 94, 0.35);
}

.mes-field-advanced {
  margin: 0.5rem 0 0.75rem;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 10px;
  padding: 0.55rem 0.75rem;
  background: #f8fafc;
}

.mes-field-advanced > summary {
  cursor: pointer;
  font-size: 0.84rem;
  color: #94a3b8;
  user-select: none;
}

.mes-field-advanced__body {
  margin-top: 0.75rem;
  display: grid;
  gap: 0.65rem;
}

.mes-tc-next-step {
  margin: 0 0 1.1rem;
  padding: 0.95rem 1rem;
  border-radius: 12px;
  border: 1px solid rgba(34, 197, 94, 0.32);
  background: rgba(34, 197, 94, 0.08);
}

.mes-tc-next-step__title {
  margin: 0 0 0.35rem;
  font-size: 0.92rem;
}

.mes-tc-next-step__text {
  margin: 0;
  font-size: 0.82rem;
}

.mes-tc-next-step__actions {
  margin-top: 0.75rem;
}

.mes-projects-filters {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  margin: 0.65rem 0 1rem;
  padding: 0.22rem;
  border-radius: var(--mes-radius-lg, 0.625rem);
  border: 1px solid #e2e8f0;
  background: var(--mes-table-head, #f1f5f9);
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-projects-filters__btn {
  border: none;
  background: transparent;
  color: #64748b;
  border-radius: var(--mes-radius-md, 0.5rem);
  padding: 0.42rem 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    background 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease;
}

.mes-projects-filters__btn:hover {
  color: #0f172a;
  background: rgba(255, 255, 255, 0.85);
}

.mes-projects-filters__btn--active {
  border: none;
  background: #16a34a;
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.22);
}

.mes-project-list__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}

.mes-projects-import {
  position: relative;
}

.mes-projects-import__btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.mes-projects-import__caret {
  font-size: 0.7rem;
  opacity: 0.75;
}

.mes-projects-import-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 40;
  min-width: 260px;
  max-width: min(360px, 92vw);
  max-height: 320px;
  overflow: auto;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #0f172a;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

.mes-projects-import-menu__lead {
  margin: 0 8px 8px;
  font-size: 0.72rem;
  line-height: 1.35;
  color: #64748b;
}

.mes-projects-import-menu__empty {
  margin: 0;
  padding: 8px;
  font-size: 0.78rem;
}

.mes-projects-import-menu__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  padding: 8px 10px;
  background: transparent;
  color: #e2e8f0;
  font-size: 0.82rem;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s;
}

.mes-projects-import-menu__item:hover {
  background: rgba(255, 255, 255, 0.06);
}

.mes-projects-import-menu__item--active {
  background: rgba(56, 189, 248, 0.12);
}

.mes-projects-import-menu__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mes-projects-import-menu__tag {
  flex-shrink: 0;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}

.mes-tpl-preview {
  padding-top: 0.5rem;
}

.mes-tpl-preview__lead {
  margin: 0 0 1rem;
  font-size: 0.82rem;
}

.mes-tpl-preview__block {
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: #ffffff;
  padding: 1rem 1.1rem;
  margin-bottom: 0.85rem;
}

.mes-tpl-preview__block-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: #334155;
}

.mes-tpl-preview__block-desc {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
}

.mes-tpl-preview__fields {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.85rem 1rem;
  margin-top: 0.85rem;
}

.mes-tpl-preview__field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mes-tpl-preview__label-row {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  min-height: 1.1rem;
}

.mes-tpl-preview__label {
  font-size: 0.8rem;
  font-weight: 500;
  color: #475569;
}

.mes-tpl-preview__req {
  color: #f87171;
  font-weight: 700;
  margin-left: 0.15rem;
}

.mes-tpl-preview__info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid rgba(148, 163, 184, 0.45);
  color: #94a3b8;
  font-size: 0.62rem;
  font-weight: 700;
  font-style: italic;
  line-height: 1;
  margin-left: 0.2rem;
  cursor: help;
  flex-shrink: 0;
}

.mes-tpl-preview__input {
  width: 100%;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: #eef2f7;
  color: #64748b;
  padding: 0.5rem 0.65rem;
  font-size: 0.8rem;
}

.mes-tpl-preview__check {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: #94a3b8;
}

.mes-tpl-preview__checks {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.mes-tpl-preview__file {
  border: 1px dashed rgba(148, 163, 184, 0.35);
  border-radius: 10px;
  padding: 0.65rem 0.75rem;
  font-size: 0.78rem;
  background: #f1f5f9;
}

.mes-tpl-preview__table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.76rem;
}

.mes-tpl-preview__table th,
.mes-tpl-preview__table td {
  border: 1px solid rgba(148, 163, 184, 0.22);
  padding: 0.35rem 0.5rem;
  color: #64748b;
}

.mes-tpl-preview__table th {
  color: #94a3b8;
  font-weight: 600;
  background: #f8fafc;
}

.mes-tpl-preview__empty,
.mes-tpl-preview__no-fields,
.mes-tpl-preview__empty-value {
  margin: 0;
  font-size: 0.8rem;
}

.mes-table--compact th,
.mes-table--compact td {
  padding: 0.35rem 0.45rem;
  font-size: 0.76rem;
}

.mes-storage-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  align-items: stretch;
}

.mes-storage-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  padding: 12px;
  background: #ffffff;
}

.mes-storage-card h3 {
  margin: 0 0 6px;
  font-size: 0.9rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  min-height: calc(1.35em * 2);
}

.mes-storage-card__meta {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  min-height: calc(1.35em * 2);
}

.mes-storage-card__mat {
  font-size: 0.78rem;
  color: #818cf8;
  margin: 6px 0 0;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mes-storage-card__actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
  padding-top: 12px;
}

.mes-storage-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.mes-storage-import {
  position: relative;
  cursor: pointer;
}

.mes-storage-card__legacy {
  margin-top: 4px;
}

.mes-storage-card__legacy summary {
  cursor: pointer;
  font-size: 0.78rem;
  list-style: none;
}

.mes-storage-card__legacy summary::-webkit-details-marker {
  display: none;
}

.mes-storage-card__legacy-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px;
}

.mes-fs-page {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
  gap: 0;
}

.mes-fs-header {
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1rem;
}

.mes-fs-header__title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
}

.mes-fs-header__hint {
  margin: 0.35rem 0 0;
  font-size: 0.85rem;
}

.mes-fs-error {
  margin: 0 0 0.75rem;
}

.mes-fs-body {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.mes-fs-loading {
  padding: 2rem;
  text-align: center;
}

.mes-fs-disk-wrap,
.mes-fs-explorer {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.mes-fs-disk-wrap__hint {
  margin: 0 0 1rem;
  font-size: 0.85rem;
}

.mes-fs-section-label {
  margin: 0 0 0.75rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-dim);
}

.mes-fs-disk-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 16rem;
  width: 100%;
  padding: 1.5rem;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent);
  color: inherit;
  cursor: pointer;
  text-align: center;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.mes-fs-disk-card:hover {
  border-color: var(--mod-mes-border);
  box-shadow: 0 8px 24px rgba(34, 197, 94, 0.12);
}

.mes-fs-disk-card__icon {
  font-size: 2.75rem;
  line-height: 1;
  margin-bottom: 0.75rem;
}

.mes-fs-disk-card__title {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
}

.mes-fs-disk-card__letter {
  margin: 0.25rem 0 0;
  font-size: 0.75rem;
}

.mes-fs-disk-card__bar {
  width: 100%;
  height: 8px;
  margin-top: 1rem;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
}

.mes-fs-disk-card__bar-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--mod-mes), #8b5cf6);
}

.mes-fs-disk-card__meta {
  margin: 0.35rem 0 0;
  font-size: 0.68rem;
}

.mes-fs-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 0.5rem;
  margin-bottom: 0.75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.2);
}

.mes-fs-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  flex: 1;
  min-width: 0;
  padding: 0.35rem 0.5rem;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.25);
  font-size: 0.82rem;
}

.mes-fs-breadcrumb__btn {
  border: 0;
  background: transparent;
  color: #475569;
  cursor: pointer;
  padding: 0;
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mes-fs-breadcrumb__btn:hover {
  color: #fff;
}

.mes-fs-breadcrumb__sep {
  color: #475569;
  margin: 0 2px;
}

.mes-fs-delete-btn {
  color: #fca5a5 !important;
}

.mes-fs-grid-wrap {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0.25rem;
}

.mes-fs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
  gap: 0.65rem;
}

.mes-fs-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.75rem 0.5rem;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-align: center;
  transition: background 0.12s;
}

.mes-fs-item:hover {
  background: #f1f5f9;
}

.mes-fs-item--active {
  background: var(--mod-mes-soft);
  box-shadow: inset 0 0 0 1px var(--mod-mes-border);
}

.mes-fs-item__icon {
  font-size: 2.5rem;
  line-height: 1;
}

.mes-fs-item__icon--folder {
  filter: saturate(1.2);
}

.mes-fs-item__thumb {
  width: 3rem;
  height: 3rem;
  border-radius: 8px;
  object-fit: cover;
}

.mes-fs-item__name {
  margin-top: 0.5rem;
  font-size: 0.72rem;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  width: 100%;
}

.mes-fs-item__meta {
  margin-top: 0.2rem;
  font-size: 0.62rem;
}

.mes-fs-empty {
  margin-top: 2rem;
  text-align: center;
  font-size: 0.85rem;
}

.mes-fs-drop {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
}

.mes-fs-drop--active {
  background: rgba(34, 197, 94, 0.12);
  backdrop-filter: blur(2px);
}

.mes-fs-drop__box {
  max-width: 18rem;
  padding: 2rem 2.5rem;
  border-radius: 16px;
  border: 2px dashed #cbd5e1;
  background: #ffffff;
  text-align: center;
  box-shadow: 0 16px 48px rgba(15, 23, 42, 0.12);
}

.mes-fs-drop--active .mes-fs-drop__box {
  border-color: var(--mod-mes-border);
}

.mes-fs-drop__title {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
}

.mes-fs-drop__hint {
  margin: 0.35rem 0 0;
  font-size: 0.75rem;
}

.mes-fs-drop__bar {
  width: 12rem;
  height: 6px;
  margin: 0.75rem auto 0;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
}

.mes-fs-drop__bar-fill {
  height: 100%;
  border-radius: 999px;
  background: var(--mod-mes);
  transition: width 0.2s;
}

.mes-fs-file-input {
  display: none;
}

.mes-project-task-templates {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* ── Project tasks tab (clean) ── */
.mes-proj-tasks {
  gap: 1rem;
}

.mes-proj-tasks-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.mes-proj-tasks-bar__text {
  margin: 0;
  font-size: 0.82rem;
  color: #94a3b8;
}

.mes-proj-tasks-bar__link {
  flex-shrink: 0;
  font-size: 0.82rem;
}

.mes-proj-tasks-live {
  padding: 4px 0 8px;
}

.mes-proj-tasks-live__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.mes-proj-tasks-live__head--sticky {
  position: sticky;
  top: 0;
  z-index: 6;
  padding: 10px 0 12px;
  margin-top: -4px;
  background: linear-gradient(180deg, var(--bg, #f4f6fb) 70%, rgba(244, 246, 251, 0.85));
  backdrop-filter: blur(6px);
}

.mes-proj-tasks-live__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: #334155;
}

.mes-proj-task-filters {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  padding: 0.22rem;
  border-radius: var(--mes-radius-lg, 0.625rem);
  border: 1px solid #e2e8f0;
  background: var(--mes-table-head, #f1f5f9);
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-proj-task-filter {
  border: 0;
  border-radius: var(--mes-radius-md, 0.5rem);
  padding: 0.42rem 0.75rem;
  background: transparent;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: color 0.15s, background 0.15s, box-shadow 0.15s;
}

.mes-proj-task-filter:hover {
  color: #0f172a;
  background: rgba(255, 255, 255, 0.85);
}

.mes-proj-task-filter--on {
  color: #ffffff;
  background: #16a34a;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.22);
}

.mes-proj-task-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.mes-proj-task-list.mes-task-check-list {
  max-height: min(56vh, 640px);
}

.mes-proj-task-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  transition: border-color 0.15s, background 0.15s;
}

.mes-proj-task-row:hover {
  border-color: #cbd5e1;
  background: #f8fafc;
}

.mes-proj-task-row__main {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  flex: 1;
}

.mes-proj-task-row__status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 6px;
  flex-shrink: 0;
  background: #64748b;
}

.mes-proj-task-row--todo .mes-proj-task-row__status-dot { background: #fbbf24; }
.mes-proj-task-row--pool .mes-proj-task-row__status-dot { background: #f97316; }
.mes-proj-task-row--pool {
  border-color: #fdba74;
  background: linear-gradient(180deg, #fff7ed 0%, #ffffff 70%);
}
.mes-proj-task-row--doing .mes-proj-task-row__status-dot { background: #fb923c; }
.mes-proj-task-row--done .mes-proj-task-row__status-dot { background: #4ade80; }
.mes-proj-task-row--cancelled .mes-proj-task-row__status-dot { background: #475569; }

.mes-proj-task-row__text {
  min-width: 0;
}

.mes-proj-task-row__title {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.35;
}

.mes-proj-task-row__meta {
  margin: 3px 0 0;
  font-size: 0.76rem;
  color: #64748b;
  line-height: 1.35;
}

.mes-proj-task-row__select {
  width: auto;
  min-width: 130px;
  max-width: 150px;
  flex-shrink: 0;
  font-size: 0.76rem;
  padding: 6px 8px;
  border-radius: 8px;
}

.mes-proj-task-row__actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

.mes-proj-task-row__del {
  min-width: 32px;
  padding: 4px 8px;
  font-size: 1.1rem;
  line-height: 1;
  color: #64748b;
}

.mes-proj-task-row__del:hover {
  color: #f87171;
}

/* ── Global tasks page (?view=tasks) ── */
.mes-tasks-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 1280px;
}

.mes-tasks-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background:
    radial-gradient(700px 180px at 100% 0%, rgba(34, 197, 94, 0.12), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.mes-tasks-hero__kicker {
  margin: 0 0 8px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
}

.mes-tasks-hero__steps {
  margin: 0;
  padding-left: 1.15rem;
  color: #334155;
  font-size: 0.92rem;
  line-height: 1.55;
}

.mes-tasks-hero__steps strong {
  color: #0f172a;
}

.mes-tasks-hero__progress {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 180px;
}

.mes-tasks-hero__ring {
  --pct: 0;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    conic-gradient(#22c55e calc(var(--pct) * 1%), #e2e8f0 0);
  position: relative;
}

.mes-tasks-hero__ring::before {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: #fff;
}

.mes-tasks-hero__ring-value {
  position: relative;
  z-index: 1;
  font-size: 0.92rem;
  font-weight: 800;
  color: #166534;
}

.mes-tasks-hero__progress-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.82rem;
  color: #64748b;
}

.mes-tasks-hero__progress-text strong {
  font-size: 1rem;
  color: #0f172a;
}

.mes-tasks-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.mes-tasks-stat {
  appearance: none;
  border: 1px solid #e2e8f0;
  background: #fff;
  border-radius: 14px;
  padding: 12px 14px;
  text-align: left;
  cursor: pointer;
  transition: transform 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}

.mes-tasks-stat:hover {
  transform: translateY(-1px);
  border-color: #cbd5e1;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.mes-tasks-stat--on {
  border-color: #86efac;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.12);
}

.mes-tasks-stat__value {
  display: block;
  font-size: 1.45rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
}

.mes-tasks-stat__label {
  display: block;
  margin-top: 4px;
  font-size: 0.86rem;
  font-weight: 650;
  color: #334155;
}

.mes-tasks-stat__hint {
  display: block;
  margin-top: 2px;
  font-size: 0.72rem;
  color: #94a3b8;
}

.mes-tasks-stat--pool .mes-tasks-stat__value { color: #c2410c; }
.mes-tasks-stat--doing .mes-tasks-stat__value { color: #2563eb; }
.mes-tasks-stat--done .mes-tasks-stat__value { color: #16a34a; }
.mes-tasks-stat--mine .mes-tasks-stat__value { color: #7c3aed; }
.mes-tasks-stat--urgent .mes-tasks-stat__value { color: #dc2626; }

.mes-task-check--paused {
  border-color: rgba(245, 158, 11, 0.45);
  background: linear-gradient(135deg, #fffbeb 0%, #ffffff 55%);
}

.mes-task-check__pill--paused {
  background: #fef3c7;
  color: #b45309;
}

.mes-task-check__volume {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.mes-task-check__volume-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  font-size: 0.78rem;
  color: #64748b;
}

.mes-task-check__volume-head strong {
  color: #0f172a;
  font-size: 0.86rem;
}

.mes-task-check__volume-track {
  margin-top: 8px;
  height: 6px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}

.mes-task-check__volume-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #16a34a;
}

.mes-task-check__volume-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.mes-task-check__volume-qty {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.mes-task-check__volume-qty .field__input {
  width: 5.5rem;
  padding: 0.35rem 0.5rem;
}

.mes-tasks-skeleton {
  border-radius: 14px;
  background: linear-gradient(90deg, #e2e8f0 0%, #f1f5f9 45%, #e2e8f0 90%);
  background-size: 200% 100%;
  animation: mes-skel 1.1s ease-in-out infinite;
}

.mes-tasks-skeleton--hero {
  height: 110px;
  margin-bottom: 12px;
}

.mes-tasks-skeleton--stat {
  min-height: 84px;
}

.mes-tasks-skeleton--board {
  height: 220px;
  margin-top: 8px;
}

@keyframes mes-skel {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.mes-tasks-page__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.mes-tasks-page__assignee,
.mes-tasks-page__stage {
  min-width: 160px;
  max-width: 220px;
  font-size: 0.78rem;
  padding: 6px 10px;
}

.mes-tasks-page__form {
  max-width: 520px;
}

.mes-tasks-checklist__lead {
  margin: 4px 0 0;
  font-size: 0.82rem;
}

.mes-task-board {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

.mes-task-board--single {
  grid-template-columns: 1fr;
  max-width: 720px;
}

.mes-task-board__col {
  min-width: 0;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  min-height: 220px;
}

.mes-task-board__col--open {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

.mes-task-board__col--done {
  background: linear-gradient(180deg, #f0fdf4 0%, #f8fafc 100%);
  border-color: #bbf7d0;
}

.mes-task-board__col-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
  padding: 2px 4px 12px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.mes-task-board__col-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 750;
  color: #0f172a;
}

.mes-task-board__col-sub {
  margin: 4px 0 0;
  font-size: 0.78rem;
  color: #64748b;
}

.mes-task-board__col-count {
  min-width: 30px;
  height: 28px;
  padding: 0 9px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 750;
  color: #334155;
  background: #fff;
  border: 1px solid #e2e8f0;
}

.mes-task-board__col--done .mes-task-board__col-count {
  color: #166534;
  border-color: #bbf7d0;
  background: #dcfce7;
}

.mes-task-board__empty-card {
  margin: 0;
  padding: 28px 16px;
  text-align: center;
  border-radius: 14px;
  border: 1px dashed #cbd5e1;
  background: rgba(255, 255, 255, 0.7);
  color: #64748b;
  font-size: 0.9rem;
}

.mes-task-board__empty-card strong {
  display: block;
  margin-bottom: 6px;
  color: #0f172a;
  font-size: 1rem;
}

.mes-task-board__empty-card--wide {
  padding: 36px 20px;
}

.mes-task-check-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: min(68vh, 820px);
  overflow: auto;
  padding-right: 2px;
}

.mes-task-project-list {
  /* grid (not flex): flex + details[overflow] fails to grow open items → siblings overlap */
  display: grid;
  gap: 8px;
  max-height: min(68vh, 820px);
  overflow: auto;
  padding-right: 2px;
  align-content: start;
}

.mes-task-project {
  display: block;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  /* overflow:hidden on <details> breaks open-height in flex/grid scroll parents */
  overflow: visible;
}

.mes-task-project:not([open]) {
  overflow: hidden;
}

.mes-task-board__col--done .mes-task-project {
  border-color: #d1fae5;
}

.mes-task-project__summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
  user-select: none;
  transition: background 0.15s ease;
}

.mes-task-project__summary::-webkit-details-marker {
  display: none;
}

.mes-task-project__summary::marker {
  content: "";
}

.mes-task-project__summary:hover {
  background: #f8fafc;
}

.mes-task-project[open] > .mes-task-project__summary {
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}

.mes-task-board__col--done .mes-task-project[open] > .mes-task-project__summary {
  border-bottom-color: #bbf7d0;
  background: #f0fdf4;
}

.mes-task-project__chevron {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background:
    linear-gradient(#64748b, #64748b) center / 8px 2px no-repeat,
    linear-gradient(#64748b, #64748b) center / 2px 8px no-repeat,
    #f1f5f9;
  transition: transform 0.15s ease, background-color 0.15s ease;
}

.mes-task-project[open] > .mes-task-project__summary .mes-task-project__chevron {
  background:
    linear-gradient(#0f172a, #0f172a) center / 8px 2px no-repeat,
    #e2e8f0;
  transform: none;
}

.mes-task-project__title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.92rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.35;
}

.mes-task-project__count {
  flex: 0 0 auto;
  min-width: 26px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 750;
  color: #475569;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}

.mes-task-board__col--done .mes-task-project__count {
  color: #166534;
  background: #dcfce7;
  border-color: #bbf7d0;
}

.mes-task-check-list--nested {
  max-height: none;
  overflow: visible;
  gap: 8px;
  padding: 10px;
}

.mes-task-check {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: start;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease, opacity 0.15s ease;
  animation: mes-task-enter 0.22s ease-out;
}

@keyframes mes-task-enter {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.mes-task-check:hover {
  border-color: #cbd5e1;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.07);
}

.mes-task-check--live {
  border-color: rgba(37, 99, 235, 0.35);
  animation: mes-task-enter 0.22s ease-out, mes-task-pulse 2.2s ease-in-out infinite;
}

@keyframes mes-task-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.12);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
  }
}

.mes-task-check--focus,
.mes-task-check:focus-visible {
  outline: none;
  border-color: rgba(22, 163, 74, 0.55);
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.18);
}

.mes-kbd {
  display: inline-block;
  padding: 0.05rem 0.35rem;
  border-radius: 5px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  font-size: 0.68rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  color: #64748b;
  line-height: 1.4;
}

.mes-tasks-shop-toggle--on {
  background: rgba(22, 163, 74, 0.12);
  color: #15803d;
  border-color: rgba(22, 163, 74, 0.28);
}

.mes-tasks-page--shop .mes-task-check {
  padding: 16px;
  gap: 14px;
}

.mes-tasks-page--shop .mes-task-check__title {
  font-size: 1.05rem;
}

.mes-tasks-page--shop .mes-task-check__actions .btn,
.mes-tasks-page--shop .mes-task-check__volume-actions .btn {
  min-height: 44px;
  padding: 0.65rem 1rem;
  font-size: 0.95rem;
  border-radius: 12px;
}

.mes-tasks-page--shop .mes-tasks-stats {
  position: sticky;
  bottom: 0;
  z-index: 7;
  margin: 0 -4px;
  padding: 10px 4px 12px;
  background: linear-gradient(0deg, var(--bg, #f4f6fb) 55%, rgba(244, 246, 251, 0.75));
  backdrop-filter: blur(8px);
  border-top: 1px solid #e2e8f0;
}

@media (max-width: 900px) {
  .mes-tasks-page--shop .mes-tasks-stats {
    bottom: calc(64px + env(safe-area-inset-bottom, 0px));
  }
}

.mes-tasks-page--shop .mes-tasks-stat {
  min-height: 72px;
  padding: 12px;
}

.mes-tasks-page--shop .mes-tasks-stat__value {
  font-size: 1.6rem;
}

@media (max-width: 720px) {
  .mes-tasks-page--shop .mes-tasks-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .mes-tasks-page--shop .mes-task-check__actions {
    display: grid;
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mes-task-check,
  .mes-task-check--live,
  .mes-tasks-skeleton {
    animation: none !important;
  }
}

.mes-task-check--busy {
  opacity: 0.65;
  pointer-events: none;
}

.mes-task-check--pool {
  border-color: #fdba74;
  background: linear-gradient(180deg, #fff7ed 0%, #ffffff 72%);
}

.mes-task-check--doing {
  border-color: #93c5fd;
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 70%);
}

.mes-task-check--done {
  border-color: #bbf7d0;
  background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 70%);
}

.mes-task-check--done .mes-task-check__title {
  text-decoration: line-through;
  color: #64748b;
  font-weight: 550;
}

.mes-task-check__check {
  position: relative;
  display: inline-flex;
  margin-top: 4px;
  cursor: pointer;
}

.mes-task-check__check input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.mes-task-check__box {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  border: 2px solid #94a3b8;
  background: #fff;
  display: grid;
  place-items: center;
  transition: all 0.15s ease;
}

.mes-task-check__check:hover .mes-task-check__box {
  border-color: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.15);
}

.mes-task-check__check input:checked + .mes-task-check__box {
  border-color: #16a34a;
  background: #22c55e;
  box-shadow: inset 0 0 0 2px #fff;
}

.mes-task-check__check input:checked + .mes-task-check__box::after {
  content: "";
  width: 6px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) translate(-1px, -1px);
}

.mes-task-check__check input:disabled + .mes-task-check__box {
  opacity: 0.4;
  cursor: not-allowed;
  box-shadow: none;
}

.mes-task-check__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.mes-task-check__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.mes-task-check__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

.mes-task-check__title {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 650;
  color: #0f172a;
  line-height: 1.35;
}

.mes-task-check__meta {
  margin: 4px 0 0;
  font-size: 0.8rem;
  color: #64748b;
  line-height: 1.4;
}

.mes-task-check__hint {
  margin: 0;
  font-size: 0.8rem;
  color: #94a3b8;
}

.mes-task-check__pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
}

.mes-task-check__pill--pool {
  color: #c2410c;
  background: #ffedd5;
}

.mes-task-check__pill--todo {
  color: #475569;
  background: #e2e8f0;
}

.mes-task-check__pill--doing {
  color: #1d4ed8;
  background: #dbeafe;
}

.mes-task-check__pill--done {
  color: #166534;
  background: #dcfce7;
}

.mes-task-check__pill--high {
  color: #b91c1c;
  background: #fee2e2;
}

.mes-task-check__del {
  color: #94a3b8;
  min-width: 28px;
}

.mes-task-check__del:hover {
  color: #ef4444;
}

.mes-task-check__timing {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.mes-task-check__time {
  padding: 8px 10px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #eef2f7;
  min-width: 0;
}

.mes-task-check__time--dur {
  background: #f0fdf4;
  border-color: #dcfce7;
}

.mes-task-check--doing .mes-task-check__time--dur {
  background: #eff6ff;
  border-color: #dbeafe;
}

.mes-task-check__time-label {
  display: block;
  font-size: 0.66rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #94a3b8;
  margin-bottom: 2px;
}

.mes-task-check__time strong {
  font-size: 0.84rem;
  font-weight: 650;
  color: #0f172a;
  word-break: break-word;
}

.mes-task-check__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mes-task-check__cta {
  font-weight: 700;
}

@media (max-width: 980px) {
  .mes-task-board,
  .mes-tasks-stats {
    grid-template-columns: 1fr 1fr;
  }
  .mes-tasks-hero {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .mes-task-board,
  .mes-tasks-stats {
    grid-template-columns: 1fr;
  }
  .mes-task-check__timing {
    grid-template-columns: 1fr;
  }
}

/* ── Overview (Обзор) ── */
.mes-ov {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.mes-ov-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 20px 22px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background:
    radial-gradient(720px 200px at 0% 0%, rgba(59, 130, 246, 0.1), transparent 55%),
    radial-gradient(520px 160px at 100% 0%, rgba(34, 197, 94, 0.12), transparent 55%),
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
  animation: mesOvHeroIn 0.35s ease;
}

@keyframes mesOvHeroIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mes-ov-hero {
    animation: none;
  }
}

.mes-ov-hero__kicker {
  margin: 0 0 6px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #15803d;
}

.mes-ov-hero__title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
}

.mes-ov-hero__summary {
  margin: 8px 0 14px;
  font-size: 0.95rem;
  color: #475569;
  line-height: 1.45;
}

.mes-ov-hero__pulse {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #fff;
  max-width: 420px;
}

.mes-ov-hero__pulse strong {
  display: block;
  font-size: 0.88rem;
  color: #0f172a;
}

.mes-ov-hero__pulse span {
  font-size: 0.78rem;
  color: #64748b;
}

.mes-ov-hero__pulse-dot {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 50%;
  flex-shrink: 0;
  background: #22c55e;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}

.mes-ov-hero__pulse--warn .mes-ov-hero__pulse-dot {
  background: #f59e0b;
  box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.18);
}

.mes-ov-hero__pulse--danger .mes-ov-hero__pulse-dot {
  background: #ef4444;
  box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.18);
}

.mes-ov-hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.mes-ov-grid--priority {
  align-items: stretch;
}

.mes-ov-kpis {
  order: 0;
}

.mes-ov-hero__progress {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 180px;
}

.mes-ov-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.mes-ov-kpi {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  text-align: left;
  padding: 14px 14px 12px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: linear-gradient(180deg, #fff, #f8fafc);
  cursor: pointer;
  transition: border-color 0.15s, transform 0.12s, box-shadow 0.15s;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.mes-ov-kpi:hover {
  transform: translateY(-1px);
  border-color: rgba(37, 99, 235, 0.35);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.mes-ov-kpi__value {
  font-size: 1.55rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.mes-ov-kpi__label {
  font-size: 0.8rem;
  font-weight: 700;
  color: #334155;
}

.mes-ov-kpi__hint {
  font-size: 0.72rem;
  color: #94a3b8;
}

.mes-ov-kpi--danger {
  border-color: rgba(239, 68, 68, 0.35);
  background: linear-gradient(180deg, #fff, #fef2f2);
}

.mes-ov-kpi--danger .mes-ov-kpi__value {
  color: #b91c1c;
}

.mes-ov-kpi--pool .mes-ov-kpi__value {
  color: #b45309;
}

.mes-ov-kpi--prod .mes-ov-kpi__value {
  color: #1d4ed8;
}

.mes-ov-kpi--tasks .mes-ov-kpi__value {
  color: #047857;
}

.mes-ov-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 14px;
}

.mes-ov-panel {
  padding: 16px 18px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.mes-ov-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.mes-ov-panel__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-ov-panel__badge {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: #fee2e2;
  color: #b91c1c;
  font-size: 0.72rem;
  font-weight: 800;
}

.mes-ov-empty {
  margin: 0;
  font-size: 0.85rem;
}

.mes-ov-attention {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-ov-attn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}

.mes-ov-attn__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.mes-ov-attn__body strong {
  font-size: 0.86rem;
  color: #0f172a;
}

.mes-ov-attn__body span {
  font-size: 0.76rem;
  color: #64748b;
}

.mes-ov-attn--high {
  background: rgba(239, 68, 68, 0.06);
  border-color: rgba(239, 68, 68, 0.22);
}

.mes-ov-attn--medium {
  background: rgba(245, 158, 11, 0.07);
  border-color: rgba(245, 158, 11, 0.22);
}

.mes-ov-panel--staff {
  margin-top: 12px;
}
.mes-ov-staff__idle {
  margin: 0 0 10px;
  font-size: 0.82rem;
  color: #334155;
}
.mes-ov-staff__idle--warn {
  color: #b45309;
  font-weight: 600;
}
.mes-ov-staff-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mes-ov-staff {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #fff7ed;
}
.mes-ov-staff__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.mes-ov-staff__body strong {
  font-size: 0.86rem;
  color: #0f172a;
}
.mes-ov-staff__body span {
  font-size: 0.78rem;
  color: #475569;
}
.mes-ov-staff__body em {
  font-style: normal;
  font-size: 0.78rem;
  font-weight: 600;
  color: #0f766e;
}
.mes-ov-attn--low {
  background: rgba(34, 197, 94, 0.06);
  border-color: rgba(34, 197, 94, 0.2);
}

.mes-ov-now {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

.mes-ov-now__col {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.mes-ov-now__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 28px;
  margin-bottom: 8px;
}

.mes-ov-now__label {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #94a3b8;
}

.mes-ov-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mes-ov-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-height: 56px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: border-color 0.15s, background 0.15s;
}

.mes-ov-row:hover {
  border-color: rgba(37, 99, 235, 0.35);
  background: #fff;
}

.mes-ov-row__main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.mes-ov-row__main strong {
  font-size: 0.84rem;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mes-ov-row__main span {
  font-size: 0.72rem;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mes-ov-row__go {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  color: #2563eb;
}

.mes-ov-row .mes-task-check__pill {
  flex-shrink: 0;
}

.mes-ov-pipe {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
  min-height: 120px;
}

.mes-ov-pipe__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 72px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.mes-ov-pipe__count {
  font-size: 0.85rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-ov-pipe__bar {
  --h: 20%;
  width: 28px;
  height: 72px;
  border-radius: 8px 8px 4px 4px;
  background: #e2e8f0;
  position: relative;
  overflow: hidden;
}

.mes-ov-pipe__bar::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--h);
  border-radius: 6px 6px 0 0;
  background: linear-gradient(180deg, #60a5fa, #2563eb);
}

.mes-ov-pipe__step:hover .mes-ov-pipe__bar::after {
  background: linear-gradient(180deg, #34d399, #059669);
}

.mes-ov-pipe__label {
  font-size: 0.68rem;
  color: #64748b;
  text-align: center;
  line-height: 1.25;
  max-width: 78px;
}

.mes-ov-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.mes-ov-action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  text-align: left;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  cursor: pointer;
  transition: border-color 0.15s, transform 0.12s, background 0.15s;
}

.mes-ov-action:hover {
  transform: translateY(-1px);
  border-color: rgba(37, 99, 235, 0.35);
  background: #fff;
}

.mes-ov-action strong {
  font-size: 0.92rem;
  color: #0f172a;
}

.mes-ov-action span {
  font-size: 0.78rem;
  color: #64748b;
  line-height: 1.35;
}

.mes-ov-action--primary {
  background: linear-gradient(180deg, #eff6ff, #dbeafe);
  border-color: rgba(37, 99, 235, 0.28);
}

@media (max-width: 1100px) {
  .mes-ov-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .mes-ov-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mes-ov-now {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .mes-ov-hero {
    grid-template-columns: 1fr;
  }
  .mes-ov-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .mes-ov-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mes-ov-actions {
    grid-template-columns: 1fr;
  }
  .mes-ov-attn {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ── Project launch wizard (light, +40% size) ── */
.mes-launch-wizard {
  position: fixed;
  inset: 0;
  z-index: 13000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
}

.mes-launch-wizard__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  border: 0;
  background: rgba(15, 23, 42, 0.38);
  backdrop-filter: blur(6px);
  cursor: pointer;
}

.mes-launch-wizard__box {
  position: relative;
  z-index: 1;
  width: min(1075px, 100%);
  max-height: min(94vh, 1277px);
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0 24px 56px rgba(15, 23, 42, 0.16);
  overflow: hidden;
  color: #0f172a;
}

.mes-launch-wizard__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 24px 28px 14px;
  border-bottom: 1px solid #e2e8f0;
  background: #ffffff;
}

.mes-launch-wizard__eyebrow {
  margin: 0 0 6px;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  font-weight: 600;
}

.mes-launch-wizard__title {
  margin: 0;
  font-size: 1.28rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.mes-launch-wizard__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 16px 28px;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}

.mes-launch-wizard__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  opacity: 0.5;
}

.mes-launch-wizard__step--on,
.mes-launch-wizard__step--done {
  opacity: 1;
}

.mes-launch-wizard__step-num {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  font-weight: 600;
  background: #e2e8f0;
  color: #64748b;
}

.mes-launch-wizard__step--on .mes-launch-wizard__step-num {
  background: rgba(22, 163, 74, 0.14);
  color: #15803d;
  box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.22);
}

.mes-launch-wizard__step--done .mes-launch-wizard__step-num {
  background: rgba(22, 163, 74, 0.12);
  color: #16a34a;
}

.mes-launch-wizard__step-label {
  font-size: 0.76rem;
  color: #64748b;
  text-align: center;
  font-weight: 500;
}

.mes-launch-wizard__step--on .mes-launch-wizard__step-label {
  color: #15803d;
}

.mes-launch-wizard__body {
  padding: 24px 28px;
  overflow: auto;
  flex: 1;
  background: #ffffff;
}

.mes-launch-wizard__ops {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid #e2e8f0;
}

.mes-launch-wizard__ops .mes-tpl-tech-process-section {
  margin: 0;
}

.mes-launch-wizard__ops .mes-project-section-title {
  font-size: 1rem;
}

.mes-launch-wizard__ops .mes-proj-tech-bridge,
.mes-launch-wizard__ops .mes-proj-tech-import {
  margin-top: 12px;
}

.mes-launch-wizard__ops .mes-tech-ops__flow,
.mes-launch-wizard__ops .mes-tech-ops {
  max-height: min(48vh, 560px);
  overflow: auto;
  padding-right: 4px;
}

.mes-launch-panel--compact {
  margin-bottom: 0;
}

.mes-launch-panel--compact .mes-launch-panel__lead {
  margin-bottom: 10px;
}

.mes-launch-route--compact {
  margin-bottom: 0;
  max-height: 160px;
  overflow: auto;
}

.mes-launch-ops-loading,
.mes-launch-ops-err {
  margin: 0;
  padding: 16px 0;
  font-size: 0.88rem;
}

.mes-launch-wizard__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 28px;
  border-top: 1px solid #e2e8f0;
  background: #f8fafc;
}

.mes-launch-wizard__foot-actions {
  display: flex;
  gap: 10px;
}

.mes-launch-wizard [aria-disabled="true"] {
  opacity: 0.45;
  cursor: not-allowed;
}

body.mes-launch-wizard-open #messengerFabShell {
  pointer-events: none;
}

.mes-launch-panel__title {
  margin: 0 0 8px;
  font-size: 1.05rem;
  font-weight: 600;
  color: #0f172a;
}

.mes-launch-panel__lead {
  margin: 0 0 18px;
  font-size: 0.9rem;
  color: #64748b;
  line-height: 1.45;
}

.mes-launch-batch-card {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.mes-launch-batch-card__info {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.mes-launch-batch-card__info strong {
  color: #0f172a;
  font-size: 1rem;
}

.mes-launch-batch-card__order-qty {
  margin-top: 4px;
  font-size: 0.88rem;
  color: #475569;
}

.mes-launch-batch-card__order-qty strong {
  color: #0f172a;
  font-size: 0.95rem;
}

.mes-launch-batch-card__qty-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 220px;
}

.mes-launch-batch-card__qty {
  min-width: 180px;
}

.mes-launch-batch-card__qty-input {
  font-size: 1.35rem !important;
  font-weight: 800;
  letter-spacing: -0.02em;
  padding: 0.7rem 0.85rem !important;
}

.mes-launch-batch-card__presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mes-launch-batch-card__hint {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.35;
}

.mes-launch-already-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}

.mes-order-line-qty {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 120px;
}

.mes-order-line-qty__order {
  font-size: 0.72rem;
  white-space: nowrap;
}

.mes-order-line-qty__launch {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.68rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.mes-order-line-qty__input {
  width: 96px;
  padding: 0.4rem 0.5rem !important;
  font-size: 0.95rem !important;
  font-weight: 700;
}

.mes-launch-route {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}

.mes-launch-route__row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.mes-launch-route__row--warn {
  border-color: rgba(234, 88, 12, 0.35);
  background: #fff7ed;
}

.mes-launch-route__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-top: 6px;
  flex-shrink: 0;
  background: #94a3b8;
}

.mes-launch-route__dot--ok { background: #16a34a; }
.mes-launch-route__dot--warn { background: #ea580c; }
.mes-launch-route__dot--muted { background: #cbd5e1; }

.mes-launch-route__text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.mes-launch-route__text strong {
  font-size: 0.92rem;
  color: #0f172a;
}

.mes-launch-route__text .muted {
  font-size: 0.8rem;
}

.mes-launch-blockers {
  margin: 0 0 14px;
  padding: 12px 14px 12px 32px;
  border-radius: 12px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 0.84rem;
}

.mes-launch-soft-note {
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #047857;
  font-size: 0.84rem;
  font-weight: 600;
}

.mes-launch-fix-btn {
  margin-top: 6px;
}

.mes-launch-task-list {
  max-height: 392px;
  overflow: auto;
}

.mes-launch-summary {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 18px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.mes-launch-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  font-size: 0.9rem;
}

.mes-launch-summary__row span {
  color: #64748b;
}

.mes-launch-summary__row strong {
  color: #0f172a;
}

.mes-launch-material-hint {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 0.84rem;
  color: #15803d;
  background: rgba(22, 163, 74, 0.08);
  border: 1px solid rgba(22, 163, 74, 0.22);
}

.mes-launch-material-hint--warn {
  color: #c2410c;
  background: #fff7ed;
  border-color: rgba(234, 88, 12, 0.28);
}

.mes-launch-success {
  text-align: center;
  padding: 32px 16px 12px;
}

.mes-launch-success__icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 14px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  color: #16a34a;
  background: rgba(22, 163, 74, 0.12);
}

.mes-launch-success__title {
  margin: 0 0 10px;
  font-size: 1.25rem;
  color: #0f172a;
}

.mes-launch-success__lead {
  margin: 0 0 22px;
  font-size: 0.9rem;
  color: #64748b;
}

.mes-launch-success__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.mes-launch-loading {
  text-align: center;
  padding: 40px 0;
  color: #64748b;
}

.mes-launch-wizard__steps--5 {
  grid-template-columns: repeat(5, 1fr);
}

.mes-launch-template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(252px, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.mes-launch-template-card {
  padding: 16px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mes-launch-template-card:hover {
  border-color: rgba(22, 163, 74, 0.35);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.mes-launch-template-card__title {
  margin: 0;
  font-size: 0.92rem;
  color: #0f172a;
}

.mes-launch-template-card__meta {
  margin: 0;
  font-size: 0.78rem;
}

.mes-launch-template-empty {
  margin: 0;
  grid-column: 1 / -1;
  font-size: 0.88rem;
}

.mes-launch-setup-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.mes-launch-wizard .mes-modal__close {
  color: #64748b;
}

.mes-launch-wizard .mes-modal__close:hover {
  color: #0f172a;
  background: #f1f5f9;
}

@media (max-width: 720px) {
  .mes-launch-wizard__steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .mes-launch-batch-card {
    flex-direction: column;
    align-items: stretch;
  }
}

.mes-proj-task-empty-inline {
  margin: 0;
  padding: 20px 0;
  font-size: 0.84rem;
  text-align: center;
}

.mes-proj-tasks-template {
  border-top: 1px solid #e2e8f0;
  padding-top: 8px;
}

.mes-proj-tasks-template__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 4px;
  cursor: pointer;
  font-size: 0.84rem;
  color: #94a3b8;
  list-style: none;
  user-select: none;
}

.mes-proj-tasks-template__summary::-webkit-details-marker {
  display: none;
}

.mes-proj-tasks-template__summary::before {
  content: "▸";
  margin-right: 8px;
  transition: transform 0.15s;
  color: #64748b;
}

.mes-proj-tasks-template[open] .mes-proj-tasks-template__summary::before {
  transform: rotate(90deg);
}

.mes-proj-tasks-template__count {
  font-size: 0.72rem;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
}

.mes-proj-tasks-template__body {
  padding: 0 4px 8px;
}

.mes-proj-tasks-template__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.mes-proj-task-tpl-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mes-proj-task-tpl-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.mes-proj-task-tpl-row:hover,
.mes-proj-task-tpl-row:focus-visible {
  background: #f8fafc;
  border-color: rgba(255, 255, 255, 0.06);
  outline: none;
}

.mes-proj-task-tpl-row__idx {
  width: 22px;
  font-size: 0.72rem;
  color: #64748b;
  text-align: center;
  flex-shrink: 0;
}

.mes-proj-task-tpl-row__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mes-proj-task-tpl-row__title {
  font-size: 0.84rem;
  color: #334155;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mes-proj-task-tpl-row__meta {
  font-size: 0.72rem;
  color: #64748b;
}

.mes-proj-task-tpl-row__acts {
  display: flex;
  gap: 2px;
  opacity: 0;
  transition: opacity 0.15s;
}

.mes-proj-task-tpl-row:hover .mes-proj-task-tpl-row__acts,
.mes-proj-task-tpl-row:focus-within .mes-proj-task-tpl-row__acts {
  opacity: 1;
}

.mes-proj-task-empty {
  padding: 16px 0;
  text-align: center;
}

.mes-proj-task-empty__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

@media (max-width: 640px) {
  .mes-proj-task-row {
    flex-direction: column;
    align-items: stretch;
  }
  .mes-proj-task-row__actions {
    width: 100%;
    justify-content: space-between;
  }
  .mes-proj-task-row__select {
    max-width: none;
    flex: 1;
  }
  .mes-tasks-page__filters {
    width: 100%;
  }
  .mes-tasks-page__assignee,
  .mes-tasks-page__stage {
    max-width: none;
    width: 100%;
  }
  .mes-proj-tasks-bar {
    flex-direction: column;
    align-items: flex-start;
  }
}

.mes-task-tpl-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.mes-task-tpl-table__desc {
  font-size: 0.75rem;
  margin-top: 0.2rem;
}

.mes-task-tpl-table__actions {
  white-space: nowrap;
}

.mes-task-tpl-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

@media (max-width: 640px) {
  .mes-task-tpl-form__grid {
    grid-template-columns: 1fr;
  }
}

.mes-task-tpl-created {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.mes-task-tpl-created__item {
  padding: 0.75rem 0.9rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #ffffff;
}

.mes-task-tpl-created__meta {
  margin-top: 0.25rem;
  font-size: 0.78rem;
}

.mes-task-tpl-created-title {
  margin-top: 0.5rem;
}

.mes-templates-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mes-templates-subnav {
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  width: fit-content;
}

.mes-templates-subnav__btn {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 1.2rem;
  min-height: 2.25rem;
  background: transparent;
  color: #64748b;
  font: inherit;
  font-weight: 600;
  font-size: 0.875rem;
  letter-spacing: -0.01em;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.15s ease;
}

.mes-templates-subnav__btn:hover:not(.mes-templates-subnav__btn--active) {
  color: #0f172a;
  background: #f1f5f9;
}

.mes-templates-subnav__btn:active:not(.mes-templates-subnav__btn--active) {
  transform: scale(0.98);
}

.mes-templates-subnav__btn:focus-visible {
  outline: 2px solid rgba(22, 163, 74, 0.45);
  outline-offset: 2px;
}

.mes-templates-subnav__btn--active {
  background: linear-gradient(180deg, #22c55e 0%, #16a34a 100%);
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.28);
}

.mes-templates-subnav__btn--active:hover {
  color: #ffffff;
  background: linear-gradient(180deg, #4ade80 0%, #16a34a 100%);
}

.mes-task-tpl-set-card__count {
  font-size: 0.82rem;
  color: var(--mod-mes-text);
  margin: 0.35rem 0 0.75rem;
}

.mes-task-tpl-set-editor__meta {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.mes-task-tpl-groups {
  display: grid;
  gap: 14px;
}

.mes-task-tpl-group {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.mes-task-tpl-group__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid #eef2f7;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.mes-task-tpl-group__title-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
  min-width: 0;
}

.mes-task-tpl-group__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.mes-task-tpl-group__count {
  font-size: 0.78rem;
  color: #64748b;
}

.mes-task-tpl-group__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mes-task-tpl-group__body {
  padding: 14px 16px 16px;
  background: #ffffff;
}

.mes-task-tpl-group__stage {
  font-size: 0.72rem;
}

.mes-task-tpl-form__group-hint {
  margin: 0 0 12px;
  font-size: 0.82rem;
  line-height: 1.45;
}

/* Modern task-template dialogs */
.mes-tpl-dialog__box {
  width: min(640px, 100%);
  padding: 0;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #ffffff;
  box-shadow:
    0 24px 48px rgba(15, 23, 42, 0.16),
    0 0 0 1px rgba(255, 255, 255, 0.6) inset;
  overflow: hidden;
}

.mes-tpl-dialog__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 1.15rem 1.25rem 1rem;
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(22, 163, 74, 0.1) 0%, transparent 55%),
    #ffffff;
  border-bottom: 1px solid #eef2f7;
}

.mes-tpl-dialog__brand {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}

.mes-tpl-dialog__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 14px;
  color: #15803d;
  background: rgba(22, 163, 74, 0.12);
  box-shadow: inset 0 0 0 1px rgba(22, 163, 74, 0.18);
}

.mes-tpl-dialog__icon--task {
  color: #0f766e;
  background: rgba(13, 148, 136, 0.12);
  box-shadow: inset 0 0 0 1px rgba(13, 148, 136, 0.18);
}

.mes-tpl-dialog__title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
  line-height: 1.25;
}

.mes-tpl-dialog__subtitle {
  margin: 0.2rem 0 0;
  font-size: 0.8rem;
  color: #64748b;
  line-height: 1.35;
}

.mes-tpl-dialog__close {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 10px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.mes-tpl-dialog__close:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.mes-tpl-dialog__body {
  display: grid;
  gap: 14px;
  padding: 1.1rem 1.25rem 0.35rem;
}

.mes-tpl-dialog__callout {
  margin: 0;
  padding: 0.75rem 0.9rem;
  border-radius: 12px;
  border: 1px solid rgba(22, 163, 74, 0.16);
  background: rgba(22, 163, 74, 0.06);
  color: #334155;
  font-size: 0.82rem;
  line-height: 1.45;
}

.mes-tpl-dialog__fields {
  display: grid;
  gap: 12px;
}

.mes-tpl-dialog__fields .mes-field > span {
  font-size: 0.8rem;
  font-weight: 600;
  color: #475569;
  letter-spacing: -0.01em;
}

.mes-tpl-dialog__fields .field__input {
  width: 100%;
  box-sizing: border-box;
  margin-top: 0.35rem;
  min-height: 3.1rem;
  padding: 0.85rem 0.95rem;
  font-size: 0.95rem;
  line-height: 1.35;
  border-radius: 12px;
  border: 1px solid #dbe3ef;
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.02);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mes-tpl-dialog__fields select.field__input {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 3.35rem;
  min-height: 3.35rem;
  padding: 0 2.75rem 0 0.95rem;
  line-height: 3.35rem;
  background-color: #ffffff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.95rem center;
  background-size: 1rem;
  cursor: pointer;
}

.mes-tpl-dialog__fields .field__input:hover {
  border-color: #cbd5e1;
}

.mes-tpl-dialog__fields .field__input:focus {
  outline: none;
  border-color: rgba(22, 163, 74, 0.55);
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.15);
}

.mes-tpl-dialog__foot {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  padding: 1rem 1.25rem 1.2rem;
  margin-top: 0.5rem;
  border-top: 1px solid #eef2f7;
  background: #f8fafc;
}

.mes-tpl-dialog__foot .btn {
  min-height: 2.45rem;
  padding: 0.55rem 1.05rem;
  border-radius: 12px;
  font-weight: 600;
}

.mes-tpl-dialog__foot .btn-primary {
  background: linear-gradient(180deg, #22c55e 0%, #16a34a 100%);
  border-color: transparent;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.28);
}

.mes-tpl-dialog__foot .btn-primary:hover {
  background: linear-gradient(180deg, #4ade80 0%, #16a34a 100%);
}

.mes-tpl-dialog__foot .btn-secondary {
  background: #ffffff;
  border: 1px solid #dbe3ef;
  color: #334155;
}

.mes-tpl-dialog__foot .btn-secondary:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.mes-warehouse-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}

.mes-warehouse-filters {
  margin-bottom: 14px;
}

.mes-warehouse-search {
  flex: 1 1 240px;
  max-width: 420px;
}

.mes-warehouse-meta {
  font-size: 0.78rem;
}

.mes-table--warehouse td,
.mes-table--warehouse th {
  white-space: nowrap;
}

.mes-table--warehouse td:first-child {
  white-space: normal;
  min-width: 180px;
}

.mes-wh-row--empty {
  opacity: 0.72;
}

.mes-wh-qty {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.mes-wh-qty--zero {
  color: #f87171;
}

.mes-project-workspace__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

@media (max-width: 900px) {
  .mes-project-workspace__actions {
    justify-content: flex-start;
    width: 100%;
  }
}

.mes-proj-status-filters {
  margin-bottom: 14px;
}

.mes-table-wrap--project-status {
  overflow-x: auto;
}

.mes-table--project-status {
  table-layout: fixed;
  width: 100%;
  min-width: 1040px;
}

.mes-table--project-status .mes-proj-status-col--project {
  width: 30%;
}

.mes-table--project-status .mes-proj-status-col--status {
  width: 9%;
}

.mes-table--project-status .mes-proj-status-col--stage {
  width: 17%;
}

.mes-table--project-status .mes-proj-status-col--progress {
  width: 13%;
}

.mes-table--project-status .mes-proj-status-col--hours {
  width: 8%;
}

.mes-table--project-status .mes-proj-status-col--ready {
  width: 11%;
}

.mes-table--project-status .mes-proj-status-col--counts {
  width: 12%;
}

.mes-table--project-status th,
.mes-table--project-status td {
  vertical-align: middle;
}

.mes-table--project-status th:first-child,
.mes-table--project-status td:first-child {
  white-space: normal;
}

.mes-table--project-status .mes-proj-status-cell--stage,
.mes-table--project-status .mes-proj-status-cell--stage .mes-badge {
  white-space: normal;
}

.mes-table--project-status .mes-proj-status-th-num,
.mes-table--project-status .mes-proj-status-cell--progress,
.mes-table--project-status .mes-proj-status-cell--hours,
.mes-table--project-status .mes-proj-status-cell--counts {
  text-align: right;
}

.mes-table--project-status .mes-proj-status-th-date,
.mes-table--project-status .mes-proj-status-cell--ready {
  text-align: center;
}

.mes-proj-status-row {
  cursor: pointer;
}

.mes-proj-status-row:hover {
  background: rgba(22, 163, 74, 0.06);
}

.mes-proj-status-row--overdue {
  background: rgba(248, 113, 113, 0.05);
}

.mes-modal--project-live {
  /* When the dialog is taller than the viewport, plain `center` clips the header. */
  align-items: flex-start;
  justify-content: center;
  padding: 1.25rem 1rem;
  overflow-y: auto;
}

.mes-modal--project-live .mes-proj-live-box {
  width: min(96vw, 1480px);
  max-width: none;
  max-height: calc(100vh - 2.5rem);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
}

.mes-modal--project-live .mes-card__head {
  flex: 0 0 auto;
  padding: 12px 18px 10px;
  margin: 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

.mes-proj-live-box__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 12px 18px 6px;
}

.mes-modal--project-live .mes-modal__actions {
  flex: 0 0 auto;
  margin: 0;
  padding: 10px 18px 14px;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  background: #fff;
}

.mes-proj-live__hero {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
  padding: 10px 14px;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid rgba(148, 163, 184, 0.22);
}

.mes-proj-live__hero-main {
  min-width: min(100%, 420px);
  flex: 1 1 420px;
}

.mes-proj-live__eyebrow {
  margin: 0 0 4px;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mes-proj-live__hero h3 {
  margin: 0 0 6px;
  font-size: 1.28rem;
  line-height: 1.3;
}

.mes-proj-live__meta {
  margin: 0;
  max-width: 52rem;
}

.mes-proj-live__kpis {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.mes-proj-live__kpi {
  min-width: 88px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mes-proj-live__kpi strong {
  font-size: 1.2rem;
}

.mes-proj-live__grid {
  display: grid;
  grid-template-columns: 1.1fr 1.05fr 0.95fr;
  gap: 10px 14px;
  align-items: start;
}

.mes-proj-live__stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mes-proj-live__section {
  margin: 0;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: #fff;
  min-width: 0;
}

.mes-proj-live__section--now,
.mes-proj-live__section--ops,
.mes-proj-live__section--people,
.mes-proj-live__section--stages {
  grid-column: auto;
  grid-row: auto;
}

.mes-proj-live__table-wrap {
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 12px;
  overflow-x: auto;
  background: #fff;
}

.mes-proj-live__volume-lead {
  margin: 0 0 0.75rem;
  font-size: 0.9rem;
}
.mes-proj-live__volume-table th.mes-proj-live__num,
.mes-proj-live__volume-table td.mes-proj-live__num {
  text-align: right;
  white-space: nowrap;
}
.mes-proj-live__section--volume {
  margin-bottom: 1.25rem;
}

.mes-proj-live__table {
  margin: 0;
  min-width: 560px;
}

.mes-proj-live__table th,
.mes-proj-live__table td {
  vertical-align: middle;
}

.mes-proj-live__table td .mes-proj-live__actors {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.mes-proj-live__num {
  text-align: right;
  white-space: nowrap;
  width: 2.5rem;
  font-variant-numeric: tabular-nums;
}

.mes-proj-live__row--doing {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.07), transparent 48%);
}

.mes-proj-live__row--done {
  background: linear-gradient(90deg, rgba(22, 163, 74, 0.06), transparent 48%);
}

.mes-proj-live__section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
}

.mes-proj-live__section-head h4 {
  margin: 0;
}

.mes-proj-live__credit-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(37, 99, 235, 0.25);
  border-radius: 12px;
  background: rgba(37, 99, 235, 0.06);
}

.mes-proj-live__credit-bar p {
  margin: 0;
  flex: 1;
}

.mes-proj-live__credit-bar .btn {
  flex-shrink: 0;
  white-space: nowrap;
}

.mes-proj-live__cost {
  margin: 0 0 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.mes-proj-live__cost-head {
  margin-bottom: 0.75rem;
}

.mes-proj-live__cost-head h4 {
  margin: 0 0 0.2rem;
  font-size: 0.95rem;
}

.mes-proj-live__cost-head p {
  margin: 0;
  font-size: 0.8rem;
  max-width: 40rem;
}

.mes-proj-live__cost-sub {
  margin: 0.85rem 0 0.5rem;
  font-size: 0.85rem;
  font-weight: 600;
}

.mes-proj-live__cost-table-wrap {
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 12px;
  overflow-x: auto;
  background: #fff;
}

.mes-proj-live__cost-table {
  margin: 0;
  min-width: 420px;
}

.mes-proj-live__cost-table tfoot td {
  background: #f8fafc;
  border-top: 1px solid rgba(226, 232, 240, 0.95);
}

.mes-proj-live__cost-num {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.mes-proj-live__cost-empty {
  margin: 0;
  font-size: 0.8rem;
}

.mes-proj-live__finish-banner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 12px;
  background: #eff6ff;
}

.mes-proj-live__finish-banner--done {
  border-color: rgba(22, 163, 74, 0.2);
  background: #f0fdf4;
}

.mes-proj-live__finish-banner strong {
  display: block;
  font-size: 1rem;
  margin-bottom: 0.2rem;
}

.mes-proj-live__finish-banner p {
  margin: 0;
}

.mes-proj-live__finish-banner__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  flex-shrink: 0;
}

.mes-proj-live__finish-banner__stats span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 0.65rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(37, 99, 235, 0.16);
  font-size: 0.82rem;
  font-weight: 600;
  color: #1e3a8a;
}

.mes-modal--project-live .mes-proj-live__finish-btn {
  min-width: 10.5rem;
}

.mes-proj-live-finish-box {
  width: min(92vw, 560px);
}

.mes-proj-live-finish__body {
  padding: 0 1.1rem 0.4rem;
}

.mes-proj-live-finish__summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.mes-proj-live-finish__summary > div {
  padding: 0.75rem 0.85rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.28);
}

.mes-proj-live-finish__summary span {
  display: block;
  font-size: 0.78rem;
  margin-bottom: 0.15rem;
}

.mes-proj-live-finish__summary strong {
  display: block;
  font-size: 1.35rem;
  line-height: 1.2;
}

.mes-proj-live-finish__summary p {
  margin: 0.35rem 0 0;
  font-size: 0.8rem;
  line-height: 1.35;
}

.mes-proj-live-finish__lead {
  margin: 0 0 0.75rem;
  font-size: 0.92rem;
}

.mes-proj-live-finish__choices {
  display: grid;
  gap: 0.55rem;
}

.mes-proj-live-finish__choice {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.7rem;
  align-items: start;
  margin: 0;
  padding: 0.85rem 0.9rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 12px;
  cursor: pointer;
  background: #fff;
}

.mes-proj-live-finish__choice:has(input:checked) {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.25);
}

.mes-proj-live-finish__choice input {
  margin-top: 0.2rem;
}

.mes-proj-live-finish__choice strong {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 0.98rem;
}

.mes-proj-live-finish__choice small {
  display: block;
  color: #64748b;
  font-size: 0.82rem;
  line-height: 1.4;
}

@media (max-width: 640px) {
  .mes-proj-live__finish-banner {
    flex-direction: column;
  }

  .mes-proj-live-finish__summary {
    grid-template-columns: 1fr;
  }
}

.mes-proj-live__section h4 {
  margin: 0 0 12px;
  font-size: 0.98rem;
}

.mes-proj-live__now-stages {
  margin: 0 0 10px;
}

.mes-proj-live__tasks {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-proj-live__task {
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(241, 245, 249, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.2);
}

.mes-proj-live__task-head {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: flex-start;
}

.mes-proj-live__task-meta {
  margin-top: 6px;
  font-size: 0.9rem;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mes-proj-live__actors {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
}

.mes-proj-live__stage-people {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.mes-proj-live__stage-person {
  display: inline-flex;
  align-items: baseline;
  gap: 0.2rem;
  max-width: 100%;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.25;
  background: #f1f5f9;
  color: #334155;
  border: 1px solid rgba(148, 163, 184, 0.28);
}

.mes-proj-live__stage-person--doing {
  background: rgba(14, 165, 233, 0.12);
  border-color: rgba(14, 165, 233, 0.28);
  color: #0369a1;
}

.mes-proj-live__actor {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}

.mes-proj-live__actor-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(37, 99, 235, 0.28);
  background: rgba(239, 246, 255, 0.95);
  color: #1e3a8a;
  font: inherit;
  font-size: 0.86rem;
  line-height: 1.3;
  cursor: pointer;
  text-align: left;
}

.mes-proj-live__actor-btn:hover {
  border-color: rgba(37, 99, 235, 0.5);
  background: #dbeafe;
}

.mes-proj-live__actor-static {
  display: inline-flex;
  padding: 0.15rem 0;
}

.mes-proj-live__fix-btn {
  padding: 0.1rem 0.45rem;
  font-size: 0.75rem;
  line-height: 1.3;
  color: #9a3412;
  border-color: rgba(154, 52, 18, 0.28);
}

.mes-proj-live__fix-btn:hover {
  background: rgba(154, 52, 18, 0.08);
}

.mes-proj-live__queue-edit {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}

.mes-modal--project-live-edit {
  z-index: 320;
}

.mes-proj-live-edit-box {
  width: min(440px, 100%);
  padding: 0;
  overflow: hidden;
}

.mes-proj-live-edit-box--credit {
  width: min(720px, 96vw);
  max-height: min(90vh, 900px);
  display: flex;
  flex-direction: column;
}

.mes-proj-live-edit-box--credit .mes-card__title {
  font-size: 1.35rem;
}

.mes-proj-live-edit-box--credit .mes-card__head .muted {
  font-size: 1rem;
  line-height: 1.45;
}

.mes-proj-live-edit-box--credit .mes-proj-live-edit-box__body {
  padding: 16px 22px 12px;
  gap: 16px;
  overflow: hidden;
  flex: 1;
  min-height: 0;
}

.mes-proj-live-edit-box--credit .field__label {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 8px;
}

.mes-proj-live-edit-box--credit .field__input {
  font-size: 1.05rem;
  min-height: 48px;
  padding: 10px 14px;
}

.mes-proj-live-credit-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px;
  max-height: min(52vh, 480px);
  overflow: auto;
  padding: 4px 2px 8px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 14px;
  background: #f8fafc;
}

.mes-proj-live-credit-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  cursor: pointer;
  font-size: 1.05rem;
  line-height: 1.35;
}

.mes-proj-live-credit-item:hover {
  border-color: rgba(37, 99, 235, 0.45);
  background: rgba(37, 99, 235, 0.04);
}

.mes-proj-live-credit-item input {
  width: 20px;
  height: 20px;
  margin-top: 2px;
  flex-shrink: 0;
  accent-color: #2563eb;
}

.mes-proj-live-credit-item__name {
  display: block;
  font-weight: 600;
  color: #0f172a;
}

.mes-proj-live-credit-item__meta {
  display: block;
  margin-top: 2px;
  color: #64748b;
  font-size: 0.95rem;
}

.mes-proj-live-edit-box--credit .mes-modal__actions {
  padding: 14px 22px 18px;
  gap: 12px;
}

.mes-proj-live-edit-box--credit .mes-modal__actions .btn {
  min-height: 48px;
  padding: 12px 22px;
  font-size: 1.05rem;
}

.mes-proj-live-edit-box__body {
  padding: 14px 18px 8px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mes-proj-live-edit__lead {
  margin: 0;
  color: #64748b;
  font-size: 0.92rem;
  line-height: 1.4;
}

.mes-proj-live-edit__actions {
  padding: 12px 18px 16px;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  justify-content: space-between;
}

.mes-proj-live__people {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
}

.mes-proj-live__person {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #f8fafc;
}

.mes-proj-live__person--doing {
  border-color: rgba(234, 88, 12, 0.35);
  background: rgba(255, 247, 237, 0.95);
}

.mes-proj-live__person--done {
  border-color: rgba(22, 163, 74, 0.28);
  background: rgba(240, 253, 244, 0.85);
}

.mes-proj-live__person-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mes-proj-live__person-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mes-proj-live__ops {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: none;
  overflow: visible;
}

.mes-proj-live__op {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #f8fafc;
}

.mes-proj-live__op-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  margin-bottom: 4px;
}

.mes-proj-live__stages {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
}

.mes-proj-live__stage {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.18);
}

@media (max-width: 1100px) {
  .mes-proj-live__grid {
    grid-template-columns: 1fr 1fr;
  }

  .mes-proj-live__section--now {
    grid-column: 1;
    grid-row: 1;
  }

  .mes-proj-live__section--ops {
    grid-column: 2;
    grid-row: 1;
  }

  .mes-proj-live__section--people {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .mes-proj-live__section--stages {
    grid-column: 1 / -1;
    grid-row: 3;
  }
}

@media (max-width: 760px) {
  .mes-proj-live__grid {
    grid-template-columns: 1fr;
  }

  .mes-proj-live__section--now,
  .mes-proj-live__section--ops,
  .mes-proj-live__section--people,
  .mes-proj-live__section--stages {
    grid-column: 1;
    grid-row: auto;
  }
}

.mes-proj-status-link {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  cursor: pointer;
  text-align: left;
}

.mes-proj-status-link__meta {
  font-size: 0.74rem;
}

.mes-proj-status-stage {
  display: block;
  font-size: 0.72rem;
  line-height: 1.25;
}

.mes-proj-status-stage-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
}

.mes-proj-status-progress {
  display: grid;
  grid-template-columns: minmax(52px, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin-left: auto;
  max-width: 150px;
}

.mes-proj-status-bar {
  flex: 1;
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2);
  overflow: hidden;
}

.mes-proj-status-bar__fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #16a34a, #22c55e);
}

.mes-proj-status-bar__label {
  font-size: 0.72rem;
  color: #64748b;
  min-width: 2.4rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.mes-table--project-stages td {
  vertical-align: middle;
}

.mes-proj-stages-row {
  cursor: pointer;
}

.mes-proj-stages-row:hover {
  background: rgba(22, 163, 74, 0.08);
}

.mes-proj-stages-row--overdue {
  background: rgba(248, 113, 113, 0.06);
}

.mes-proj-stages-step {
  width: 3rem;
  text-align: center;
  font-weight: 600;
  color: #93c5fd;
}

.mes-proj-stages-meta {
  font-size: 0.82rem;
}

.mes-proj-stages-due {
  white-space: nowrap;
}

/* —— Stages roadmap (active projects + workstation %) —— */
.mes-road-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.mes-road-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 20px 22px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background:
    radial-gradient(640px 180px at 0% 0%, rgba(34, 197, 94, 0.12), transparent 55%),
    radial-gradient(480px 160px at 100% 0%, rgba(59, 130, 246, 0.1), transparent 55%),
    linear-gradient(180deg, #ffffff, #f8fafc);
}

.mes-road-hero__kicker {
  margin: 0 0 6px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #15803d;
}

.mes-road-hero__title {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.mes-road-hero__lead {
  margin: 8px 0 0;
  max-width: 40rem;
  color: #64748b;
  font-size: 0.92rem;
  line-height: 1.45;
}

.mes-road-hero__stats {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.mes-road-stat {
  min-width: 96px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mes-road-stat strong {
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
}

.mes-road-stat span {
  font-size: 0.72rem;
  color: #64748b;
  font-weight: 600;
}

.mes-road-stat--warn strong {
  color: #b91c1c;
}

.mes-road-toolbar {
  display: flex;
}

.mes-road-search {
  position: relative;
  flex: 1;
  max-width: 36rem;
}

.mes-road-search__icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  display: inline-flex;
  pointer-events: none;
}

.mes-road-search__input {
  width: 100%;
  min-height: 48px;
  padding-left: 44px;
  border-radius: 12px;
  font-size: 0.95rem;
}

.mes-road-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 14px;
}

.mes-road-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.mes-road-card:hover {
  border-color: rgba(22, 163, 74, 0.35);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

.mes-road-card__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.mes-road-card__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 750;
  color: #0f172a;
  letter-spacing: -0.01em;
}

.mes-road-card__meta {
  margin: 4px 0 0;
  font-size: 0.8rem;
}

.mes-road-card__pct,
.mes-road-now__pct {
  --pct: 0;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background:
    radial-gradient(circle at center, #fff 58%, transparent 59%),
    conic-gradient(#16a34a calc(var(--pct) * 1%), #e2e8f0 0);
  text-align: center;
}

.mes-road-card__pct strong,
.mes-road-now__pct strong {
  display: block;
  font-size: 0.92rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
}

.mes-road-card__pct span,
.mes-road-now__pct span {
  font-size: 0.62rem;
  color: #64748b;
  font-weight: 600;
}

.mes-road-card__now {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  font-size: 0.86rem;
  color: #1e3a8a;
}

.mes-road-card__now-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #3b82f6;
  box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.18);
  animation: mesRoadPulse 1.6s ease infinite;
}

@keyframes mesRoadPulse {
  50% { box-shadow: 0 0 0 7px rgba(59, 130, 246, 0.08); }
}

@media (prefers-reduced-motion: reduce) {
  .mes-road-card__now-dot { animation: none; }
}

.mes-road-card__foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  font-size: 0.8rem;
}

.mes-road-card__go {
  color: #15803d;
  font-weight: 700;
}

.mes-road-mini {
  --road-fill: 0%;
  list-style: none;
  margin: 0;
  padding: 8px 2px 0;
  display: flex;
  gap: 0;
  overflow-x: auto;
  position: relative;
}

.mes-road-mini::before,
.mes-road-mini::after {
  content: "";
  position: absolute;
  top: 13px;
  left: calc(100% / var(--road-steps, 2) / 2);
  right: calc(100% / var(--road-steps, 2) / 2);
  height: 2px;
  border-radius: 999px;
  pointer-events: none;
}

.mes-road-mini::before {
  background: #e2e8f0;
  z-index: 0;
}

.mes-road-mini::after {
  right: auto;
  width: var(--road-fill);
  max-width: calc(100% - (100% / var(--road-steps, 2)));
  background: linear-gradient(90deg, #86efac, #16a34a 70%, #3b82f6);
  z-index: 0;
}

.mes-road-mini__step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 64px;
  flex: 1 1 0;
  padding: 0 4px;
}

.mes-road-mini__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #cbd5e1;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px #cbd5e1;
}

.mes-road-mini__label {
  font-size: 0.68rem;
  color: #64748b;
  text-align: center;
  line-height: 1.2;
  max-width: 72px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mes-road-mini__pct {
  font-size: 0.68rem;
  font-weight: 800;
  color: #15803d;
}

.mes-road-mini__pct--passed {
  color: #c2410c;
}

.mes-road-mini__step--done .mes-road-mini__dot {
  background: #16a34a;
  box-shadow: 0 0 0 1px #16a34a;
}

.mes-road-mini__step--passed .mes-road-mini__dot {
  background: #f59e0b;
  box-shadow: 0 0 0 1px #f59e0b;
}

.mes-road-mini__step--passed .mes-road-mini__label {
  color: #c2410c;
}

.mes-road-mini__step--current .mes-road-mini__dot {
  background: #2563eb;
  box-shadow: 0 0 0 1px #2563eb, 0 0 0 5px rgba(37, 99, 235, 0.16);
}

.mes-road-mini__step--current .mes-road-mini__label {
  color: #1d4ed8;
  font-weight: 700;
}

.mes-road-mini__step--blocked .mes-road-mini__dot {
  background: #f59e0b;
  box-shadow: 0 0 0 1px #f59e0b;
}

.mes-road-empty-page,
.mes-road-empty {
  margin: 0;
  padding: 24px 8px;
  text-align: center;
}

.mes-road-detail-head {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: flex-start;
}

.mes-road-detail-head__main {
  flex: 1 1 16rem;
}

.mes-road-detail-head__kicker {
  margin: 0 0 4px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #15803d;
}

.mes-road-detail-head__title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-road-detail-head__meta {
  margin: 6px 0 0;
  font-size: 0.86rem;
}

.mes-road-detail-head__actions {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.mes-road-now {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(8rem, 12rem);
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1px solid #bfdbfe;
  background: linear-gradient(180deg, #eff6ff, #ffffff);
}

.mes-road-now__label {
  margin: 0 0 4px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #1d4ed8;
}

.mes-road-now__title {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-road-now__pct {
  width: 88px;
  height: 88px;
}

.mes-road-now__pct strong {
  font-size: 1.05rem;
}

.mes-road-now__overall {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mes-road-now__overall strong {
  font-size: 1.1rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-road-now__overall-bar,
.mes-road-track__bar {
  height: 8px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}

.mes-road-now__overall-bar span,
.mes-road-track__bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #22c55e, #16a34a);
}

.mes-road-detail-card {
  padding-top: 1rem;
}

.mes-road-track {
  list-style: none;
  margin: 0;
  padding: 4px 0 8px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.mes-road-track__item {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
}

.mes-road-track__rail {
  position: relative;
  display: flex;
  justify-content: center;
}

.mes-road-track__node {
  width: 14px;
  height: 14px;
  margin-top: 22px;
  border-radius: 50%;
  background: #cbd5e1;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px #cbd5e1;
  z-index: 1;
}

.mes-road-track__spine {
  position: absolute;
  top: 36px;
  bottom: -8px;
  width: 2px;
  background: #e2e8f0;
}

.mes-road-track__item--done .mes-road-track__node {
  background: #16a34a;
  box-shadow: 0 0 0 1px #16a34a;
}

.mes-road-track__item--done .mes-road-track__spine {
  background: #86efac;
}

.mes-road-track__item--current .mes-road-track__node {
  background: #2563eb;
  box-shadow: 0 0 0 1px #2563eb, 0 0 0 5px rgba(37, 99, 235, 0.16);
}

.mes-road-track__item--passed .mes-road-track__node {
  background: #f59e0b;
  box-shadow: 0 0 0 1px #f59e0b;
}

.mes-road-track__item--passed .mes-road-track__card {
  border-color: #fdba74;
  background: linear-gradient(180deg, #fff7ed, #ffffff);
}

.mes-road-track__item--passed .mes-road-track__kicker {
  color: #c2410c;
}

.mes-road-track__warn {
  margin: 6px 0 0;
  font-size: 0.8rem;
  color: #c2410c;
  line-height: 1.35;
}

.mes-road-track__card {
  margin-bottom: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
}

.mes-road-track__item--current .mes-road-track__card {
  border-color: #93c5fd;
  background: linear-gradient(180deg, #eff6ff, #ffffff);
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.08);
}

.mes-road-track__item--done .mes-road-track__card {
  border-color: #bbf7d0;
  background: linear-gradient(180deg, #f0fdf4, #ffffff);
}

.mes-road-track__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.mes-road-track__kicker {
  margin: 0 0 4px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

.mes-road-track__item--current .mes-road-track__kicker {
  color: #1d4ed8;
}

.mes-road-track__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 750;
  color: #0f172a;
}

.mes-road-track__sub {
  margin: 4px 0 0;
  font-size: 0.82rem;
}

.mes-road-track__ring {
  --pct: 0;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background:
    radial-gradient(circle at center, #fff 56%, transparent 57%),
    conic-gradient(#16a34a calc(var(--pct) * 1%), #e2e8f0 0);
  font-size: 0.78rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-road-track__bar {
  margin: 12px 0 10px;
}

.mes-road-track__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 0.82rem;
}

@media (max-width: 900px) {
  .mes-road-hero {
    grid-template-columns: 1fr;
  }
  .mes-road-now {
    grid-template-columns: 1fr auto;
  }
  .mes-road-now__overall {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .mes-road-now {
    grid-template-columns: 1fr;
  }
  .mes-road-detail-head__actions {
    margin-left: 0;
    width: 100%;
  }
}

.mes-proj-status-hours,
.mes-proj-status-ready,
.mes-proj-status-cell--hours,
.mes-proj-status-cell--ready {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.mes-proj-status-row--late .mes-proj-status-ready,
.mes-proj-status-row--late .mes-proj-status-cell--ready {
  color: #b45309;
  font-weight: 600;
}

.mes-proj-status-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  white-space: normal;
}

.mes-proj-status-counts__ratio {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: #334155;
}

.mes-kpi-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-end;
}

.mes-kpi-toolbar__field {
  min-width: 140px;
  margin: 0;
}

.mes-kpi-toolbar__field > span {
  font-size: 0.72rem;
}

.mes-kpi-view-tabs,
.mes-kpi-employee-filter {
  margin-bottom: 14px;
}

.mes-table--kpi th,
.mes-table--kpi td {
  white-space: nowrap;
}

.mes-table--kpi td:first-child,
.mes-table--kpi th:first-child {
  white-space: normal;
}

.mes-kpi-row {
  cursor: pointer;
}

.mes-kpi-row:hover {
  background: rgba(22, 163, 74, 0.06);
}

.mes-kpi-actions-cell {
  text-align: right;
  width: 1%;
}

/* —— Modern KPI workbench —— */
.mes-kpi-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.mes-kpi-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 20px 22px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background:
    radial-gradient(640px 180px at 0% 0%, rgba(34, 197, 94, 0.12), transparent 55%),
    radial-gradient(520px 160px at 100% 0%, rgba(59, 130, 246, 0.1), transparent 55%),
    linear-gradient(180deg, #ffffff, #f8fafc);
}

.mes-kpi-hero__kicker {
  margin: 0 0 6px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #15803d;
}

.mes-kpi-hero__title {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.mes-kpi-hero__lead {
  margin: 8px 0 0;
  max-width: 40rem;
  color: #64748b;
  font-size: 0.92rem;
  line-height: 1.45;
}

.mes-kpi-hero__ring {
  --pct: 0;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-align: center;
  background:
    radial-gradient(circle at center, #fff 58%, transparent 59%),
    conic-gradient(#16a34a calc(var(--pct) * 1%), #e2e8f0 0);
}

.mes-kpi-hero__ring strong {
  display: block;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
}

.mes-kpi-hero__ring span {
  font-size: 0.65rem;
  color: #64748b;
  font-weight: 600;
}

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

.mes-kpi-summary__card {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mes-kpi-summary__card--ok {
  border-color: #bbf7d0;
  background: linear-gradient(180deg, #f0fdf4, #ffffff);
}

.mes-kpi-summary__card--danger {
  border-color: #fecaca;
  background: linear-gradient(180deg, #fef2f2, #ffffff);
}

.mes-kpi-summary__label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

.mes-kpi-summary__value {
  font-size: 1.55rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

.mes-kpi-summary__hint {
  font-size: 0.78rem;
}

.mes-kpi-panel {
  padding-top: 1rem;
}

.mes-kpi-toolbar-modern {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.mes-kpi-presets {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}

.mes-kpi-preset {
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  border-radius: 999px;
  padding: 0.45rem 0.85rem;
  font-size: 0.82rem;
  font-weight: 650;
  cursor: pointer;
  font-family: inherit;
}

.mes-kpi-preset--on,
.mes-kpi-preset:hover {
  border-color: rgba(22, 163, 74, 0.35);
  background: rgba(22, 163, 74, 0.1);
  color: #15803d;
}

.mes-kpi-dates,
.mes-kpi-controls,
.mes-kpi-emp-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}

.mes-kpi-controls {
  margin-bottom: 14px;
  align-items: center;
}

.mes-kpi-date {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 148px;
  margin: 0;
}

.mes-kpi-date--grow {
  flex: 1 1 16rem;
  max-width: 22rem;
}

.mes-kpi-date > span {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

.mes-kpi-date .field__input {
  min-height: 42px;
  border-radius: 11px;
}

.mes-kpi-tabs {
  display: inline-flex;
  padding: 4px;
  border-radius: 12px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  gap: 2px;
}

.mes-kpi-tab {
  border: 0;
  background: transparent;
  color: #64748b;
  border-radius: 9px;
  padding: 0.55rem 0.95rem;
  font-size: 0.86rem;
  font-weight: 650;
  cursor: pointer;
  font-family: inherit;
}

.mes-kpi-tab--on {
  background: #fff;
  color: #15803d;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.mes-kpi-search {
  position: relative;
  flex: 1 1 14rem;
  min-width: 12rem;
  max-width: 28rem;
}

.mes-kpi-search__icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  display: inline-flex;
  pointer-events: none;
}

.mes-kpi-search__input {
  width: 100%;
  min-height: 42px;
  padding-left: 38px;
  border-radius: 11px;
}

.mes-kpi-layout {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border-radius: 11px;
  border: 1px solid #e2e8f0;
  background: #fff;
}

.mes-kpi-layout__btn {
  width: 36px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  font-size: 0.95rem;
}

.mes-kpi-layout__btn--on,
.mes-kpi-layout__btn:hover {
  background: rgba(22, 163, 74, 0.12);
  color: #15803d;
}

.mes-kpi-grid-entities {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}

.mes-kpi-entity {
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.mes-kpi-entity--emp {
  cursor: pointer;
}

.mes-kpi-entity:hover {
  border-color: rgba(22, 163, 74, 0.35);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

.mes-kpi-entity--emp.mes-kpi-entity--clickable:hover {
  transform: translateY(-1px);
}

.mes-kpi-row--clickable {
  cursor: pointer;
}

.mes-kpi-row--clickable:hover > td {
  background: rgba(22, 163, 74, 0.06);
}

.mes-kpi-entity__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.mes-kpi-entity__title {
  margin: 0;
  font-size: 1.02rem;
  font-weight: 750;
  color: #0f172a;
}

.mes-kpi-entity__meta {
  margin: 4px 0 0;
  font-size: 0.8rem;
}

.mes-kpi-entity__ring {
  --pct: 0;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background:
    radial-gradient(circle at center, #fff 56%, transparent 57%),
    conic-gradient(#16a34a calc(var(--pct) * 1%), #e2e8f0 0);
  font-size: 0.78rem;
  font-weight: 800;
  color: #0f172a;
}

.mes-kpi-entity__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 0.8rem;
  color: #64748b;
}

.mes-kpi-entity__stats em {
  font-style: normal;
  font-weight: 800;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}

.mes-kpi-entity__bad em {
  color: #b91c1c;
}

.mes-kpi-entity__go {
  font-size: 0.82rem;
  font-weight: 700;
  color: #15803d;
}

.mes-kpi-entity__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.mes-kpi-prog {
  --pct: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 110px;
}

.mes-kpi-prog__track {
  flex: 1;
  height: 8px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}

.mes-kpi-prog__fill {
  display: block;
  height: 100%;
  width: calc(var(--pct) * 1%);
  border-radius: inherit;
  background: #16a34a;
}

.mes-kpi-prog--mid .mes-kpi-prog__fill {
  background: #f59e0b;
}

.mes-kpi-prog--low .mes-kpi-prog__fill {
  background: #ef4444;
}

.mes-kpi-prog strong {
  font-size: 0.8rem;
  font-weight: 800;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  min-width: 2.8rem;
}

.mes-kpi-num {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: #0f172a;
}

.mes-kpi-num--muted {
  color: #94a3b8;
  font-weight: 500;
}

.mes-kpi-num--doing {
  color: #2563eb;
}

.mes-kpi-num--done {
  color: #15803d;
}

.mes-kpi-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

.mes-kpi-pill--danger {
  background: #fee2e2;
  color: #b91c1c;
}

.mes-kpi-pill--warn {
  background: #ffedd5;
  color: #c2410c;
}

.mes-kpi-time {
  color: #475569;
  font-variant-numeric: tabular-nums;
}

.mes-kpi-sort {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}

.mes-kpi-sort--on {
  color: #15803d;
}

.mes-kpi-table-wrap {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  overflow: auto;
}

.mes-kpi-empty {
  margin: 0;
  padding: 28px 8px;
  text-align: center;
}

@media (max-width: 1100px) {
  .mes-kpi-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .mes-kpi-hero {
    grid-template-columns: 1fr;
  }
  .mes-kpi-toolbar-modern {
    flex-direction: column;
    align-items: stretch;
  }
}

@media (max-width: 640px) {
  .mes-kpi-summary {
    grid-template-columns: 1fr;
  }
  .mes-kpi-controls {
    align-items: stretch;
  }
  .mes-kpi-tabs,
  .mes-kpi-search,
  .mes-kpi-layout {
    width: 100%;
  }
  .mes-kpi-layout {
    justify-content: center;
  }
}

.mes-modal--kpi-day .mes-modal__box.mes-kpi-day-box {
  width: min(640px, 100%);
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.18);
  padding: 18px 20px;
}

.mes-modal--emp-period .mes-modal__box.mes-emp-period-box {
  width: min(1080px, 100%);
  max-height: min(92vh, 960px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 20px;
  box-shadow: 0 28px 72px rgba(15, 23, 42, 0.2);
  padding: 18px 20px 12px;
  position: relative;
}

.mes-modal--emp-period .mes-emp-period {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-right: 2px;
}

.mes-modal--emp-period .mes-modal__actions {
  flex-shrink: 0;
  margin-top: 0.75rem;
  padding-top: 0.65rem;
  border-top: 1px solid rgba(226, 232, 240, 0.95);
  background: #fff;
}

.mes-emp-period__loading {
  margin: 2rem 0;
  text-align: center;
}

.mes-emp-period__hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border-radius: 16px;
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(22, 163, 74, 0.12), transparent 55%),
    linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  border: 1px solid rgba(226, 232, 240, 0.9);
}

.mes-emp-period__table--summary td:first-child {
  white-space: nowrap;
}

.mes-emp-period__identity {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  min-width: 0;
}

.mes-emp-period__photo,
.mes-emp-period__avatar {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  flex-shrink: 0;
}

.mes-emp-period__photo {
  object-fit: cover;
  border: 1px solid rgba(148, 163, 184, 0.25);
}

.mes-emp-period__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(22, 163, 74, 0.14);
  color: #15803d;
  font-size: 1.25rem;
  font-weight: 700;
}

.mes-emp-period__eyebrow {
  margin: 0 0 2px;
  font-size: 0.75rem;
}

.mes-emp-period__identity h2 {
  margin: 0 0 4px;
  font-size: 1.2rem;
  line-height: 1.25;
}

.mes-emp-period__identity p {
  margin: 0;
  font-size: 0.84rem;
}

.mes-emp-period__accrual {
  text-align: right;
  flex-shrink: 0;
  min-width: 9rem;
}

.mes-emp-period__accrual strong {
  display: block;
  margin: 2px 0 4px;
  font-size: 1.35rem;
  color: #0f172a;
  letter-spacing: -0.02em;
}

.mes-emp-period__accrual-hint {
  display: block;
  font-size: 0.72rem;
  max-width: 12rem;
  margin-left: auto;
}

.mes-emp-period__period {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.9rem;
}

.mes-emp-period__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mes-emp-period__chip {
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: #fff;
  color: #475569;
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
}

.mes-emp-period__chip--active {
  background: rgba(22, 163, 74, 0.12);
  border-color: rgba(22, 163, 74, 0.35);
  color: #15803d;
}

.mes-emp-period__dates {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
}

.mes-emp-period__dates .mes-field {
  margin: 0;
}

.mes-emp-period__dates .field__input {
  min-width: 9.5rem;
}

.mes-emp-period__kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
  margin-bottom: 1rem;
}

.mes-emp-period__kpis article {
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  background: #f8fafc;
}

.mes-emp-period__kpis span {
  display: block;
  font-size: 0.72rem;
  margin-bottom: 0.2rem;
}

.mes-emp-period__kpis strong {
  display: block;
  font-size: 1.05rem;
}

.mes-emp-period__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 1rem;
}

.mes-emp-period__section h3 {
  margin: 0 0 0.65rem;
  font-size: 0.92rem;
}

.mes-emp-period__section {
  margin-bottom: 1rem;
}

.mes-emp-period__table-wrap {
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 12px;
  overflow-x: auto;
  overflow-y: visible;
  background: #fff;
}

.mes-emp-period__table {
  margin: 0;
  min-width: 640px;
}

.mes-emp-period__table th,
.mes-emp-period__table td {
  vertical-align: middle;
}

.mes-emp-period__table tfoot td {
  background: #f8fafc;
  border-top: 1px solid rgba(226, 232, 240, 0.95);
}

.mes-emp-period__num {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.mes-emp-period__more {
  margin: 0.5rem 0 0;
  font-size: 0.78rem;
}

.mes-emp-period__empty {
  margin: 0;
  font-size: 0.84rem;
}

@media (max-width: 820px) {
  .mes-emp-period__hero {
    flex-direction: column;
  }

  .mes-emp-period__accrual {
    text-align: left;
  }

  .mes-emp-period__accrual-hint {
    margin-left: 0;
  }

  .mes-emp-period__kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.mes-kpi-day-eyebrow {
  margin: 0 0 4px;
  font-size: 0.78rem;
}

.mes-kpi-day-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.mes-kpi-day-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.78rem;
  font-weight: 600;
  background: #f1f5f9;
  color: #334155;
}

.mes-kpi-day-chip--done {
  background: rgba(22, 163, 74, 0.12);
  color: #15803d;
}

.mes-kpi-day-chip--open {
  background: rgba(37, 99, 235, 0.1);
  color: #1d4ed8;
}

.mes-kpi-day-section {
  margin-bottom: 14px;
}

.mes-kpi-day-section__title {
  margin: 0 0 8px;
  font-size: 0.92rem;
}

.mes-kpi-day-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-kpi-day-task {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  background: #f8fafc;
}

.mes-kpi-day-task--done {
  border-color: rgba(22, 163, 74, 0.22);
  background: rgba(22, 163, 74, 0.05);
}

.mes-kpi-day-task--doing {
  border-color: rgba(37, 99, 235, 0.22);
  background: rgba(37, 99, 235, 0.05);
}

.mes-kpi-day-task__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.mes-kpi-day-task__when {
  font-size: 0.75rem;
}

.mes-kpi-day-task__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 650;
}

.mes-kpi-day-task__meta,
.mes-kpi-day-empty,
.mes-kpi-day-loading {
  margin: 4px 0 0;
  font-size: 0.8rem;
}

.mes-workbench-page__head {
  margin-bottom: 0.5rem;
}

.mes-wb-list {
  list-style: none;
  margin: 0 0 10px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-wb-list__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.12);
}

.mes-wb-list__item--link {
  cursor: pointer;
}

.mes-wb-list__item--link:hover {
  border-color: rgba(22, 163, 74, 0.35);
}

.mes-wb-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.mes-wb-metrics__item {
  padding: 10px 12px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.12);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mes-wb-metrics__item--danger strong {
  color: #f87171;
}

.mes-wb-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mes-orders-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.mes-orders-actions-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  white-space: nowrap;
}

.mes-table--orders th,
.mes-table--orders td {
  white-space: nowrap;
}

.mes-table--orders td:nth-child(3),
.mes-table--orders td:nth-child(4) {
  white-space: normal;
  max-width: 180px;
}

.mes-orders-row--clickable {
  cursor: pointer;
}

.mes-orders-row--clickable:hover,
.mes-orders-row--clickable:focus-visible {
  background: rgba(22, 163, 74, 0.08);
  outline: none;
}

.mes-orders-row__number {
  color: #86efac;
}

.mes-order-view__eyebrow {
  margin: 0 0 4px;
  font-size: 0.78rem;
}

.mes-modal--order-view .mes-modal__box.mes-order-view {
  width: min(760px, 100%);
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  box-shadow: 0 24px 64px rgba(2, 6, 23, 0.85);
  padding: 20px 22px;
}

.mes-order-view__head {
  margin-bottom: 8px;
}

.mes-order-view__section {
  margin-bottom: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}

.mes-order-view__section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.mes-order-view__section-title {
  margin: 0 0 12px;
  font-size: 0.82rem;
  font-weight: 700;
  color: #475569;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.mes-order-view__section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 12px;
}

.mes-order-view__section-head .mes-order-view__section-title {
  margin: 0;
}

.mes-order-line-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  white-space: nowrap;
}

.mes-order-view__table--lines td:last-child {
  width: 1%;
}

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

.mes-order-view__item {
  display: grid;
  gap: 4px;
}

.mes-order-view__label {
  font-size: 0.72rem;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.mes-order-view__comment,
.mes-order-view__lines {
  margin-bottom: 16px;
}

.mes-order-view__comment p,
.mes-order-view__lines ul {
  margin: 6px 0 0;
  padding-left: 0;
  list-style: none;
}

.mes-order-view__table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 12px;
}

.mes-order-view__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}

.mes-order-view__table th,
.mes-order-view__table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.mes-order-view__table th {
  color: #94a3b8;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: #f8fafc;
}

.mes-order-view__table tbody tr:last-child td {
  border-bottom: 0;
}

.mes-order-view__actions {
  flex-wrap: wrap;
  margin-top: 4px;
  padding-top: 16px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}

@media (max-width: 720px) {
  .mes-order-view__grid {
    grid-template-columns: 1fr;
  }
}

.mes-calendar-page .mes-calendar-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.mes-calendar-nav__title {
  min-width: 160px;
  text-align: center;
  text-transform: capitalize;
  font-size: 0.95rem;
}

.mes-calendar-filters {
  margin-bottom: 16px;
}

.mes-calendar-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.8fr);
  gap: 16px;
}

.mes-calendar-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 6px;
}

.mes-calendar-weekdays span {
  text-align: center;
  font-size: 0.72rem;
  color: #94a3b8;
  font-weight: 600;
}

.mes-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.mes-calendar-day {
  min-height: 78px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 10px;
  background: #f8fafc;
  color: #334155;
  padding: 8px;
  text-align: left;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mes-calendar-day--outside {
  opacity: 0.45;
}

.mes-calendar-day--today {
  border-color: rgba(22, 163, 74, 0.45);
  box-shadow: inset 0 0 0 1px rgba(22, 163, 74, 0.15);
}

.mes-calendar-day--selected {
  background: rgba(22, 163, 74, 0.14);
  border-color: rgba(22, 163, 74, 0.45);
}

.mes-calendar-day__num {
  font-size: 0.82rem;
  font-weight: 700;
}

.mes-calendar-day__dots {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.mes-calendar-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  display: inline-block;
}

.mes-calendar-dot.mes-cal-event--task {
  background: #60a5fa;
}

.mes-calendar-dot.mes-cal-event--stage {
  background: #34d399;
}

.mes-calendar-dot.mes-cal-event--high {
  background: #f87171;
}

.mes-calendar-dot.mes-cal-event--overdue {
  background: #fb7185;
}

.mes-calendar-dot.mes-cal-event--done {
  background: #64748b;
}

.mes-calendar-day__more {
  font-size: 0.68rem;
  color: #94a3b8;
}

.mes-calendar-side {
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  padding: 14px;
  background: #f8fafc;
}

.mes-calendar-side__title {
  margin: 0 0 12px;
  font-size: 0.92rem;
  text-transform: capitalize;
}

.mes-calendar-events {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mes-calendar-event {
  width: 100%;
  text-align: left;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 10px;
  background: #f8fafc;
  color: #334155;
  padding: 10px 12px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mes-calendar-event--task {
  border-left: 3px solid #60a5fa;
}

.mes-calendar-event--stage {
  border-left: 3px solid #34d399;
}

.mes-calendar-event--high {
  border-left-color: #f87171;
}

.mes-calendar-event--overdue {
  border-left-color: #fb7185;
}

.mes-calendar-event--done {
  opacity: 0.72;
}

.mes-calendar-event__type {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}

.mes-calendar-event__title {
  font-size: 0.86rem;
}

.mes-calendar-event__meta {
  font-size: 0.74rem;
}

.mes-calendar-side__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 14px;
}

@media (max-width: 900px) {
  .mes-calendar-layout {
    grid-template-columns: 1fr;
  }

  .mes-calendar-day {
    min-height: 58px;
  }
}

@media (max-width: 1200px) {
  .mes-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mes-pipeline { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .mes-grid-2 { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .mes-app { flex-direction: column; }
  .mes-app__sidebar {
    display: none;
  }
  .mes-app__body {
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
  }
  .mes-mobile-dock {
    display: grid;
  }
  .mes-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mes-pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mes-dash { flex-direction: column; }
  .mes-dash__sidebar { width: 100%; max-height: 40vh; overflow: auto; }

  .mes-tasks-page .mes-tasks-stats {
    position: sticky;
    bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    z-index: 6;
    margin: 0 -4px;
    padding: 10px 4px 12px;
    background: linear-gradient(0deg, var(--bg, #f4f6fb) 55%, rgba(244, 246, 251, 0.82));
    backdrop-filter: blur(8px);
    border-top: 1px solid #e2e8f0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.mes-mobile-dock {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 2px;
  padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
  background: #ffffff;
  border-top: 1px solid #e2e8f0;
  box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.06);
}

.mes-mobile-dock__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 52px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #64748b;
  font-size: 0.68rem;
  font-weight: 600;
  font-family: Inter, system-ui, sans-serif;
  cursor: pointer;
  padding: 4px 2px;
}

.mes-mobile-dock__btn .mes-nav__icon {
  width: 20px;
  height: 20px;
}

.mes-mobile-dock__btn--on {
  color: #15803d;
  background: rgba(22, 163, 74, 0.1);
}

.mes-mobile-dock__btn--more {
  color: #475569;
}

.mes-more-sheet {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.mes-more-sheet[hidden] {
  display: none !important;
}

.mes-more-sheet__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, 0.4);
  cursor: pointer;
}

.mes-more-sheet__panel {
  position: relative;
  z-index: 1;
  width: min(520px, 100%);
  max-height: min(82vh, 720px);
  display: flex;
  flex-direction: column;
  border-radius: 18px 18px 0 0;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-bottom: 0;
  box-shadow: 0 -16px 40px rgba(15, 23, 42, 0.16);
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  animation: mesMoreIn 0.2s ease;
}

@keyframes mesMoreIn {
  from { transform: translateY(24px); opacity: 0.6; }
  to { transform: translateY(0); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .mes-more-sheet__panel { animation: none; }
}

.mes-more-sheet__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px 10px;
  border-bottom: 1px solid #f1f5f9;
}

.mes-more-sheet__brand {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #15803d;
}

.mes-more-sheet__title {
  margin: 2px 0 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
}

.mes-more-sheet__body {
  overflow: auto;
  padding: 10px 12px 16px;
}

.mes-more-sheet__body .mes-nav__section-label {
  margin-top: 8px;
}

body.mes-more-open {
  overflow: hidden;
}

/* —— Dashboard Builder —— */
.mes-dash {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.mes-dash__main {
  flex: 1;
  min-width: 0;
}

.mes-dash__sidebar {
  width: 280px;
  flex-shrink: 0;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 12px;
  background: #f8fafc;
  padding: 0.85rem;
  max-height: calc(100vh - 140px);
  overflow: auto;
}

.mes-dash__sidebar-title {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
}

.mes-dash__sidebar-lead {
  margin: 0 0 0.75rem;
  font-size: 0.78rem;
}

.mes-dash__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  margin: 0.75rem 0 1rem;
}

.mes-dash__history {
  display: inline-flex;
  gap: 0.2rem;
  align-items: center;
}

.mes-dash__history .btn {
  min-width: 2rem;
  padding-inline: 0.45rem;
  font-size: 1rem;
  line-height: 1;
}

.mes-dash__history .btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.mes-dash__toolbar-hint {
  font-size: 0.76rem;
  max-width: 220px;
  line-height: 1.3;
}

.mes-dash__preset-select {
  max-width: 220px;
  font-size: 0.8rem;
}

.mes-dash__preset-save {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.mes-dash__preset-name {
  width: 180px;
  font-size: 0.8rem;
}

.mes-dash-params-edit .mes-tc-form--inline {
  display: grid;
  gap: 0.55rem;
}

.mes-dash-params-edit .mes-tc-form__field {
  margin: 0;
}

.mes-dash-params-edit .mes-tc-form__input,
.mes-dash-params__input {
  font-size: 0.8rem;
  padding: 0.4rem 0.55rem;
}

.mes-dash--edit .mes-dash-widget--edit .mes-dash-params-edit input,
.mes-dash--edit .mes-dash-widget--edit .mes-dash-params-edit textarea,
.mes-dash--edit .mes-dash-widget--edit .mes-dash-params-edit select {
  pointer-events: auto;
}

.mes-dash-params__row--edit {
  align-items: start;
}

.mes-dash-params__hint {
  margin: 0.5rem 0 0;
  font-size: 0.74rem;
}

.mes-dash__save {
  font-size: 0.78rem;
}

.mes-dash-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: 72px;
  gap: 12px;
  min-height: 320px;
  position: relative;
}

.mes-dash-grid--dragging {
  cursor: grabbing;
}

.mes-dash-drop-preview {
  border: 2px dashed rgba(22, 163, 74, 0.5);
  border-radius: 12px;
  background: rgba(22, 163, 74, 0.08);
  pointer-events: none;
  z-index: 1;
}

.mes-dash-drag-ghost {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  pointer-events: none;
  padding: 0.35rem 0.65rem;
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid rgba(22, 163, 74, 0.35);
  color: #334155;
  font-size: 0.78rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  will-change: left, top;
}

.mes-dash-widget--dragging {
  opacity: 0.35;
}

.mes-dash-widget-menu {
  position: absolute;
  z-index: 10000;
  min-width: 168px;
  padding: 0.35rem;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
  display: grid;
  gap: 2px;
}

.mes-dash-widget-menu button {
  border: 0;
  background: transparent;
  color: #334155;
  text-align: left;
  padding: 0.45rem 0.55rem;
  border-radius: 7px;
  font-size: 0.8rem;
  cursor: pointer;
}

.mes-dash-widget-menu button:hover {
  background: rgba(22, 163, 74, 0.12);
}

.mes-dash-widget-menu__danger {
  color: #fca5a5 !important;
}

.mes-dash-catalog__item[draggable="true"] {
  cursor: grab;
}

.mes-dash-catalog__item[draggable="true"]:active {
  cursor: grabbing;
}

.mes-dash-widget {
  position: relative;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.16);
  padding: 0.75rem 0.85rem;
  overflow: hidden;
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.mes-dash--edit .mes-dash-widget {
  border-color: rgba(22, 163, 74, 0.35);
}

.mes-dash-widget--pinned {
  border-color: rgba(34, 197, 94, 0.45);
}

.mes-dash-widget__toolbar {
  position: absolute;
  top: 6px;
  right: 6px;
  display: flex;
  gap: 4px;
  z-index: 2;
}

.mes-dash-widget__drag,
.mes-dash-widget__menu,
.mes-dash-widget__del {
  border: 0;
  background: #ffffff;
  color: #94a3b8;
  border-radius: 6px;
  width: 24px;
  height: 24px;
  cursor: pointer;
  font-size: 0.75rem;
}

.mes-dash-widget__drag {
  cursor: grab;
}

.mes-dash-widget__drag:active {
  cursor: grabbing;
}

.mes-dash-widget__head h3 {
  margin: 0 0 0.5rem;
  font-size: 0.88rem;
}

.mes-dash-widget__body {
  font-size: 0.82rem;
  overflow: auto;
  max-height: calc(100% - 2rem);
}

.mes-dash-widget__resize {
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 14px;
  height: 14px;
  cursor: nwse-resize;
  border-right: 2px solid rgba(148, 163, 184, 0.6);
  border-bottom: 2px solid rgba(148, 163, 184, 0.6);
}

.mes-dash-kpi__value {
  font-size: 1.35rem;
  font-weight: 700;
  color: #86efac;
}

.mes-dash-kpi__sub {
  font-size: 0.78rem;
  color: #94a3b8;
}

.mes-dash-kpi__meta {
  margin-top: 0.35rem;
  font-size: 0.76rem;
}

.mes-dash-kpi--blue .mes-dash-kpi__value {
  color: #93c5fd;
}

.mes-dash-kpi--amber .mes-dash-kpi__value {
  color: #fcd34d;
}

.mes-dash-kpi--gray .mes-dash-kpi__value {
  color: #475569;
}

.mes-dash-metric-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
  gap: 0.65rem;
}

.mes-dash-metric-strip__value {
  font-size: 1.05rem;
  font-weight: 700;
  color: #334155;
}

.mes-dash-metric-strip__label {
  font-size: 0.72rem;
}

.mes-dash-bars {
  display: grid;
  gap: 0.45rem;
}

.mes-dash-bars__row {
  display: grid;
  grid-template-columns: minmax(72px, 1fr) 2fr auto;
  gap: 0.45rem;
  align-items: center;
  font-size: 0.76rem;
}

.mes-dash-bars__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mes-dash-bars__track {
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.18);
  overflow: hidden;
}

.mes-dash-bars__track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #34d399, #22c55e);
}

.mes-dash-bars__value {
  color: #94a3b8;
  font-variant-numeric: tabular-nums;
}

.mes-dash-list {
  margin: 0;
  padding-left: 1rem;
  display: grid;
  gap: 0.35rem;
  font-size: 0.8rem;
}

.mes-dash-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

.mes-dash-timeline__item {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 0.55rem;
  align-items: start;
}

.mes-dash-timeline__dot {
  width: 10px;
  height: 10px;
  margin-top: 0.25rem;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.15);
}

.mes-dash-timeline__body {
  font-size: 0.8rem;
}

.mes-dash-media {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 0.55rem;
}

.mes-dash-media__item {
  margin: 0;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: #f8fafc;
}

.mes-dash-media__item img {
  display: block;
  width: 100%;
  height: 72px;
  object-fit: cover;
}

.mes-dash-media__item figcaption,
.mes-dash-media__file,
.mes-dash-media__link {
  display: block;
  padding: 0.35rem 0.45rem;
  font-size: 0.72rem;
}

.mes-dash-media__item--empty span {
  display: grid;
  place-items: center;
  min-height: 72px;
  color: #64748b;
  font-size: 0.72rem;
  text-align: center;
  padding: 0.35rem;
}

.mes-dash-media__link {
  color: #93c5fd;
  text-decoration: none;
}

.mes-dash-docs {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.45rem;
  font-size: 0.78rem;
}

.mes-dash-docs li {
  display: grid;
  gap: 0.1rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  background: #ffffff;
}

.mes-dash-docs a {
  color: #93c5fd;
}

.mes-dash-note__meta {
  margin: 0.35rem 0 0;
  font-size: 0.76rem;
  color: #94a3b8;
}

.mes-dash-checklist {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.4rem;
}

.mes-dash-checklist__item {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 0.45rem;
  align-items: start;
  font-size: 0.8rem;
}

.mes-dash-checklist__item--done {
  color: #94a3b8;
  text-decoration: line-through;
}

.mes-dash-checklist__box {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  display: grid;
  place-items: center;
  font-size: 0.65rem;
  color: #34d399;
}

.mes-dash-html,
.mes-dash-html-edit {
  font-size: 0.8rem;
  white-space: pre-wrap;
}

.mes-dash-html-edit {
  width: 100%;
  resize: vertical;
}

.mes-dash-warehouse-lead {
  margin: 0 0 0.5rem;
  font-size: 0.76rem;
}

.mes-dash-materials-edit__actions {
  margin-top: 0.55rem;
}

.mes-dash-materials__name {
  min-width: 120px;
}

.mes-dash-materials__qty {
  width: 88px;
}

.mes-dash-materials__unit {
  width: 72px;
}

.mes-dash-wh-picker {
  width: min(520px, calc(100vw - 2rem));
  max-height: min(80vh, 640px);
  display: grid;
  gap: 0.75rem;
}

.mes-dash-wh-picker__list {
  max-height: 360px;
  overflow: auto;
}

.mes-dash-wh-picker__items {
  display: grid;
  gap: 0.35rem;
}

.mes-dash-wh-picker__item {
  display: grid;
  gap: 0.15rem;
  text-align: left;
  width: 100%;
  padding: 0.55rem 0.65rem;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: #f8fafc;
  color: #334155;
  cursor: pointer;
}

.mes-dash-wh-picker__item:hover {
  border-color: rgba(22, 163, 74, 0.4);
  background: rgba(30, 41, 59, 0.85);
}

.mes-dash-purchase-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  margin-top: 0.65rem;
}

.mes-dash-ai-list,
.mes-dash-bottlenecks {
  margin: 0;
  padding-left: 1rem;
  display: grid;
  gap: 0.4rem;
  font-size: 0.8rem;
}

.mes-dash-bottlenecks__reason {
  font-size: 0.74rem;
  color: #94a3b8;
}

.mes-dash-alerts {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.45rem;
}

.mes-dash-alerts__item {
  display: grid;
  gap: 0.15rem;
  padding: 0.5rem 0.6rem;
  border-radius: 8px;
  font-size: 0.78rem;
  border: 1px solid rgba(148, 163, 184, 0.18);
}

.mes-dash-alerts__item--critical {
  border-color: rgba(248, 113, 113, 0.35);
  background: rgba(127, 29, 29, 0.18);
}

.mes-dash-alerts__item--warning {
  border-color: rgba(251, 191, 36, 0.35);
  background: rgba(120, 53, 15, 0.18);
}

.mes-dash-alerts__item--info {
  background: #ffffff;
}

.mes-dash-route {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.35rem;
}

.mes-dash-table-wrap {
  overflow: auto;
  max-height: 100%;
}

.mes-dash-table th,
.mes-dash-table td {
  font-size: 0.76rem;
}

.mes-dash-params-block h4 {
  margin: 0 0 0.35rem;
  font-size: 0.82rem;
}

.mes-dash-params {
  margin: 0 0 0.65rem;
  display: grid;
  gap: 0.25rem;
}

.mes-dash-params__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  font-size: 0.78rem;
}

.mes-dash-text {
  min-height: 3rem;
  outline: none;
  white-space: pre-wrap;
}

.mes-dash-stub {
  display: grid;
  gap: 0.5rem;
}

.mes-dash-catalog__group + .mes-dash-catalog__group {
  margin-top: 0.85rem;
}

.mes-dash-catalog__title {
  margin: 0 0 0.4rem;
  font-size: 0.78rem;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.mes-dash-catalog__items {
  display: grid;
  gap: 0.35rem;
}

.mes-dash-catalog__item {
  text-align: left;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #ffffff;
  color: #334155;
  border-radius: 8px;
  padding: 0.45rem 0.55rem;
  font-size: 0.78rem;
  cursor: pointer;
}

.mes-dash-catalog__item--disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.mes-dash-catalog__tag {
  margin-left: 0.35rem;
  font-size: 0.65rem;
  color: #64748b;
}

.mes-template-dashboard-host,
.mes-tech-card-dashboard {
  margin-top: 0.25rem;
}

.mes-dash__sheets {
  margin-bottom: 0.65rem;
}

.mes-dash__sheet-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.mes-dash__sheet-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 10px;
  background: #ffffff;
  overflow: hidden;
}

.mes-dash__sheet-tab--active {
  border-color: rgba(22, 163, 74, 0.45);
  background: rgba(22, 163, 74, 0.08);
}

.mes-dash__sheet-select {
  border: 0;
  background: transparent;
  color: #334155;
  padding: 0.4rem 0.65rem;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
}

.mes-dash__sheet-tab--active .mes-dash__sheet-select {
  color: #86efac;
}

.mes-dash__sheet-rename,
.mes-dash__sheet-del {
  border: 0;
  background: transparent;
  color: #94a3b8;
  padding: 0.2rem 0.35rem;
  font-size: 0.75rem;
  cursor: pointer;
  line-height: 1;
}

.mes-dash__sheet-rename:hover,
.mes-dash__sheet-del:hover {
  color: #334155;
}

.mes-dash__sheet-del:hover {
  color: #f87171;
}

.mes-dash__sheet-add {
  margin-left: 0.15rem;
}

.mes-dash-hero {
  margin-bottom: 0.25rem;
}

.mes-cut-calc {
  display: grid;
  gap: 0.85rem;
  font-size: 0.82rem;
}

.mes-cut-calc__wh-wrap {
  position: relative;
}

.mes-cut-calc__wh-drop {
  position: absolute;
  z-index: 40;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  max-height: 220px;
  overflow: auto;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
  padding: 0.35rem;
}

.mes-cut-calc__wh-item {
  display: grid;
  gap: 0.15rem;
  width: 100%;
  text-align: left;
  border: 0;
  border-radius: 8px;
  padding: 0.45rem 0.55rem;
  background: transparent;
  color: #334155;
  cursor: pointer;
  font-size: 0.78rem;
}

.mes-cut-calc__wh-item:hover {
  background: rgba(22, 163, 74, 0.12);
}

.mes-cut-calc__wh-hint {
  font-size: 0.72rem;
  margin-top: 0.2rem;
  display: block;
}

.mes-cut-calc__wh-loading,
.mes-cut-calc__wh-empty {
  margin: 0.35rem 0.5rem;
  font-size: 0.76rem;
}

.mes-cut-calc__formula {
  margin: 0 0 0.55rem;
  font-size: 0.74rem;
}

.mes-cut-calc__field--name {
  margin-bottom: 0.15rem;
}

.mes-cut-calc__material-name {
  margin: 0 0 0.55rem;
  font-size: 0.88rem;
}

.mes-cut-calc__material-name strong {
  color: #0f172a;
}

.mes-cut-calc__row--grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 0.55rem;
  align-items: end;
}

.mes-cut-calc__field {
  display: grid;
  gap: 0.25rem;
}

.mes-cut-calc__field span {
  color: #94a3b8;
  font-size: 0.74rem;
}

.mes-cut-calc__field--check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 2.35rem;
}

.mes-cut-calc__hint {
  margin: 0;
  font-size: 0.74rem;
}

.mes-cut-calc__hint code {
  color: #c4b5fd;
}

.mes-cut-calc__lines {
  display: grid;
  gap: 0.4rem;
}

.mes-cut-calc__line {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.35rem;
  align-items: center;
}

.mes-cut-calc__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.mes-cut-calc__metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
  gap: 0.45rem 0.75rem;
  margin-bottom: 0.65rem;
}

.mes-cut-calc__metrics strong {
  display: block;
  font-size: 0.95rem;
  color: #0f172a;
}

.mes-cut-calc__warn {
  color: #fbbf24;
}

.mes-cut-calc__results-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0.5rem 0 0.35rem;
}

.mes-cut-calc__layout-actions {
  justify-content: flex-end;
  margin-top: 12px;
}

.mes-cut-calc__layout-modal {
  width: min(92vw, 52rem);
  max-width: none;
}

.mes-cut-calc__layout-meta {
  margin: 0 0 0.65rem;
  font-size: 0.78rem;
}

.mes-cut-calc__sheets {
  display: grid;
  gap: 0.85rem;
}

.mes-cut-calc__sheet-label {
  margin: 0 0 0.35rem;
  font-size: 0.76rem;
}

.mes-cut-calc__layout-view {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 10px;
  background: #eef2f7;
  padding: 0.65rem;
  overflow: auto;
  max-height: min(68vh, 520px);
  margin-bottom: 0.75rem;
}

.mes-cut-calc__layout-view .mes-cut-calc__svg {
  min-height: 200px;
  max-height: none;
}

.mes-cut-calc__layout-table {
  margin-top: 0;
}

.mes-cut-calc__preview {
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 10px;
  background: #eef2f7;
  padding: 0.5rem;
  overflow: auto;
  max-height: 220px;
}

.mes-cut-calc__svg {
  display: block;
  width: 100%;
  height: auto;
  min-height: 120px;
}

.mes-cut-calc__table {
  margin-top: 0.65rem;
  font-size: 0.78rem;
}

.mes-cut-calc__swatch {
  display: inline-block;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 3px;
  margin-right: 0.35rem;
  vertical-align: middle;
}

.mes-cut-calc__errors {
  margin: 0.35rem 0 0;
  padding-left: 1rem;
  color: #fca5a5;
  font-size: 0.76rem;
}

.mes-cut-calc__results--empty {
  padding: 0.35rem 0;
}


/* EMS light theme — polish layer (appended after mes.css in build) */

.mes-app__main {
  background: #f4f6fb;
}

.mes-icon-btn,
.mes-filter-chip,
.mes-user-chip {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  color: #475569;
}

.mes-icon-btn:hover,
.mes-filter-chip:hover,
.mes-user-chip:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #0f172a;
}

.mes-filter-chip--active {
  background: rgba(22, 163, 74, 0.1);
  border-color: rgba(22, 163, 74, 0.35);
  color: #15803d;
}

.mes-table th {
  background: #f8fafc;
  color: #64748b;
  font-weight: 600;
}

.mes-table tbody tr:hover td {
  background: #f8fafc;
}

.mes-modal__box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 1.25rem 1.35rem;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.14);
}

.mes-modal__box h2,
.mes-modal__box h3,
.mes-modal__box strong {
  color: #0f172a;
}

.mes-field {
  color: #64748b;
}

.mes-op__pill--done {
  color: #15803d !important;
}

.mes-op__pill--progress {
  color: #b45309 !important;
}

.mes-dash__sheet-tab--active .mes-dash__sheet-select {
  color: #15803d;
}

.mes-dash-widget__drag,
.mes-dash-widget__menu,
.mes-dash-widget__del {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  color: #64748b;
  box-shadow: var(--mes-shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.08));
}

.mes-dash-widget__drag:hover,
.mes-dash-widget__menu:hover,
.mes-dash-widget__del:hover {
  background: #f8fafc;
  color: #334155;
}

.mes-dash-drag-ghost {
  background: #ffffff;
  border-color: rgba(22, 163, 74, 0.35);
  color: #334155;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}

.mes-dash-widget-menu {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
}

.mes-dash-widget-menu__danger {
  color: #dc2626 !important;
}

.mes-dash-catalog__item {
  background: #ffffff;
}

.mes-dash-catalog__item:hover:not(.mes-dash-catalog__item--disabled) {
  border-color: rgba(22, 163, 74, 0.35);
  background: rgba(22, 163, 74, 0.06);
}

.mes-dash__sheet-tab {
  background: #ffffff;
}

.mes-fs-drop__box {
  color: #334155;
}

.mes-fs-drop__hint {
  color: #64748b;
}

.mes-projects-table__thumb-frame {
  background: #f1f5f9;
}

.mes-pipeline__step {
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

.mes-pipeline__step--active {
  border-color: rgba(22, 163, 74, 0.45);
  background: rgba(22, 163, 74, 0.06);
}

.mes-constructor__canvas,
.mes-workbench__panel {
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

.mes-chat-tab,
.mes-proj-tabs__btn,
.mes-project-tabs__btn {
  color: #64748b;
}

.mes-chat-tab--active,
.mes-proj-tabs__btn--active,
.mes-project-tabs__btn--active {
  color: #15803d;
  background: rgba(22, 163, 74, 0.1);
  border-color: rgba(22, 163, 74, 0.28);
}

/* Messenger inherits shared chat styles; soften EMS page chrome */
.mes-messenger-page .chat-messenger {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: var(--mes-shadow-sm);
}