:root {
  --shell-bg: #ffffff;
  --shell-text: #172033;
  --shell-muted: #667085;
  --shell-border: #e5e9f2;
  --shell-soft: #f4f6fa;
  --shell-accent: #3157d5;
  --shell-accent-soft: #eaf0ff;
  --shell-shadow: 0 12px 32px rgba(21, 31, 55, .10);
}

.app-shell {
  position: relative;
  z-index: 100;
  margin: 0;
  padding: 0;
  background: var(--shell-bg);
  color: var(--shell-text);
  border-bottom: 1px solid var(--shell-border);
}

.app-shell__inner {
  min-height: 62px;
  max-width: 1480px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  gap: 22px;
}

.app-shell__brand {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--shell-text);
  font-size: 15px;
  font-weight: 850;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.app-shell__brand > .app-shell__logo {
  width: 32px !important;
  min-width: 32px;
  max-width: 32px;
  height: 32px !important;
  min-height: 32px;
  max-height: 32px;
  flex: 0 0 auto;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 6px 10px rgba(79, 92, 190, .22));
}

.app-shell__brand-suffix { color: var(--shell-muted); font-weight: 700; }
.app-shell__env {
  padding: 4px 6px;
  border-radius: 6px;
  background: #fff3d6;
  color: #8a5b00;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.app-global-nav {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}
.app-global-nav::-webkit-scrollbar { display: none; }

.app-global-nav__item,
.app-section-nav__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: var(--shell-text);
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s ease, color .15s ease;
}

.app-global-nav__item {
  min-height: 38px;
  padding: 0 11px;
  font-size: 13px;
  font-weight: 720;
}
.app-global-nav__item:hover { background: var(--shell-soft); text-decoration: none; }
.app-global-nav__item.is-active {
  color: #2447b7;
  background: var(--shell-accent-soft);
}

.app-shell__tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 5px;
}

.app-icon-button {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 10px;
  color: var(--shell-muted);
  background: transparent;
}
.app-icon-button svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.app-icon-button:disabled { cursor: not-allowed; opacity: .46; }
.app-notification-bell{position:relative;overflow:visible}
.app-notification-total,.app-notification-new{position:absolute;display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 4px;border-radius:999px;font-size:9px;font-weight:900;line-height:1;box-sizing:border-box;box-shadow:0 0 0 2px #fff}
.app-notification-total{right:-5px;top:-4px;background:#334155;color:#fff}
.app-notification-new{right:-11px;bottom:-4px;background:#f97316;color:#fff}
.app-notification-total[hidden],.app-notification-new[hidden]{display:none!important}

.app-user-menu { position: relative; }
.app-user-menu > summary {
  min-height: 40px;
  max-width: 245px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 8px 3px 4px;
  border-radius: 12px;
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  font-weight: 750;
}
.app-user-menu > summary::-webkit-details-marker { display: none; }
.app-user-menu > summary:hover,
.app-user-menu[open] > summary { background: var(--shell-soft); }
.app-user-menu__avatar {
  width: 31px;
  height: 31px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  color: #2848b8;
  background: var(--shell-accent-soft);
  font-size: 12px;
  font-weight: 900;
}
.app-user-menu__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-user-menu__chevron { color: var(--shell-muted); font-size: 14px; }

.app-user-menu__popover {
  position: absolute;
  top: calc(100% + 9px);
  right: 0;
  width: min(260px, calc(100vw - 24px));
  padding: 8px;
  border: 1px solid var(--shell-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--shell-shadow);
}
.app-user-menu__popover a,
.app-user-menu__popover > span {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 10px;
  border-radius: 9px;
  color: var(--shell-text);
  text-decoration: none;
  font-size: 13px;
  font-weight: 650;
}
.app-user-menu__popover a:hover { background: var(--shell-soft); text-decoration: none; }
.app-user-menu__popover .is-disabled { color: #98a2b3; cursor: not-allowed; }
.app-user-menu__popover small { font-weight: 650; }
.app-user-menu__identity {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 8px 10px 10px;
  border-bottom: 1px solid var(--shell-border);
  margin-bottom: 5px;
  overflow-wrap: anywhere;
  font-size: 13px;
}
.app-user-menu__identity span { color: var(--shell-muted); font-size: 12px; }
.app-user-menu__separator { height: 1px; margin: 5px 4px; background: var(--shell-border); }

.app-section-nav {
  position: relative;
  z-index: 80;
  border: 0;
  background: transparent;
}
.app-section-nav__inner {
  max-width: 1200px;
  min-height: 0;
  margin: 0 auto;
  padding: 10px 18px 4px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
}
.app-section-nav__inner::-webkit-scrollbar { display: none; }
.operator-stage-nav .app-section-nav__inner {
  align-content: center;
  row-gap: 7px;
}
.app-section-nav__item {
  min-height: auto;
  flex: 0 0 auto;
  padding: 8px 12px;
  border: 1px solid var(--shell-border);
  border-radius: 999px;
  background: var(--shell-bg);
  font-size: 13px;
  font-weight: 750;
}
.app-section-nav__item:hover { border-color: #c7cfdd; background: var(--shell-soft); text-decoration: none; }
.app-section-nav__item.is-active {
  color: #fff;
  border-color: #111827;
  background: #111827;
}
.app-section-nav__item.is-disabled {
  color: #98a2b3;
  border-style: dashed;
  background: rgba(255, 255, 255, .58);
  cursor: not-allowed;
}
.app-subsection-nav{position:relative;z-index:79;background:transparent}.app-subsection-nav__inner{max-width:1200px;margin:0 auto;padding:2px 18px 5px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}.app-subsection-nav__inner::-webkit-scrollbar{display:none}.app-subsection-nav__item{flex:0 0 auto;padding:5px 10px;border-radius:8px;color:#64748b;font-size:12px;font-weight:750;text-decoration:none}.app-subsection-nav__item:hover{color:#0f172a;background:#f1f5f9;text-decoration:none}.app-subsection-nav__item.is-active{color:#1d4ed8;background:#eff6ff}

/* Старый мобильный nav больше не должен резервировать место под новым HUD. */
body .wp-container {
  width: min(100%, 1124px);
  min-width: 0;
  padding: 0 12px;
  padding-bottom: 0;
  box-sizing: border-box;
}
body .wp-page,
body .card,
body .card-body,
body .table-wrap,
body .legacy-table-wrap { min-width: 0; max-width: 100%; box-sizing: border-box; }

.admin-pagehead {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
.admin-pagehead h1 { margin: 0 0 5px; font-size: clamp(24px, 3vw, 32px); }
.admin-pagehead p { margin: 0; color: var(--shell-muted); }
.admin-area-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -6px 0 18px;
}
.admin-overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}
.admin-overview-card {
  min-height: 132px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--shell-border);
  border-radius: 16px;
  color: var(--shell-text);
  background: #fff;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(21, 31, 55, .04);
}
.admin-overview-card:hover { border-color: #b7c5f5; box-shadow: 0 8px 22px rgba(21, 31, 55, .08); text-decoration: none; }
.admin-overview-card.is-attention { border-color: #e9b949; background: #fffdf6; }
.admin-overview-card.is-disabled { color: #98a2b3; background: #fafbfc; box-shadow: none; cursor: not-allowed; }
.admin-overview-card h2 { margin: 0; font-size: 16px; }
.admin-overview-card p { margin: 4px 0 0; color: var(--shell-muted); font-size: 13px; line-height: 1.45; }
.admin-overview-card__metric { font-size: 21px; font-weight: 850; }
.admin-overview-card__status { color: var(--shell-accent); font-size: 12px; font-weight: 800; }

.legacy-catalog {
  padding: 18px;
  border: 1px solid var(--shell-border);
  border-radius: 18px;
  background: #fff;
}
.legacy-catalog__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.legacy-catalog__head h2 { margin: 0 0 4px; font-size: 19px; }
.legacy-catalog__head p { margin: 0; color: var(--shell-muted); font-size: 13px; }
.legacy-catalog__search { width: min(330px, 100%); margin: 0; }
.legacy-catalog__search input { width: 100%; box-sizing: border-box; }
.legacy-group { border-top: 1px solid var(--shell-border); }
.legacy-group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 2px;
  cursor: pointer;
  list-style: none;
}
.legacy-group > summary::-webkit-details-marker { display: none; }
.legacy-group__title { display: flex; flex-direction: column; gap: 3px; }
.legacy-group__title strong { font-size: 14px; }
.legacy-group__title span { color: var(--shell-muted); font-size: 12px; }
.legacy-group__count {
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 999px;
  color: #475467;
  background: var(--shell-soft);
  font-size: 11px;
  font-weight: 800;
}
.legacy-table-wrap { overflow-x: auto; padding-bottom: 12px; }
.legacy-table { min-width: 790px; }
.legacy-table th { color: var(--shell-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.legacy-table td { padding: 10px 8px; vertical-align: middle; }
.legacy-table code { color: #344054; background: #f2f4f7; padding: 3px 6px; border-radius: 6px; font-size: 11px; }
.legacy-table__future { color: #344054; font-size: 12px; }
.legacy-table__status { color: #93610c; font-size: 11px; font-weight: 800; }
.legacy-table__open { font-weight: 800; text-decoration: none; }
.legacy-table__open:hover { text-decoration: none; }
.legacy-empty { display: none; margin: 16px 0 0; color: var(--shell-muted); text-align: center; }

@media (max-width: 1080px) {
  .app-shell__inner { gap: 12px; }
  .app-global-nav__item { padding: 0 8px; }
  .app-user-menu__name { display: none; }
  .admin-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .app-shell__inner {
    min-height: auto;
    padding: 9px 12px 0;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 10px;
  }
  .app-shell__brand-suffix { display: none; }
  .app-shell__tools { justify-self: end; }
  .app-global-nav {
    grid-column: 1 / -1;
    order: 3;
    width: calc(100% + 24px);
    margin-left: -12px;
    padding: 0 12px 8px;
    box-sizing: border-box;
  }
  .app-global-nav__item { min-height: 34px; font-size: 12px; }
  .app-icon-button { display: none; }
  .app-notification-bell { display: inline-grid; }
  .app-user-menu > summary { padding-right: 4px; }
  .app-section-nav__inner { padding: 8px 12px 3px; }
  .admin-pagehead, .legacy-catalog__head { align-items: stretch; flex-direction: column; }
  .legacy-catalog__search { width: 100%; }
}

@media (min-width: 480px) {
  .operator-stage-nav .app-section-nav__inner {
    width: 100%;
    max-width: 1124px;
    box-sizing: border-box;
    flex-wrap: wrap;
    overflow-x: visible;
  }
}

@media (max-width: 540px) {
  .admin-overview-grid { grid-template-columns: 1fr; }
  .admin-overview-card { min-height: 108px; }
  .legacy-catalog { padding: 14px; border-radius: 14px; }
  .legacy-group__title span { display: none; }
}