:root {
  --mw-font: Inter, "Segoe UI", Arial, sans-serif;
  --mw-night: #07111f;
  --mw-night-raised: #0b1728;
  --mw-canvas: #f7f8fc;
  --mw-surface: rgba(255, 255, 255, .92);
  --mw-surface-soft: #f4f7fb;
  --mw-line: #e0e5ee;
  --mw-line-strong: #cbd4e2;
  --mw-ink: #0b1324;
  --mw-muted: #6c778c;
  --mw-violet: #6f42e8;
  --mw-blue: #167eea;
  --mw-cyan: #12bfd8;
  --mw-lime: #b8f33f;
  --mw-green: #36a852;
  --mw-amber: #c17b00;
  --mw-red: #c9484f;
  --mw-gradient: linear-gradient(112deg, var(--mw-violet), #5060ee 48%, var(--mw-cyan));
  --mw-shadow-sm: 0 2px 7px rgba(16, 26, 46, .05);
  --mw-shadow-md: 0 9px 24px rgba(16, 26, 46, .07), var(--mw-shadow-sm);
  --mw-radius-sm: 8px;
  --mw-radius-md: 12px;
  --mw-radius-lg: 16px;
  --mw-control: 44px;
  --mw-text-xs: 12px;
  --mw-text-sm: 13px;
  --mw-text-md: 14px;
  --mw-text-lg: 18px;
  --mw-title: clamp(30px, 3.1vw, 44px);
  --mw-ease: cubic-bezier(.2, .8, .2, 1);

  /* Backward-compatible aliases; new styles use only --mw-* tokens. */
  --work-night: var(--mw-night); --admin-night: var(--mw-night);
  --work-night-2: var(--mw-night-raised); --admin-night-2: var(--mw-night-raised);
  --work-canvas: var(--mw-canvas); --admin-canvas: var(--mw-canvas);
  --work-card: var(--mw-surface); --admin-card: var(--mw-surface);
  --work-line: var(--mw-line); --admin-line: var(--mw-line); --line: var(--mw-line);
  --work-copy: var(--mw-ink); --admin-copy: var(--mw-ink); --ink: var(--mw-ink);
  --work-muted: var(--mw-muted); --admin-muted: var(--mw-muted); --muted: var(--mw-muted);
  --work-violet: var(--mw-violet); --admin-violet: var(--mw-violet);
  --work-blue: var(--mw-blue); --admin-blue: var(--mw-blue);
  --work-cyan: var(--mw-cyan); --admin-cyan: var(--mw-cyan);
  --work-lime: var(--mw-lime); --admin-lime: var(--mw-lime); --accent: var(--mw-lime);
  --work-shadow: var(--mw-shadow-md); --admin-shadow: var(--mw-shadow-md);
  --work-radius: var(--mw-radius-lg); --admin-radius: var(--mw-radius-lg);
}

html, body, button, input, select, textarea { font-family: var(--mw-font); }
body { font-size: var(--mw-text-md); color: var(--mw-ink); }
.ui-icon { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.eyebrow {
  color: #3048bd;
  font-size: var(--mw-text-xs);
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.workspace-header h1, .admin-header h1 { font-size: var(--mw-title); line-height: 1.06; letter-spacing: -.045em; }
.workspace-header p:last-child, .admin-header p:last-child { color: var(--mw-muted); line-height: 1.5; }

.button, .task-action, .filter-clear {
  min-height: var(--mw-control);
  border-radius: var(--mw-radius-sm);
  font-size: var(--mw-text-sm);
  font-weight: 700;
  transition: transform .16s var(--mw-ease), border-color .16s var(--mw-ease), box-shadow .16s var(--mw-ease), background .16s var(--mw-ease);
}
.button:hover, .task-action:hover:not(:disabled), .filter-clear:hover { transform: translateY(-1px); }
.button-primary, .task-action.is-primary {
  border: 0;
  background: var(--mw-gradient);
  color: #fff;
  box-shadow: 0 7px 16px rgba(80, 96, 238, .22);
}
.button:focus-visible, .task-action:focus-visible, .text-button:focus-visible, .icon-button:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--mw-violet) 24%, transparent);
  outline-offset: 2px;
}

input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  border-color: var(--mw-line-strong);
  border-radius: var(--mw-radius-sm);
  background: #fff;
  color: var(--mw-ink);
  font-size: var(--mw-text-sm);
}
input:not([type="checkbox"]):not([type="radio"]), select { min-height: var(--mw-control); }
textarea { line-height: 1.5; }
label { color: #566176; }

.status, .priority, .process-status, .record-count, .panel-title-row > span {
  min-height: 25px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding-inline: 9px;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: none;
}

.admin-sidebar, body:has(#app-shell:not([hidden])) .sidebar { background: var(--mw-night); }
.admin-nav-item, body:has(#app-shell:not([hidden])) .nav-item { border-radius: 11px; }
.admin-nav-item.is-active, body:has(#app-shell:not([hidden])) .nav-item.is-active {
  border-color: rgba(184, 196, 219, .22);
  background: linear-gradient(100deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
}
.admin-nav-item::after, body:has(#app-shell:not([hidden])) .nav-item::after { width: 5px; border-radius: 5px; background: var(--mw-lime); }

.structure-tree-panel, .structure-inspector, .users-workbench, .positions-workbench, .admin-register,
.application-tree-panel, .application-inspector, .process-catalog-tree, .process-catalog-inspector,
.document-layout > section, .work-list-panel, .work-detail-panel, .process-register, .process-inspector {
  border-color: var(--mw-line);
  border-radius: var(--mw-radius-lg);
  background: var(--mw-surface);
  box-shadow: var(--mw-shadow-md);
}

dialog, .task-drawer, .people-picker {
  border: 1px solid var(--mw-line);
  border-radius: var(--mw-radius-lg);
  background: #fff;
  box-shadow: 0 24px 70px rgba(7, 17, 31, .22);
}
dialog::backdrop { background: rgba(7, 17, 31, .58); backdrop-filter: blur(3px); }
button[aria-label="Закрити"] .ui-icon, button[title="Закрити"] .ui-icon { width: 20px; height: 20px; pointer-events: none; }

.admin-tree-row, .user-list-row, .position-list-row, .doc-row, .process-register-item {
  transition: background .16s var(--mw-ease), color .16s var(--mw-ease), transform .16s var(--mw-ease);
}
.admin-tree-row:hover, .user-list-row:hover, .position-list-row:hover, .doc-row:hover { background: #f1f5fa; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
