:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --control-height: 44px;
  --control-height-compact: 36px;
  --font-size-label: .8125rem;
  --font-size-small: .875rem;
  --font-size-section: 1rem;
  --on-accent: #fff;
  --overlay-backdrop: rgba(15, 23, 42, .45);
  --dialog-size-compact: 420px;
  --dialog-size-form: 790px;
  --dialog-size-wide: 1100px;
  --dialog-size-entry: 1120px;
  --dialog-size-picker: 1440px;
  --dialog-size-label: 940px;
  --dialog-size-export: 780px;
  --dialog-size-session: 480px;
  --layer-dialog: 200;
  --layer-loader: 300;
  --layer-toast: 250;
  --layer-session-warning: 1250;
  --motion-fast: .15s;

  --sidebar-bg: #111827;
  --sidebar-border: #1f2937;
  --sidebar-text: #9ca3af;
  --sidebar-text-active: #f9fafb;
  --sidebar-hover: #1f2937;
  --sidebar-active: #1f2937;
  --sidebar-accent: #0369a1;

  --accent: #0369a1;
  --accent-hover: #075985;
  --accent-muted: #eff6ff;

  --bg: #dfe3ea;
  --surface: #ffffff;
  --surface-raised: #f3f5f8;
  --surface-muted: #e9edf2;
  --border: #b8bec9;
  --border-strong: #939bab;
  --text: #0f172a;
  --text-secondary: #334155;
  --text-muted: #5c6574;
  --muted: #64748b;

  --success: #047857;
  --success-bg: #ecfdf5;
  --warning: #b45309;
  --warning-bg: #fffbeb;
  --danger: #b91c1c;
  --danger-bg: #fef2f2;
  --info: #0369a1;
  --info-bg: #eff6ff;

  --radius: 8px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --font: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --sidebar-width: 248px;
  --sidebar-width-collapsed: 68px;
  --content-padding-x: clamp(1rem, 2.5vw, 2rem);
  --content-padding-y: clamp(1rem, 2vw, 1.75rem);
  --focus-ring: 0 0 0 3px rgba(3, 105, 161, 0.32);
  --form-action-bar-height: 76px;

  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.07);
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.09), 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-md: 0 4px 14px rgba(15, 23, 42, 0.11), 0 2px 4px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.14), 0 4px 8px rgba(15, 23, 42, 0.07);
  --shadow-overlay: 0 24px 56px rgba(15, 23, 42, 0.24);

  --list-row-hover: #d4dbe6;

  --brand-navy: var(--sidebar-bg);
  --brand-blue: var(--accent);
  --airbus-navy: var(--sidebar-bg);
  --airbus-blue: var(--accent);
  --primary: var(--accent);
  --primary-hover: var(--accent-hover);
  --primary-light: var(--accent-muted);
  --surface2: var(--surface-raised);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  width: 100%;
  line-height: 1.5;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ── App Shell ── */

.app-shell {
  min-height: 100vh;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}

.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  width: var(--sidebar-width);
  height: 100vh;
  height: 100dvh;
  flex-shrink: 0;
  background: var(--sidebar-bg);
  color: var(--sidebar-text);
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--sidebar-border);
  transition: width 0.2s ease, transform 0.2s ease;
  overflow: hidden;
}

.sidebar-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 16px;
  border-bottom: 1px solid var(--sidebar-border);
}

.sidebar-close {
  display: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius-sm);
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.sidebar-close:hover,
.sidebar-close:focus-visible {
  background: rgba(255, 255, 255, 0.09);
}

.sidebar-close svg {
  width: 20px;
  height: 20px;
}

.sidebar-brand-name {
  display: block;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.35;
}

.sidebar-nav {
  flex: 1;
  min-height: 0;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow-y: auto;
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--sidebar-text);
  font-family: var(--font);
  font-size: 0.875rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.sidebar-link:hover {
  background: var(--sidebar-hover);
  color: var(--sidebar-text-active);
}

.sidebar-link.active {
  background: var(--sidebar-active);
  color: var(--sidebar-text-active);
  box-shadow: inset 3px 0 0 var(--sidebar-accent);
}

.sidebar-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  opacity: 0.9;
}

.sidebar-footer {
  padding: 12px 14px;
  border-top: 1px solid var(--sidebar-border);
}

.sidebar-sync {
  margin-bottom: 12px;
}

.sidebar-sync-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.sidebar-sync-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.sidebar-sync-hint {
  margin: 6px 0 0;
  font-size: 0.75rem;
  line-height: 1.35;
  color: var(--sidebar-text);
  opacity: 0.85;
}

.sidebar-user {
  margin-bottom: 8px;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.sidebar-user-button {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.sidebar-user-button:hover,
.sidebar-user-button:focus-visible {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.06);
  outline: none;
}

.sidebar-user strong {
  display: block;
  color: #e5e7eb;
  font-weight: 600;
}

.sidebar-user span {
  color: var(--sidebar-text);
  font-size: 0.75rem;
}

.app-main {
  margin-left: var(--sidebar-width);
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: calc(100% - var(--sidebar-width));
  height: 100vh;
  height: 100dvh;
  overflow-y: auto;
  overflow-x: hidden;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 60;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px var(--content-padding-x);
  background: var(--surface);
  border-bottom: 1px solid var(--border-strong);
  box-shadow: var(--shadow-xs);
  min-height: 52px;
  width: 100%;
}

.sidebar-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  flex-shrink: 0;
}

.sidebar-toggle svg {
  width: 20px;
  height: 20px;
}

.sidebar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(17, 24, 39, 0.5);
  z-index: 90;
}

.topbar-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 0.875rem;
  color: var(--muted);
  margin-left: auto;
}

.topbar-info-item {
  display: flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.topbar-info-label {
  color: var(--muted);
}

.topbar-site {
  font-size: inherit;
  font-weight: 400;
  color: var(--text);
}

.topbar-access-status {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  line-height: 1.15;
  white-space: nowrap;
}

.topbar-lock-owner {
  color: var(--muted);
  font-size: inherit;
  font-weight: 400;
}

.topbar-meta .badge {
  font-family: inherit;
  font-size: inherit;
  font-weight: 400;
  letter-spacing: normal;
}

.content {
  flex: 1;
  width: 100%;
  padding: var(--content-padding-y) var(--content-padding-x);
}

body.form-action-bar-visible .content {
  padding-bottom: calc(var(--content-padding-y) + var(--form-action-bar-height));
}

.form-action-bar {
  position: fixed;
  bottom: 0;
  left: var(--sidebar-width);
  right: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px var(--content-padding-x);
  background: var(--surface);
  border-top: 1px solid var(--border-strong);
  box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.12);
  min-height: 64px;
}

.form-action-bar.hidden {
  display: none;
}

.form-action-bar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.drop-up-wrap {
  position: relative;
}

.drop-up-menu {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  min-width: 168px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: 6px;
  z-index: 80;
}

.drop-up-menu.hidden {
  display: none;
}

.drop-up-item {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: transparent;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  font: inherit;
  color: var(--text);
  cursor: pointer;
}

.drop-up-item:hover,
.drop-up-item:focus-visible {
  background: var(--surface-muted);
  outline: none;
}

.md-dialog--pick .md-dialog-body {
  padding-top: 8px;
}

.md-dialog--pick .md-pick-search {
  margin-bottom: 0;
}

.md-pick-list {
  max-height: min(50vh, 360px);
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.md-pick-item {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: transparent;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  font: inherit;
  font-size: 0.8125rem;
  line-height: 1.35;
  color: var(--text);
}

.md-pick-item:last-child {
  border-bottom: none;
}

.md-pick-item:hover:not(.md-pick-item--active) {
  background: var(--surface-muted);
}

.md-pick-item--active {
  background: var(--accent-muted);
  color: var(--accent-hover);
  box-shadow: inset 3px 0 0 var(--accent);
}

.md-pick-item--active .md-pick-item-label {
  font-weight: 600;
  color: var(--accent-hover);
}

.md-pick-item-label {
  font-weight: 500;
}

.md-pick-item-meta {
  display: none;
}

.form-hint {
  margin-top: 12px;
  color: var(--text-muted);
  font-size: 0.9rem;
}

.form-action-bar-msg {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: flex-end;
}

.form-action-bar-msg .alert {
  margin: 0;
  max-width: min(100%, 520px);
  padding: 8px 12px;
  font-size: 0.875rem;
}

.combo {
  position: relative;
}

.combo-control {
  position: relative;
  display: flex;
  align-items: stretch;
}

.combo-input {
  flex: 1;
  min-width: 0;
  padding-right: 40px;
}

.combo-trigger {
  position: absolute;
  top: 1px;
  right: 1px;
  bottom: 1px;
  width: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-left: 1px solid var(--border);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--surface-raised);
  color: var(--muted);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.combo-trigger svg {
  width: 16px;
  height: 16px;
}

.combo-trigger:hover,
.combo-open .combo-trigger {
  background: var(--surface);
  color: var(--text);
}

.combo-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 40;
  max-height: 220px;
  overflow-y: auto;
  margin: 0;
  padding: 4px;
  list-style: none;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-md);
}

.combo-menu.hidden {
  display: none;
}

.combo-option {
  padding: 8px 10px;
  border-radius: calc(var(--radius-sm) - 2px);
  font-size: 0.9375rem;
  cursor: pointer;
}

.combo-option:hover,
.combo-option:focus,
.combo-option.is-active {
  background: var(--surface-raised);
  outline: none;
}

.combo-empty .combo-trigger {
  opacity: 0.45;
  cursor: default;
}

/* ── Page layout ── */

.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.page-header h1 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.page-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.page-header--with-search {
  display: grid;
  grid-template-columns: 1fr minmax(220px, 420px) 1fr;
  align-items: center;
  gap: 12px 16px;
}

.page-header--with-search h1 {
  margin: 0;
  justify-self: start;
}

.page-header-search {
  min-width: 0;
  width: 100%;
  justify-self: center;
}

.page-header--with-search .page-header-actions {
  justify-self: end;
}

.page-header--form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px 20px;
}

.page-header--form h1 {
  margin: 0;
  justify-self: start;
  min-width: 0;
}

.page-header-status {
  justify-self: center;
  min-width: 0;
  max-width: 100%;
}

.page-header--form .page-header-actions {
  justify-self: end;
}

.form-status-hub {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.form-status-hub--badge {
  justify-content: center;
}

.workflow-stepper-wrap {
  --wf-done: #0f9d58;
  --wf-active: #1a73e8;
  --wf-pending: #d1e3fa;
  --wf-label: #202124;
  --wf-label-pending: #9aa0a6;
}

.workflow-stepper-track {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 0;
  max-width: 100%;
}

.workflow-step-shell {
  display: inline-flex;
  flex-shrink: 0;
}

.workflow-step {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  min-width: 88px;
  padding: 0 4px;
  border: none;
  background: transparent;
  cursor: default;
  font-family: var(--font);
}

.workflow-step:not([disabled]) {
  cursor: pointer;
}

.workflow-step:not([disabled]):hover .workflow-step-label {
  color: var(--wf-label);
}

.workflow-step:focus-visible {
  outline: none;
}

.workflow-step:focus-visible .workflow-step-node {
  box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.25);
}

.workflow-step-node {
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.workflow-step-check {
  width: 13px;
  height: 13px;
  display: block;
}

.workflow-step--done .workflow-step-node {
  background: var(--wf-done);
  color: #fff;
}

.workflow-step--active .workflow-step-node {
  border: 2px solid var(--wf-active);
  background: #fff;
}

.workflow-step--active .workflow-step-node::after {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--wf-active);
}

.workflow-step--pending .workflow-step-node {
  background: var(--wf-pending);
}

.workflow-step-label {
  font-size: 0.9375rem;
  line-height: 1.35;
  text-align: center;
  white-space: nowrap;
  transition: color 0.12s ease;
}

.workflow-step--done .workflow-step-label,
.workflow-step--active .workflow-step-label {
  color: var(--wf-label);
  font-weight: 700;
}

.workflow-step--pending .workflow-step-label {
  color: var(--wf-label-pending);
  font-weight: 500;
}

.workflow-step-connector {
  width: 72px;
  height: 3px;
  flex-shrink: 0;
  margin-top: 10.5px;
  border-radius: 0;
}

.workflow-step-connector--done {
  background: var(--wf-done);
}

.workflow-step-connector--pending {
  background: var(--wf-pending);
}

.workflow-step-connector--split {
  display: flex;
  width: 72px;
  height: 3px;
  padding: 0;
  background: transparent;
  overflow: hidden;
}

.workflow-step-connector-seg {
  flex: 1 1 50%;
  height: 100%;
}

.workflow-step-connector-seg--active {
  background: var(--wf-active);
}

.workflow-step-connector-seg--pending {
  background: var(--wf-pending);
}

@media (max-width: 900px) {
  .workflow-step {
    min-width: 72px;
  }

  .workflow-step-connector,
  .workflow-step-connector--split {
    width: 40px;
  }

  .page-header--form {
    grid-template-columns: 1fr;
    justify-items: stretch;
    gap: 14px;
  }

  .page-header--form h1,
  .page-header-status,
  .page-header--form .page-header-actions {
    justify-self: stretch;
  }

  .page-header--form .page-header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}

.list-search-input {
  width: 100%;
  max-width: none;
  min-height: 40px;
  padding: 8px 12px 8px 36px;
  background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3-3'/%3E%3C/svg%3E") no-repeat 12px center;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 0.9375rem;
  font-family: var(--font);
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.list-search-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.list-search-input::-webkit-search-cancel-button {
  cursor: pointer;
}

/* ── Panels & cards ── */

.panel,
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  margin-bottom: 16px;
  width: 100%;
  box-shadow: var(--shadow-sm);
}

.panel-flush,
.card-flush {
  padding: 0;
  overflow: hidden;
}

.panel-flush > .table-wrap,
.panel-flush .table-wrap:only-child {
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.card-inline {
  margin-bottom: 16px;
}

h2, h3 {
  font-weight: 600;
  color: var(--text);
  letter-spacing: -0.01em;
}

h2 { font-size: 1rem; margin-bottom: 12px; }
h3 { font-size: 0.9375rem; margin-bottom: 10px; }

.panel > h2,
.card > h2 {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
}

.form-section-title {
  font-size: 0.8125rem;
  font-weight: 750;
  color: var(--text);
  margin: 20px 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-strong);
}

.form-section-title:first-child {
  margin-top: 0;
}

/* ── Dashboard ── */

.module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  gap: 16px;
  width: 100%;
}

.dashboard-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  width: 100%;
}

.dashboard-grid > .module-card {
  flex: 1 1 0;
  min-width: min(100%, 200px);
}

.dashboard-grid .module-card-head {
  min-height: 54px;
  align-items: flex-start;
}

.dashboard-grid .module-count-label {
  min-height: calc(0.6875rem * 1.25 * 2);
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.dashboard-site-open {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 16px;
  padding: 16px;
}

.dashboard-site-open .form-group {
  flex: 1 1 200px;
  margin: 0;
}

.import-setup-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.import-setup-grid .form-group {
  margin: 0;
  width: 100%;
}

.import-setup-grid select,
.import-setup-grid .path-input-field {
  width: 100%;
}

.path-input-row {
  display: flex;
  align-items: stretch;
  gap: 8px;
  width: 100%;
}

.path-input-row .path-input-field {
  flex: 1 1 auto;
  min-width: 0;
}

.path-input-row .btn-path-browse {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 44px;
}

.import-review-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  margin: 16px 0;
}

.import-review-grid .form-group {
  margin: 0;
}

.import-review-grid input,
.import-review-grid select {
  width: 100%;
}

.import-status {
  font-size: 0.8125rem;
  font-weight: 500;
}

.import-status-ready { color: var(--success); }
.import-status-accepted { color: var(--warning); }
.import-status-reviewed { color: var(--warning); }
.import-status-imported { color: var(--accent); }
.import-status-failed { color: var(--danger); }
.import-status-skipped { color: var(--muted); }

.import-row-ready {
  background: rgba(21, 128, 61, 0.06);
}

.import-setup,
.import-queue,
.import-mapping,
.import-review,
.import-analysis-summary {
  margin-bottom: 16px;
}

.import-background-progress {
  display: grid;
  grid-template-columns: minmax(250px, 1fr) minmax(220px, 0.8fr) auto;
  align-items: center;
  gap: 12px 18px;
  margin: 0 0 16px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border));
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--accent) 5%, var(--surface));
}

.import-background-progress.is-complete {
  border-color: color-mix(in srgb, #10b981 36%, var(--border));
  background: color-mix(in srgb, #10b981 5%, var(--surface));
}

.import-background-progress.has-error {
  border-color: color-mix(in srgb, var(--danger) 36%, var(--border));
  background: color-mix(in srgb, var(--danger) 5%, var(--surface));
}

.import-background-progress__copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.import-background-progress__copy span {
  color: var(--text-muted);
  overflow-wrap: anywhere;
}

.import-background-progress__bar {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--surface));
}

.import-background-progress__bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
  transition: width 180ms ease;
}

.import-background-progress__meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  white-space: nowrap;
}

@media (max-width: 1050px) {
  .import-background-progress {
    grid-template-columns: 1fr;
  }

  .import-background-progress__meta {
    justify-content: space-between;
  }
}

.import-template-status {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-left: 4px solid #94a3b8;
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
}

.import-template-status--ready {
  border-left-color: #10b981;
  background: color-mix(in srgb, #10b981 5%, var(--surface));
}

.import-template-status span,
.import-template-status small {
  color: var(--text-muted);
}

.import-variant-list {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.import-variant-list .admin-section-title {
  margin-bottom: 2px;
  font-weight: 700;
}

.import-variant-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
}

.import-variant-row > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.import-variant-row small {
  color: var(--text-muted);
  overflow-wrap: anywhere;
}

.import-deviation-list {
  display: grid;
  gap: 8px;
  margin: 14px 0 16px;
}

.import-deviation-item {
  display: grid;
  grid-template-columns: minmax(150px, 0.3fr) minmax(0, 1fr);
  gap: 8px 14px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, #f59e0b 38%, var(--border));
  border-left: 4px solid #f59e0b;
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, #f59e0b 5%, var(--surface));
}

.import-deviation-item--hard {
  border-color: color-mix(in srgb, var(--danger) 38%, var(--border));
  border-left-color: var(--danger);
  background: color-mix(in srgb, var(--danger) 5%, var(--surface));
}

.import-deviation-item--resolved {
  border-color: color-mix(in srgb, #10b981 38%, var(--border));
  border-left-color: #10b981;
  background: color-mix(in srgb, #10b981 6%, var(--surface));
}

.import-deviation-item--resolved strong,
.import-review-resolved {
  color: #047857;
}

.import-review-resolved {
  margin: 8px 0 0;
  font-weight: 600;
}

.import-review-live-status {
  min-height: 1.25rem;
  margin: 4px 0 0;
}

.import-deviation-item span {
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}

.import-ur-number-check {
  display: grid;
  gap: 12px;
  margin: 4px 0 18px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, #f59e0b 42%, var(--border));
  border-left: 4px solid #f59e0b;
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, #f59e0b 5%, var(--surface));
}

.import-ur-number-check--valid {
  border-color: color-mix(in srgb, #10b981 36%, var(--border));
  border-left-color: #10b981;
  background: color-mix(in srgb, #10b981 5%, var(--surface));
}

.import-ur-number-check-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.import-ur-number-check-head > div,
.import-ur-number-values span {
  display: grid;
  gap: 3px;
}

.import-ur-number-check-head span,
.import-ur-number-check p,
.import-ur-number-values small {
  color: var(--text-secondary);
}

.import-ur-number-check p {
  margin: 0;
}

.import-ur-number-extension {
  flex: 0 0 auto;
  padding: 4px 9px;
  border-radius: 999px;
  color: #047857 !important;
  background: rgba(16, 185, 129, 0.12);
  font-size: 0.8125rem;
  font-weight: 700;
}

.import-ur-number-values {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
}

.import-ur-number-values span {
  min-width: 0;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
}

.import-ur-number-values strong {
  overflow-wrap: anywhere;
}

.import-ur-number-check .btn {
  justify-self: start;
}

@media (max-width: 700px) {
  .import-deviation-item {
    grid-template-columns: 1fr;
  }

  .import-ur-number-check-head,
  .import-ur-number-values {
    display: grid;
    grid-template-columns: 1fr;
  }
}

.import-field-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.import-field-chip-list--compact {
  max-width: 320px;
}

.import-field-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.1);
  color: var(--text);
  font-size: 0.78rem;
  line-height: 1.4;
}

.import-field-chip-list--missing .import-field-chip {
  background: rgba(220, 38, 38, 0.1);
}

.import-structure-diff {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--border, rgba(0, 0, 0, 0.08));
}

.import-structure-diff h4 {
  margin: 0 0 10px;
  font-size: 0.9rem;
}

.import-structure-block {
  padding: 8px 0 10px;
  border-bottom: 1px solid var(--border, rgba(0, 0, 0, 0.06));
}

.import-structure-block:last-child {
  border-bottom: none;
}

.import-structure-block strong {
  display: block;
  margin-bottom: 6px;
  font-size: 0.88rem;
}

.import-structure-block--ok {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.import-structure-section + .import-structure-section {
  margin-top: 8px;
}

.import-structure-label {
  margin: 0 0 4px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted, var(--muted));
}

.import-structure-fields {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.import-structure-field {
  display: flex;
  align-items: center;
  gap: 8px;
}

.import-structure-field .import-field-chip {
  font-size: 0.82rem;
  padding: 2px 8px;
}

.import-structure-field .btn-link {
  padding: 0 4px;
  font-size: 0.75rem;
  min-height: auto;
}

.import-structure-field--ignored .import-field-chip {
  opacity: 0.55;
  text-decoration: line-through;
}

.import-structure-ignored-details {
  margin-top: 4px;
}

.import-structure-ignored-details summary {
  cursor: pointer;
  font-size: 0.75rem;
  color: var(--text-muted, var(--muted));
}

.import-structure-ignored-hint {
  margin: 8px 0 0;
  font-size: 0.78rem;
}

.import-structure-badge {
  display: inline-block;
  font-size: 0.75rem;
  color: var(--warning);
}

.module-count-wrap--spacer {
  visibility: hidden;
  pointer-events: none;
}

.dashboard-chart-panel {
  margin-top: 16px;
}

.dashboard-chart-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.dashboard-chart-header h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
}

.dashboard-chart-year-wrap {
  flex-shrink: 0;
  margin-left: auto;
}

.dashboard-chart-title{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-3)}
.dashboard-chart-title .dashboard-chart-legend{margin:0}

.dashboard-chart-year {
  min-width: 108px;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text);
  font-family: var(--font);
  font-size: 0.875rem;
}

.dashboard-chart-year:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.dashboard-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 14px;
  font-size: 0.8125rem;
  color: var(--text-secondary);
}

.dashboard-chart-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.dashboard-chart-legend-swatch {
  width: 12px;
  height: 12px;
  border-radius: 2px;
  flex-shrink: 0;
}

.dashboard-chart-legend-swatch--mwo {
  background: var(--accent);
}

.dashboard-chart-legend-swatch--ur {
  background: #94a3b8;
}

.dashboard-chart-scroll {
  overflow-x: auto;
  margin: 0 -4px;
  padding: 0 4px 8px;
  scrollbar-gutter: stable;
}

.dashboard-grouped-chart {
  display: grid;
  grid-template-columns: repeat(12, minmax(44px, 1fr));
  gap: 8px;
  align-items: end;
  min-width: 640px;
  height: 140px;
  padding-top: 8px;
}

.dashboard-grouped-chart--loading .dashboard-bar {
  opacity: 0.35;
  animation: dashboard-bar-pulse 1.2s ease-in-out infinite;
}

@keyframes dashboard-bar-pulse {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 0.55; }
}

.dashboard-month-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  height: 100%;
  min-width: 0;
}

.dashboard-bar-group {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
}

.dashboard-bar-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  flex: 1 1 0;
  max-width: 22px;
  min-width: 0;
  gap: 4px;
}

.dashboard-bar-value {
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  min-height: 0.75rem;
  flex-shrink: 0;
}

.dashboard-bar-value--mwo {
  color: var(--accent);
}

.dashboard-bar-value--ur {
  color: #94a3b8;
}

.dashboard-bar-value--zero {
  color: var(--muted);
  font-weight: 500;
}

.dashboard-bar {
  width: 100%;
  min-height: 2px;
  border-radius: 3px 3px 0 0;
  transition: height 0.2s ease;
}

.dashboard-bar--mwo {
  background: var(--accent);
}

.dashboard-bar--ur {
  background: #94a3b8;
}

.dashboard-month-label {
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--muted);
  text-align: center;
  line-height: 1.2;
  flex-shrink: 0;
}

.dashboard-chart-empty {
  margin: 0;
  padding: 24px 8px;
  text-align: center;
  color: var(--muted);
  font-size: 0.875rem;
}

.module-card--disabled {
  opacity: 0.58;
  pointer-events: none;
  filter: grayscale(0.15);
}

.module-card--disabled:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-md);
}

.sidebar-link--disabled,
.sidebar-link:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.module-card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  min-height: 168px;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  text-align: left;
  font-family: var(--font);
  box-shadow: var(--shadow-md);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.module-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.module-count-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  flex-shrink: 0;
}

.module-count {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.module-count-label {
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-align: right;
  max-width: 9rem;
  line-height: 1.25;
}

.module-card-sub {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--text-secondary);
  line-height: 1.35;
}

.module-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: auto;
  padding-top: 4px;
  width: 100%;
}

.module-card-actions .btn {
  flex: 1 1 auto;
  min-width: 0;
}

.module-card:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow-lg);
}

.module-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}

.module-icon svg {
  width: 18px;
  height: 18px;
}

.module-icon-blue { background: #bfdbfe; color: #1e3a8a; }
.module-icon-violet { background: #ddd6fe; color: #5b21b6; }
.module-icon-emerald { background: #a7f3d0; color: #065f46; }
.module-icon-slate { background: #e2e8f0; color: #1e293b; box-shadow: inset 0 0 0 1px #cbd5e1; }

.module-title {
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--text);
  margin: 0;
  line-height: 1.3;
}

/* ── Forms ── */

.form-group { margin-bottom: 16px; }

label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--text-secondary);
}

input, select, textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 0.9375rem;
  font-family: var(--font);
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

textarea {
  min-height: 96px;
  resize: vertical;
}

input::placeholder,
textarea::placeholder {
  color: var(--muted);
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

input:disabled, select:disabled, textarea:disabled,
input[readonly] {
  background: var(--surface-raised);
  color: var(--text);
  cursor: default;
}

.grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 16px;
  width: 100%;
}

.grid-2 .form-group-wide {
  grid-column: 1 / -1;
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  gap: 12px;
  width: 100%;
}

.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
}

.grid-4 .form-group-wide {
  grid-column: 1 / -1;
}

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

.checkbox-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.checkbox-group label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 12px;
  margin: 0;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  cursor: pointer;
  font-weight: 400;
  color: var(--text);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.checkbox-group label:hover {
  border-color: var(--border-strong);
}

.checkbox-group input {
  width: auto;
  min-height: auto;
  margin: 0;
}

.checkbox-group label:has(input:checked) {
  border-color: var(--accent);
  background: var(--accent-muted);
}

/* ── Buttons ── */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-weight: 500;
  font-family: var(--font);
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.btn-primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.btn-primary:hover:not(:disabled) {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}

.btn-secondary {
  background: var(--surface);
  color: var(--text);
  border-color: var(--border-strong);
  box-shadow: var(--shadow-xs);
}

.btn-secondary:hover:not(:disabled) {
  background: var(--surface-raised);
  border-color: var(--border-strong);
}

.btn-danger {
  background: var(--danger);
  color: #fff;
  border-color: var(--danger);
}

.btn-danger:hover:not(:disabled) {
  background: #991b1b;
}

.btn-ghost {
  background: transparent;
  color: var(--sidebar-text);
  border-color: transparent;
  min-height: 36px;
}

.btn-ghost:hover:not(:disabled) {
  background: var(--sidebar-hover);
  color: #fff;
}

.btn-block { width: 100%; }

.btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.btn-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 20px;
  justify-content: flex-start;
}

.btn-sm {
  min-height: 36px;
  padding: 6px 12px;
  font-size: 0.8125rem;
}

.btn-xs {
  min-height: 28px;
  padding: 2px 8px;
  font-size: 0.75rem;
}

.btn-loading {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}

.btn-loading::after {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1rem;
  height: 1rem;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: btn-spin 0.65s linear infinite;
}

.btn-secondary.btn-loading::after {
  border-color: rgba(15, 23, 42, 0.22);
  border-top-color: var(--accent);
}

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

.btn-link {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 10px;
  border: none;
  background: none;
  color: var(--accent);
  font-size: 0.875rem;
  font-family: var(--font);
  font-weight: 500;
  cursor: pointer;
  text-align: center;
  min-height: 44px;
}

.btn-link:hover {
  color: var(--accent-hover);
  text-decoration: underline;
}

/* ── Badges & alerts ── */

.badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
}

.badge-write { background: var(--success-bg); color: var(--success); }
.badge-read { background: var(--warning-bg); color: var(--warning); }
.badge-admin { background: var(--info-bg); color: var(--info); }
.badge-editor { background: var(--success-bg); color: var(--success); }
.badge-locked { background: var(--danger-bg); color: var(--danger); }
.badge-free { background: var(--success-bg); color: var(--success); }
.badge-active { background: var(--success-bg); color: var(--success); }
.badge-inactive { background: #f3f4f6; color: var(--muted); }
.badge-success { background: var(--success-bg); color: var(--success); }
.badge-warning { background: var(--warning-bg); color: var(--warning); }
.badge-neutral { background: #f3f4f6; color: var(--text-secondary); }

.alert {
  padding: 12px 14px;
  border-radius: var(--radius-sm);
  margin-bottom: 16px;
  font-size: 0.875rem;
  border: 1px solid;
}

.alert-warning { background: var(--warning-bg); border-color: #f59e0b; color: #78350f; }
.alert-error { background: var(--danger-bg); border-color: #ef4444; color: #7f1d1d; }
.alert-info { background: var(--info-bg); border-color: #3b82f6; color: #1e3a8a; }

/* ── Tables ── */

.table-wrap,
.admin-table-wrap {
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  overflow: auto;
  box-shadow: var(--shadow-xs);
  background: var(--surface);
}

.data-table,
table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

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

.data-table th,
th {
  position: sticky;
  top: 0;
  z-index: 1;
  color: var(--muted);
  font-weight: 600;
  font-size: 0.75rem;
  background: var(--surface-raised);
}

.data-table td.num,
td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

tbody tr:last-child td { border-bottom: none; }

.data-table tbody tr:hover td,
tbody tr:hover td {
  background: var(--surface-raised);
}

.data-table.mwo-list-table tbody tr:hover > td,
.data-table.ur-list-table tbody tr:hover > td {
  background-color: var(--list-row-hover);
}

.data-table.mwo-list-table tbody tr:hover > td.clickable,
.data-table.ur-list-table tbody tr:hover > td.clickable {
  cursor: pointer;
}

.data-table.mwo-list-table tbody tr.mwo-row-deleted:hover > td,
.data-table.ur-list-table tbody tr.mwo-row-deleted:hover > td {
  background-color: #f5d5d5;
}

.data-table.mwo-list-table tbody tr.mwo-row-deleted > td.mwo-cell-deleted,
.data-table.ur-list-table tbody tr.mwo-row-deleted > td.mwo-cell-deleted {
  color: var(--muted);
  text-decoration-line: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: currentColor;
}

tr.clickable { cursor: pointer; }

.empty-state,
.eq-empty,
.admin-empty {
  padding: 32px 16px;
  text-align: center;
  color: var(--muted);
  font-size: 0.875rem;
}

/* ── MWO Liste ── */

.sortable-th {
  padding: 0;
  vertical-align: middle;
}

.sortable-th-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 11px 14px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  font-size: 0.75rem;
  text-align: left;
  cursor: pointer;
}

.sortable-th-btn:hover {
  color: var(--text);
}

.sortable-th-btn:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: -2px;
}

.sortable-th-label {
  line-height: 1.2;
}

.sort-indicator {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  flex-shrink: 0;
  color: var(--muted);
}

.sortable-th--active .sort-indicator {
  color: var(--primary);
}

.sort-arrow {
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  opacity: 0.28;
}

.sort-arrow-up {
  border-bottom: 5px solid currentColor;
}

.sort-arrow-down {
  border-top: 5px solid currentColor;
}

.sort-arrow.is-active {
  opacity: 1;
}

.table-wrap:has(.mwo-list-table),
.table-wrap:has(.ur-list-table) {
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-gutter: stable;
}

.mwo-list-table,
.ur-list-table {
  table-layout: fixed;
  width: 100%;
  min-width: 920px;
}

.mwo-list-table .mwo-col-nr {
  width: 10%;
  white-space: nowrap;
}

.ur-list-table .mwo-col-nr {
  width: 14%;
  min-width: 8.5rem;
  white-space: nowrap;
}

.mwo-list-table .mwo-col-date,
.ur-list-table .mwo-col-date {
  width: 10%;
  white-space: nowrap;
}

.mwo-list-table .mwo-col-trade {
  width: 8%;
  white-space: nowrap;
}

.mwo-list-table .mwo-col-excerpt,
.ur-list-table .mwo-col-excerpt,
.ur-list-table .ur-col-topic {
  min-width: 0;
  width: auto;
}

.mwo-list-table .mwo-excerpt,
.ur-list-table .ur-excerpt,
.ur-list-table .mwo-excerpt {
  max-width: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mwo-list-table th,
.mwo-list-table td,
.ur-list-table th,
.ur-list-table td {
  padding: 6px 10px;
  font-size: 0.8125rem;
  vertical-align: middle;
  transition: background-color 0.12s ease;
}

.mwo-list-table .sortable-th-btn,
.ur-list-table .sortable-th-btn {
  padding: 6px 10px;
}

.mwo-list-table .mwo-col-excerpt,
.ur-list-table .ur-col-topic,
.ur-list-table .mwo-col-excerpt {
  min-width: 0;
}

.mwo-list-table .mwo-col-excerpt {
  width: auto;
}

.ur-list-table .mwo-col-excerpt,
.ur-list-table .ur-col-topic {
  width: auto;
}

.mwo-list-table .mwo-excerpt,
.ur-list-table .ur-excerpt,
.ur-list-table .mwo-excerpt {
  max-width: none;
  color: var(--text-secondary);
  line-height: 1.35;
}

.mwo-status-cell {
  min-width: 0;
  white-space: nowrap;
  overflow: visible;
}

.mwo-list-table .mwo-col-status {
  width: 14%;
  min-width: 0;
}

.mwo-list-table .mwo-col-print,
.mwo-list-table .mwo-col-doc,
.mwo-list-table .mwo-list-icon-col {
  width: 3.25rem;
  min-width: 0;
  text-align: center;
  padding-left: 6px;
  padding-right: 6px;
}

.mwo-list-table th.mwo-col-print,
.mwo-list-table th.mwo-col-email,
.mwo-list-table th.mwo-col-doc,
.ur-list-table th.mwo-col-print,
.ur-list-table th.mwo-col-email,
.ur-list-table th.mwo-col-doc {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-secondary);
  vertical-align: middle;
}

.mwo-list-table .mwo-col-print,
.mwo-list-table .mwo-col-email,
.mwo-list-table .mwo-col-doc,
.ur-list-table .mwo-col-print,
.ur-list-table .mwo-col-email,
.ur-list-table .mwo-col-doc,
.mwo-list-table .mwo-list-icon-col,
.ur-list-table .mwo-list-icon-col {
  width: 3.25rem;
  min-width: 0;
  text-align: center;
  padding-left: 6px;
  padding-right: 6px;
}

.mwo-list-table .mwo-col-status,
.ur-list-table .mwo-col-status {
  width: 14%;
  min-width: 0;
}

.ur-list-table .mwo-status-cell.mwo-col-status {
  width: 14%;
  max-width: none;
}

.mwo-list-icon-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.mwo-list-table .mwo-status-cell.mwo-col-status {
  width: 14%;
  max-width: none;
}

.ur-list-table .mwo-status-cell {
  width: 26%;
  max-width: 280px;
  min-width: 0;
  position: relative;
  overflow: visible;
}

.mwo-status-row__status {
  min-width: 0;
}

.mwo-status-row {
  display: grid;
  grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
  align-items: center;
  gap: 8px 10px;
  min-width: 0;
}

.mwo-pdf-actions {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-right: 4px;
  vertical-align: middle;
  overflow: hidden;
}

.mwo-pdf-actions--icons {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 0;
  overflow: visible;
}

.mwo-status-row__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mwo-status-row__badge {
  min-width: 0;
}

.mwo-status-row__doc {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.mwo-status-row__doc.is-empty {
  opacity: 0.35;
}

.mwo-status-row__doc.is-empty .mwo-pdf-link--placeholder {
  pointer-events: none;
}

.mwo-doc-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: var(--text-muted);
  flex-shrink: 0;
}

.mwo-doc-icon svg {
  width: 16px;
  height: 16px;
}

.mwo-status-row__doc.is-available .mwo-doc-icon {
  color: var(--accent);
}

.mwo-pdf-link--placeholder {
  visibility: hidden;
  user-select: none;
}

.mwo-status-gedruckt {
  background: #fef3c7;
  color: #b45309;
}

.btn-document--printed {
  background: #fef3c7;
  border-color: #fcd34d;
  color: #b45309;
}

.btn-document--printed:hover {
  background: #fde68a;
  border-color: #fbbf24;
  color: #92400e;
}

.drop-up-item--disabled,
.drop-up-item:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}

.mwo-status-picker {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
}

.mwo-status-picker-btn {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  vertical-align: middle;
  min-height: 32px;
}

.mwo-status-picker-btn .mwo-status-tag {
  cursor: pointer;
}

.mwo-status-picker-chevron {
  width: 9px;
  height: 9px;
  flex-shrink: 0;
  margin-left: 1px;
  color: var(--muted);
  opacity: 0.8;
}

.mwo-status-picker-btn:focus-visible {
  outline: none;
}

.mwo-status-picker-btn:focus-visible .mwo-status-tag {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.mwo-status-picker-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 20;
  min-width: 120px;
  margin: 0;
  padding: 4px;
  list-style: none;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: 0 8px 20px -6px rgba(17, 24, 39, 0.18);
}

.mwo-status-picker-menu--fixed {
  position: fixed;
  z-index: 250;
}

.mwo-status-picker-menu.hidden {
  display: none;
}

.mwo-status-picker-option {
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--text);
  cursor: pointer;
  transition: background 0.12s ease;
}

.mwo-status-picker-option.is-current {
  color: var(--muted);
  cursor: default;
}

.mwo-status-picker-option:not(.is-current):hover,
.mwo-status-picker-option:focus-visible {
  background: var(--surface-raised);
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.mwo-status-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
  white-space: nowrap;
}

.mwo-status-entwurf {
  background: #dbeafe;
  color: #1d4ed8;
}

.mwo-status-inarbeit {
  background: #fef3c7;
  color: #b45309;
}

.mwo-status-abgeschlossen {
  background: #d1fae5;
  color: #047857;
}

.mwo-status-geloescht {
  background: #fee2e2;
  color: #b91c1c;
}

.mwo-actions-col {
  width: 5%;
  min-width: 44px;
  text-align: center;
  padding-left: 4px;
  padding-right: 8px;
}

.mwo-actions-cell {
  width: 5%;
  min-width: 44px;
  text-align: center;
  vertical-align: middle;
  padding: 4px 8px 4px 4px;
  white-space: nowrap;
}

.mwo-actions-cell .mwo-icon-btn {
  display: inline-flex;
  width: 32px;
  height: 32px;
  margin: 0;
  vertical-align: middle;
}

.mwo-pdf-link {
  padding: 0;
  border: none;
  background: none;
  color: var(--accent);
  font-size: 0.75rem;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  text-decoration: none;
  line-height: 1.2;
}

.mwo-pdf-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--accent);
  flex-shrink: 0;
}

.mwo-pdf-icon-btn--empty {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}

.mwo-pdf-icon-btn:hover,
.mwo-pdf-link.mwo-pdf-icon-btn:hover {
  color: var(--accent-hover);
}

.mwo-pdf-link:hover {
  color: var(--accent-hover);
  text-decoration: underline;
}

.mwo-pdf-link.is-loading,
.mwo-pdf-link.mwo-pdf-icon-btn.is-loading {
  position: relative;
  color: transparent;
  pointer-events: none;
  min-width: 32px;
}

.mwo-pdf-link.is-loading::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border: 2px solid var(--accent);
  border-right-color: transparent;
  border-radius: 50%;
  animation: md-spin 0.65s linear infinite;
}

.btn-pdf-open {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.btn-pdf-open__icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
}

.btn-pdf-open__icon .mwo-doc-icon svg {
  width: 16px;
  height: 16px;
}

.btn-pdf-open.is-loading {
  pointer-events: none;
  opacity: 0.75;
}

.btn-pdf-open.is-loading > span:last-child::after {
  content: ' …';
}

#btn-duplicate-ur.is-loading {
  pointer-events: none;
  opacity: 0.75;
}

#btn-duplicate-ur.is-loading::after {
  content: ' …';
}

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

.mwo-print-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  vertical-align: middle;
}

.mwo-print-icon svg {
  width: 18px;
  height: 18px;
}

.mwo-print-icon--pending {
  color: #d1d5db;
}

.mwo-print-icon--done {
  color: var(--accent);
}

.mwo-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  margin-left: 4px;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  vertical-align: middle;
  flex-shrink: 0;
}

.mwo-icon-btn svg {
  width: 15px;
  height: 15px;
}

.mwo-delete-btn:hover {
  color: var(--danger);
  background: var(--danger-bg);
}

.tech-field-now .tech-field-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.btn-now {
  min-height: 24px;
  padding: 2px 8px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--accent);
  font-size: 0.6875rem;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.btn-now:hover {
  border-color: var(--accent);
  background: var(--accent-muted);
}

.tech-field.field-missing label,
#mwo-desc-type-section.field-missing .desc-type-toggle-btn {
  color: var(--danger);
}

.tech-field.field-missing input,
.tech-field.field-missing textarea,
.tech-field.field-missing select,
.tech-field.field-missing .combo-control,
input.field-missing,
textarea.field-missing {
  border-color: var(--danger);
  background: var(--danger-bg);
  box-shadow: 0 0 0 2px rgba(185, 28, 28, 0.12);
}

#mwo-desc-type-section.field-missing {
  padding: 8px;
  border-radius: var(--radius-sm);
  outline: 2px solid rgba(185, 28, 28, 0.35);
  background: var(--danger-bg);
}

#mwo-desc-type-section.field-missing .desc-type-toggle-btn {
  border-color: var(--danger);
}

/* ── Vollbild-Ladeanimation ── */

body.md-screen-loader-open {
  overflow: hidden;
}

.md-screen-loader {
  position: fixed;
  inset: 0;
  z-index: var(--layer-loader);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.md-screen-loader.hidden {
  display: none;
}

.md-screen-loader-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(6px);
}

.md-screen-loader-panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(100%, 480px);
  min-width: min(100%, 320px);
  max-width: 480px;
  box-sizing: border-box;
  padding: 32px 36px;
  border-radius: var(--radius-md);
  border: 1px solid var(--border-strong);
  background: var(--surface);
  box-shadow: var(--shadow-overlay);
}

.md-screen-loader-spinner {
  width: 52px;
  height: 52px;
  border: 4px solid #cbd5e1;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: md-screen-spin 0.75s linear infinite;
}

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

.md-screen-loader-message {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  text-align: center;
}

.md-screen-loader-detail {
  width: 100%;
  margin: 0.35rem 0 0;
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--text-muted, var(--muted));
  text-align: center;
  overflow-wrap: anywhere;
}

.md-screen-loader-progress {
  width: 100%;
  height: 6px;
  margin-top: 0.85rem;
  background: rgba(0, 0, 0, 0.08);
  border-radius: 999px;
  overflow: hidden;
}

.md-screen-loader-progress-bar {
  height: 100%;
  width: 0%;
  background: var(--primary, #2563eb);
  border-radius: 999px;
  transition: width 0.25s ease;
}

.md-screen-loader-progress-label {
  margin: 0.45rem 0 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--primary, #2563eb);
  text-align: center;
}

.md-screen-loader-cancel {
  min-width: 120px;
}

/* ── App Dialoge ── */

body.md-dialog-open {
  overflow: hidden;
}

.md-dialog-root {
  position: fixed;
  inset: 0;
  z-index: var(--layer-dialog);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.md-dialog-root.hidden {
  display: none;
}

.md-dialog-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(4px);
}

.md-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, var(--dialog-width, var(--dialog-size-compact)));
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow-overlay);
  overflow: hidden;
  max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px);
  display: flex;
  flex-direction: column;
}

.md-dialog-header {
  padding: 18px 20px 0;
}

.md-dialog-header--error .md-dialog-title {
  color: var(--danger);
}

.md-dialog-title {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.35;
}

.md-dialog-body {
  padding: 12px 20px 4px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  overflow-y: auto;
}

.md-dialog--compact .md-dialog-body {
  padding-top: 20px;
}

.md-dialog-message {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.9375rem;
  line-height: 1.5;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.md-dialog-hint {
  margin: 0;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  border: 1px solid var(--border);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}

.md-dialog-input {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  font-size: 0.9375rem;
  font-family: var(--font);
}

.md-dialog-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.md-dialog-error {
  margin: 0;
  color: var(--danger);
  font-size: 0.8125rem;
}

.md-dialog-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 20px 20px;
  flex: 0 0 auto;
  background: var(--surface);
}

.md-dialog-footer--stack {
  flex-direction: column;
  align-items: stretch;
}

.md-dialog-footer--stack .btn {
  width: 100%;
}

.md-dialog--image {
  width: min(920px, calc(100vw - 32px));
  max-width: min(920px, calc(100vw - 32px));
}

.md-dialog--ur-assistant {
  width: min(1040px, calc(100vw - 32px));
  max-width: min(1040px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  display: flex;
  flex-direction: column;
}

.ur-assistant-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 12px;
}

.ur-assistant-step-label {
  margin: 0;
  color: var(--muted);
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: right;
}

.ur-assistant-header-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-wrap: wrap;
}

.ur-assistant-language {
  display: inline-flex;
  align-items: center;
  gap: 0;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 600;
}

.ur-assistant-language > span {
  margin-right: 7px;
}

.ur-assistant-language-option {
  min-width: 34px;
  min-height: 26px;
  padding: 3px 7px;
  border: 1px solid var(--border-strong);
  background: var(--surface);
  color: var(--muted);
  font: inherit;
  cursor: pointer;
}

.ur-assistant-language-option:first-of-type {
  border-radius: var(--radius-sm) 0 0 var(--radius-sm);
}

.ur-assistant-language-option:last-child {
  margin-left: -1px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

.ur-assistant-language-option.is-active {
  position: relative;
  z-index: 1;
  border-color: var(--accent);
  background: var(--accent-muted);
  color: var(--accent-hover);
}

.ur-assistant-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 20px 12px;
  border-bottom: 1px solid var(--border);
}

.ur-assistant-progress-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  background: var(--surface);
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 700;
}

.ur-assistant-progress-step.is-active {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.ur-assistant-progress-step.is-done {
  border-color: var(--accent);
  background: var(--accent-muted);
  color: var(--accent-hover);
}

.ur-assistant-body {
  min-height: 300px;
  overflow-y: auto;
  padding-bottom: 16px;
}

.ur-assistant-intro {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.875rem;
}

.ur-assistant-existing {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
}

.ur-assistant-existing summary {
  color: var(--text-secondary);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
}

.ur-assistant-existing p {
  margin: 8px 0 0;
  white-space: pre-wrap;
  color: var(--text);
  font-size: 0.875rem;
}

.ur-assistant-question-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.ur-assistant-question,
.ur-assistant-preview-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ur-assistant-question label,
.ur-assistant-preview-field label {
  color: var(--text-secondary);
  font-size: 0.8125rem;
  font-weight: 600;
}

.ur-assistant-question textarea,
.ur-assistant-question select,
.ur-assistant-preview-field textarea {
  width: 100%;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.ur-assistant-question textarea,
.ur-assistant-preview-field textarea {
  min-height: 82px;
  padding: 9px 11px;
  resize: vertical;
}

.ur-assistant-question select {
  min-height: 42px;
  padding: 8px 10px;
}

.ur-assistant-question textarea:focus,
.ur-assistant-question select:focus,
.ur-assistant-preview-field textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.ur-assistant-examples {
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.ur-assistant-examples-title {
  display: block;
  margin-bottom: 8px;
  color: var(--text-secondary);
  font-size: 0.8125rem;
  font-weight: 600;
}

.ur-assistant-example-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ur-assistant-example {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text-secondary);
  font: inherit;
  font-size: 0.8125rem;
  cursor: pointer;
}

.ur-assistant-example:hover,
.ur-assistant-example.is-selected {
  border-color: var(--accent);
  background: var(--accent-muted);
  color: var(--accent-hover);
}

.ur-assistant-preview-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ur-assistant-error {
  padding: 0 20px;
}

.ur-assistant-footer {
  align-items: center;
  border-top: 1px solid var(--border);
}

.ur-assistant-footer-spacer {
  flex: 1 1 auto;
}

@media (max-width: 720px) {
  .ur-assistant-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .ur-assistant-step-label {
    text-align: left;
  }

  .ur-assistant-header-meta {
    justify-content: flex-start;
  }

  .ur-assistant-question-grid {
    grid-template-columns: 1fr;
  }

  .ur-assistant-footer {
    flex-wrap: wrap;
  }
}

.md-dialog-body--image {
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #111;
}

.md-image-preview {
  display: block;
  max-width: 100%;
  max-height: min(78vh, 860px);
  width: auto;
  height: auto;
  object-fit: contain;
}

.md-image-preview-error {
  margin: 0;
  padding: 24px 16px;
  color: #f8fafc;
  text-align: center;
}



/* ── Tabs ── */

.admin-tabs,
.tabs {
  display: flex;
  gap: 6px;
  flex-wrap: nowrap;
  margin-bottom: 20px;
  padding: 6px;
  overflow-x: auto;
  scrollbar-gutter: stable;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.admin-tab,
.tab {
  flex: 0 0 auto;
  padding: 9px 14px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  font-family: var(--font);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  min-height: 44px;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.admin-tab:hover,
.tab:hover {
  color: var(--text);
}

.admin-tab.active,
.tab.active {
  color: var(--accent-hover);
  border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
  background: var(--accent-muted);
  font-weight: 600;
}

/* ── Stats ── */

.stat-card,
.kpi-card {
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.stat-value,
.kpi-value {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.stat-label,
.kpi-label {
  font-size: 0.8125rem;
  color: var(--muted);
  margin-top: 6px;
  font-weight: 500;
}

.stats-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.kpi-card {
  position: relative;
  overflow: hidden;
}

.kpi-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--accent);
  opacity: 0.85;
}

.kpi-card--total::before { background: var(--accent); }
.kpi-card--open::before { background: #f59e0b; }
.kpi-card--closed::before { background: #10b981; }
.kpi-card--draft::before { background: #94a3b8; }
.kpi-card--safety::before { background: #ef4444; }

.stats-filter-panel {
  margin-bottom: 16px;
}

.stats-filter-panel > h2 {
  margin-bottom: 8px;
}

.stats-filter-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "fields empty"
    "switch actions";
  gap: 12px 16px;
  align-items: end;
}

.stats-filter-fields {
  grid-area: fields;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.stats-filter-fields .form-group {
  margin-bottom: 0;
}

.stats-filter-switch {
  grid-area: switch;
  align-self: stretch;
  margin-top: 0;
}

.stats-filter-actions {
  grid-area: actions;
  display: flex;
  flex-wrap: wrap;
  align-self: stretch;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px;
  margin-bottom: 0;
}

@media (max-width: 900px) {
  .stats-filter-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "fields"
      "switch"
      "actions";
  }
}

@media (max-width: 680px) {
  .stats-filter-fields {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

.stats-time-panel.panel-wide,
.grid-2 .panel-wide,
.stats-detail-grid .panel-wide {
  grid-column: 1 / -1;
}

.stats-time-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 20px;
}

.stats-subtitle {
  margin: 0 0 10px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.stats-panel-title {
  margin: 0 0 6px;
}

.stats-hint {
  font-size: 0.8125rem;
  color: var(--muted);
  margin: 0 0 12px;
  line-height: 1.45;
}

.stats-table th.num,
.stats-table td.num {
  text-align: right;
  width: 7.5rem;
  min-width: 7.5rem;
  padding-right: 14px;
}

.stats-table-label-h,
.stats-table-label {
  width: auto;
  line-height: 1.4;
  word-break: break-word;
}

.stats-count-cell {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.stats-group-icon {
  display: inline-flex;
  align-items: center;
  vertical-align: -2px;
  width: 14px;
  height: 14px;
  margin: 0 4px 0 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--accent);
  cursor: pointer;
  font: inherit;
}
.stats-rating-panel, .stats-distribution-panel { min-width: 0; align-self: start; }
.stats-rating-scope { font-size: 0.75rem; color: var(--text-muted); margin-bottom: 12px; }
.stats-rating-summary { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 18px 0; padding: 12px 0; border-top: 1px solid var(--surface-muted); border-bottom: 1px solid var(--surface-muted); color: var(--text-muted); font-size: 0.875rem; }
.stats-rating-summary strong { color: var(--text); font-weight: 600; }
.stats-rating-columns { display: flex; justify-content: space-between; gap: 16px; color: var(--text-muted); font-size: 0.75rem; margin-bottom: 5px; }
.stats-rating-list { list-style: none; padding: 0; margin: 0; }
.stats-rating-row { padding: 11px 0; }
.stats-rating-row-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 7px; }
.stats-rating-label { min-width: 0; overflow-wrap: anywhere; }
.stats-rating-values { display: flex; align-items: baseline; gap: 16px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.stats-rating-values strong { min-width: 22px; text-align: right; font-weight: 600; }
.stats-rating-values > span { min-width: 48px; text-align: right; font-size: 0.75rem; color: var(--text-muted); }
.stats-rating-track { height: 8px; border-radius: 4px; background: var(--surface-muted); }
.stats-rating-fill { height: 100%; border-radius: 4px; background: var(--accent); }
.stats-rating-zero .stats-rating-label { color: var(--text-muted); }
.stats-rating-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--surface-muted); }
.stats-rating-footer > span { font-size: 0.75rem; color: var(--text-muted); }
.stats-rating-empty { display: flex; flex-direction: column; gap: 8px; text-align: center; padding: 35px 12px; color: var(--text-muted); }
.stats-rating-empty strong { color: var(--text); font-weight: 600; }
.stats-rating-panel [hidden] { display: none; }
@media (max-width: 600px) {
  .stats-rating-row-head { gap: 10px; }
  .stats-rating-values { gap: 7px; }
}
.stats-group-icon svg { flex-shrink: 0; }
.stats-group-icon:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.stats-group-details {
  position: fixed;
  z-index: 1200;
  width: min(360px, calc(100vw - 16px));
  max-height: min(400px, calc(100vh - 16px));
  overflow: auto;
  box-sizing: border-box;
  padding: 12px;
  color: var(--text, #172335);
  background: var(--surface, #fff);
  border: 1px solid var(--border, #b9c3d1);
  border-radius: 6px;
  box-shadow: 0 4px 16px #0002;
}
.stats-group-details[hidden] { display: none; }
.stats-group-details-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.stats-group-details-head strong { overflow-wrap: anywhere; }
.stats-group-details-head button { flex-shrink: 0; border: 0; background: transparent; color: inherit; padding: 0 4px; cursor: pointer; font: inherit; }
.stats-group-details table { width: 100%; border-collapse: collapse; font-size: 12px; }
.stats-group-details th, .stats-group-details td { text-align: left; padding: 5px 0; border-bottom: 1px solid var(--border, #b9c3d1); overflow-wrap: anywhere; }
.stats-group-details th:last-child, .stats-group-details td:last-child { text-align: right; padding-left: 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.stats-group-details tfoot th, .stats-group-details tfoot td { font-weight: 600; border-bottom: 0; }
.stats-group-members { border: 0; padding: 0; margin: 0; }
#stats-group-editor-title { margin-top: 16px; }
#stats-group-options { max-height: 320px; overflow: auto; margin: 8px 0; }
.stats-group-option { display: flex; align-items: center; gap: 10px; padding: 6px 4px; margin: 0; }
.stats-group-option input { flex: 0 0 auto; width: auto; min-height: 0; margin: 0; }
.stats-group-option > span { overflow-wrap: anywhere; }
.stats-group-option small { display: block; font-weight: normal; }
.stats-group-option .num { margin-left: auto; flex-shrink: 0; }
.stats-group-saved { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.stats-group-saved > span { overflow-wrap: anywhere; }

.stats-count-bar {
  display: block;
  flex: 0 1 72px;
  width: 72px;
  max-width: 72px;
  height: 6px;
  background: var(--surface-muted, #eef1f5);
  border-radius: 999px;
  overflow: hidden;
}

.stats-count-bar-fill {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 999px;
  min-width: 2px;
  opacity: 0.75;
}

.stats-count-value {
  min-width: 1.5rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.stats-bars {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.stats-bar-row {
  display: grid;
  grid-template-columns: minmax(80px, 120px) 1fr 2.5rem;
  gap: 10px;
  align-items: center;
}

.stats-bar-label {
  font-size: 0.8125rem;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stats-bar-track {
  height: 14px;
  background: var(--surface-muted, #eef1f5);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.stats-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 70%, #fff));
  border-radius: var(--radius-sm);
  min-width: 3px;
  transition: width 0.2s ease;
}

.stats-bar-count {
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.stats-empty {
  font-size: 0.8125rem;
  color: var(--muted);
  margin: 0;
}

.stats-detail-grid {
  margin-top: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 720px) {
  .stats-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Skeleton loading ── */

.skeleton-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.skeleton {
  background: linear-gradient(90deg, var(--surface-muted) 25%, var(--surface-raised) 50%, var(--surface-muted) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.2s ease-in-out infinite;
  border-radius: var(--radius-sm);
}

.skeleton-bar {
  height: 32px;
  width: 240px;
}

.skeleton-card {
  height: 280px;
  width: 100%;
  border-radius: var(--radius);
}

@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ── Dashboard count loading ── */

.module-count--loading {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 2rem;
  min-height: 1.75rem;
}

.module-count-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: module-count-spin 0.65s linear infinite;
}

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

.module-count--pop {
  animation: dashboard-count-pop 0.45s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

@keyframes dashboard-count-pop {
  0% {
    opacity: 0.4;
    transform: scale(0.82);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .module-count-spinner,
  .module-count--pop {
    animation: none !important;
  }
}

.admin-loading {
  padding: 48px;
  text-align: center;
  color: var(--muted);
}

/* ── Admin ── */

.admin-panel-body { width: 100%; }

.admin-panel-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.admin-panel-toolbar.admin-panel-toolbar-actions { justify-content: flex-end; }

.admin-panel-toolbar h2 {
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
  color: var(--text);
}

.admin-table-wrap { margin-bottom: var(--space-4); }

.admin-table { margin: 0; }

.admin-health-matrix-wrap {
  overflow-x: auto;
}

.admin-health-matrix {
  width: 100%;
  min-width: 480px;
}

.admin-health-matrix th,
.admin-health-matrix td {
  vertical-align: top;
  font-size: 0.875rem;
}

.admin-health-matrix th[scope="row"] {
  font-weight: 500;
  white-space: nowrap;
  color: var(--text-muted);
  width: 1%;
}

.admin-health-matrix thead th {
  font-weight: 600;
  min-width: 120px;
}

.admin-health-matrix tbody td {
  min-width: 140px;
}

.admin-actions { white-space: nowrap; }
.admin-actions .btn + .btn { margin-left: 6px; }
.admin-actions--icon { width: 44px; text-align: center; }
.admin-actions--icon .mwo-icon-btn { margin-left: 0; }
.admin-col-icon { width: 44px; }

.admin-form-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-xs);
}

.admin-form-card h3 {
  font-size: 0.9375rem;
  margin-bottom: 16px;
}

.admin-export-paths-section {
  margin-top: 24px;
}

.admin-export-site-card {
  margin-bottom: 12px;
}

.admin-site-name-button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.admin-site-name-button:hover {
  color: var(--accent);
  text-decoration: underline;
}

.admin-site-detail-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.admin-site-detail-title h2 {
  margin: 0;
}

.admin-site-cleanup-card {
  border-color: color-mix(in srgb, var(--danger) 38%, var(--border));
  margin-top: 22px;
}

.admin-site-cleanup-card .admin-form-card-head {
  align-items: flex-start;
}

.admin-site-cleanup-card .admin-form-card-head h3 {
  color: var(--danger);
  margin-bottom: 5px;
}

.admin-site-cleanup-warning {
  margin-bottom: 14px;
}

.admin-site-cleanup-options {
  display: grid;
  gap: 9px;
}

.admin-site-cleanup-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  cursor: pointer;
}

.admin-site-cleanup-option:has(input:checked) {
  border-color: color-mix(in srgb, var(--danger) 52%, var(--border));
  background: color-mix(in srgb, var(--danger) 5%, var(--surface));
}

.admin-site-cleanup-option:has(input:disabled) {
  cursor: not-allowed;
  opacity: 0.62;
}

.admin-site-cleanup-option input {
  width: auto;
  min-height: auto;
  margin-top: 3px;
  flex: 0 0 auto;
}

.admin-site-cleanup-option span {
  display: grid;
  gap: 3px;
}

.admin-site-cleanup-option small {
  color: var(--muted);
  line-height: 1.4;
}

.admin-site-cleanup-suboption {
  margin-left: 28px;
}

.admin-site-cleanup-counter {
  width: min(280px, calc(100% - 28px));
  margin: 0 0 2px 28px;
}

.admin-site-cleanup-summary {
  display: grid;
  gap: 10px;
}

.admin-site-cleanup-summary p,
.admin-site-cleanup-summary ul {
  margin: 0;
}

.admin-site-cleanup-summary ul {
  padding-left: 20px;
}

.admin-site-cleanup-summary li + li {
  margin-top: 6px;
}

.admin-site-cleanup-summary .text-danger {
  color: var(--danger);
}

.admin-form-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.admin-form-card-head h3 { margin-bottom: 0; }

.admin-form-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: end;
}

.admin-form-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.admin-muted { color: var(--muted); font-size: 0.875rem; }

.admin-compact-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  font-size: 0.875rem;
}

.admin-compact-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  margin-top: 12px;
}

.admin-compact-form input {
  padding: 9px 12px;
  font-size: 0.875rem;
}

.admin-panel-toolbar h2 {
  margin-bottom: 0;
}

.admin-module-settings {
  padding-top: 4px;
}

.admin-module-settings .form-section-title {
  margin-top: 32px;
  margin-bottom: 16px;
}

.admin-module-settings .form-section-title:first-of-type {
  margin-top: 12px;
}

.ur-example-manager {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ur-example-field-picker {
  max-width: 720px;
  margin: 0;
}

.ur-example-manager-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

.ur-example-manager-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ur-example-manager-item,
.ur-example-add-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.ur-example-manager-item input,
.ur-example-add-row input {
  min-height: 42px;
}

.ur-example-manager-empty {
  padding: 20px 12px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
}

.ur-example-add-row {
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

@media (max-width: 680px) {
  .ur-example-manager-item,
  .ur-example-add-row {
    grid-template-columns: 1fr;
  }
}

.admin-section-body {
  margin-bottom: 8px;
}

.admin-data-provider-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.admin-data-provider-row .tech-switch {
  margin-top: 0;
  flex: 1 1 auto;
  min-width: min(100%, 280px);
}

.admin-data-provider-active {
  flex-shrink: 0;
  white-space: nowrap;
  text-align: right;
}

.admin-settings-actions {
  display: flex;
  justify-content: flex-start;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}

.word-template-path-panel {
  margin-bottom: 8px;
}

.word-template-status-line {
  margin-top: 4px;
}

.word-template-status {
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}

.word-template-status strong {
  color: var(--text);
  font-weight: 600;
}

.word-template-status--missing,
.word-template-status--warn {
  color: #b45309;
}

.word-mapping-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

@media (max-width: 960px) {
  .word-mapping-grid { grid-template-columns: 1fr; }
}

.word-mapping-column {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  min-height: 220px;
  display: flex;
  flex-direction: column;
}

.word-mapping-column-head {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  font-weight: 600;
  font-size: 13px;
  background: var(--surface-raised);
}

.word-mapping-scroll {
  padding: 10px;
  overflow: auto;
  max-height: 360px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.word-mapping-group-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin: 8px 0 4px;
}

.word-mapping-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  cursor: grab;
  font-size: 13px;
}

.word-mapping-chip.mapped {
  opacity: 0.72;
  border-style: dashed;
}

.word-mapping-chip-count {
  margin-left: 6px;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
}

.word-mapping-chip.dragging {
  opacity: 0.45;
}

.word-mapping-chip--selected,
.word-mapping-chip.mapped.word-mapping-chip--selected {
  opacity: 1;
  border-color: var(--primary);
  border-style: solid;
  background: color-mix(in srgb, var(--primary) 10%, white);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 18%, transparent);
  cursor: pointer;
}

.word-mapping-chip:focus-visible,
.word-mapping-drop:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.word-mapping-chip-meta {
  font-size: 11px;
  color: var(--muted);
}

.word-mapping-chip--static {
  position: relative;
  padding-right: 1.75rem;
}

.st-mapping-static-toolbar {
  padding: 0.5rem 0.75rem 0.25rem;
}

.st-mapping-static-scroll {
  max-height: 12rem;
}

.st-static-remove {
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
  width: 1.25rem;
  height: 1.25rem;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  line-height: 1;
  padding: 0;
}

.st-static-remove:hover {
  background: rgba(0, 0, 0, 0.06);
  color: var(--text);
}

.md-dialog-empty {
  color: var(--muted);
  font-size: 14px;
}

.md-dialog-select {
  width: 100%;
  min-height: 8rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  line-height: 1.45;
}

.md-dialog-select option {
  padding: 0.35rem 0.25rem;
}

.word-mapping-drop {
  min-height: 42px;
  border: 2px dashed var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  transition: border-color 0.15s, background 0.15s;
}

.word-mapping-drop.drag-over {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--primary) 8%, white);
}

.word-mapping-drop--suggested {
  border-color: #f59e0b;
  background: color-mix(in srgb, #f59e0b 10%, var(--surface));
}

.word-mapping-drop--selectable {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--border));
  cursor: pointer;
}

.word-mapping-drop--selectable:hover {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--primary) 8%, white);
}

.word-mapping-instruction {
  margin-bottom: 12px;
}

.word-mapping-drop-label {
  font-size: 12px;
  color: var(--muted);
}

.word-mapping-drop-value {
  font-size: 13px;
  font-weight: 600;
  margin-top: 2px;
}

.word-mapping-drop-preview {
  margin-top: 4px;
  font-size: 11px;
  color: var(--muted);
}

.word-mapping-links {
  margin-top: 20px;
}

.word-mapping-links table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.word-mapping-links th,
.word-mapping-links td {
  border-bottom: 1px solid var(--border);
  padding: 8px 10px;
  text-align: left;
  vertical-align: top;
}

.word-mapping-links th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.word-mapping-links tr.word-mapping-link--suggested td {
  background: color-mix(in srgb, #f59e0b 10%, var(--surface));
  border-bottom-color: color-mix(in srgb, #f59e0b 42%, var(--border));
}

.word-mapping-links tr.word-mapping-link--suggested td:first-child {
  box-shadow: inset 3px 0 0 #f59e0b;
}

.word-mapping-empty {
  color: var(--muted);
  font-size: 13px;
  padding: 8px 2px;
}

.module-option-sections {
  display: flex;
  flex-direction: column;
  gap: 28px;
  margin-top: 4px;
}

.option-list-section + .option-list-section {
  padding-top: 4px;
  border-top: 1px solid var(--border);
}

.option-list-head h3 {
  margin: 0 0 4px;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--text);
}

.option-list-head .admin-muted {
  margin: 0 0 12px;
}

.option-list-table td {
  vertical-align: middle;
}

.entry-list-table td input[type="text"] {
  width: 100%;
  min-height: 40px;
}

.entry-list-actions-col {
  width: 1%;
  white-space: nowrap;
}

.entry-list-add-foot td {
  vertical-align: middle;
  background: var(--surface-raised);
  border-top: 2px solid var(--border);
}

.entry-list-add-foot input[type="text"] {
  width: 100%;
  min-height: 40px;
}

.option-list-edit-input,
.option-list-add-field,
.option-list-add-label,
.option-list-add-input {
  width: 100%;
}

.option-list-actions {
  width: 1%;
  white-space: nowrap;
}

.mwo-template-sections {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.mwo-template-section .form-section-title {
  margin-top: 0;
}

.mwo-template-msg {
  margin-top: 8px;
}

.tag-list { display: flex; flex-wrap: wrap; gap: 6px; }

.tag {
  display: inline-block;
  padding: 2px 8px;
  background: var(--surface-raised);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 0.75rem;
  color: var(--text);
}

.tag-all { background: var(--accent-muted); border-color: #bfdbfe; color: var(--accent); }

.checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px;
}

.checkbox-card {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-xs);
  cursor: pointer;
  font-weight: 400;
  color: var(--text);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.checkbox-card:hover { border-color: var(--border-strong); }
.checkbox-card input { width: auto; min-height: auto; flex-shrink: 0; }

.repl-row {
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 8px;
  box-shadow: var(--shadow-xs);
}

.repl-row-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 8px;
}

/* ── Login ── */

.login-page {
  min-height: 100vh;
  background: var(--bg);
}

.login-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
  width: 100%;
}

.login-brand {
  background: var(--sidebar-bg);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px;
  text-align: center;
}

.login-brand-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin: 0;
}

.login-brand-primary {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.1;
  color: #fff;
}

.login-brand-secondary {
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.3;
  color: var(--sidebar-text);
}

.login-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1.5rem, 3vw, 2rem);
  width: 100%;
}

.login-box {
  width: 100%;
  max-width: 380px;
  margin-bottom: 0;
}

.login-box h2 {
  font-size: 1.25rem;
  margin-bottom: 20px;
  text-transform: none;
  letter-spacing: normal;
  color: var(--text);
}

.login-step-hint {
  margin: -8px 0 18px;
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.45;
}

.login-box .btn-primary { margin-bottom: 4px; }

.admin-sites-inline {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

code {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.8125rem;
  background: var(--surface-raised);
  padding: 2px 6px;
  border-radius: 4px;
}

.hidden { display: none !important; }
.nav { display: none; }

.container {
  width: 100%;
  padding: var(--content-padding-y) var(--content-padding-x);
}

.section-title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-secondary);
  margin: 20px 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

/* ── App banner (Hinweise oben) ── */

.app-banner-wrap {
  flex-shrink: 0;
  width: 100%;
}

.app-banner-wrap.hidden {
  display: none !important;
}

.app-banner {
  margin: 0;
  border-radius: 0;
  border-left: none;
  border-right: none;
  border-top: none;
  padding: 10px var(--content-padding-x);
  font-size: 0.875rem;
  font-weight: 500;
}

/* Application feedback: one consistent, accessible stack above the page. */
.md-toast-root{position:fixed;top:calc(var(--space-4) + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);z-index:var(--layer-toast,10000);width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow-y:auto;display:grid;gap:var(--space-2);pointer-events:none;padding:var(--space-1);box-sizing:border-box}
.md-toast{--toast-tone:var(--info);--toast-tint:var(--info-bg);display:flex;align-items:center;gap:var(--space-3);pointer-events:auto;padding:var(--space-4);border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text);box-shadow:var(--shadow-md);font-size:var(--font-size-small);line-height:1.45;animation:md-toast-in 180ms ease-out}
.md-toast-copy{flex:1;min-width:0;overflow-wrap:anywhere}.md-toast-title{display:block;font-weight:600}.md-toast-detail{display:block;font-size:var(--font-size-label);color:var(--text-muted);margin-top:var(--space-1)}
.md-toast-symbol{display:grid;place-items:center;flex:0 0 32px;height:32px;background:var(--toast-tint);color:var(--toast-tone);border-radius:50%}.md-toast svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.md-toast-close{flex:0 0 32px;display:grid;place-items:center;height:32px;padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);cursor:pointer}.md-toast-close svg{width:16px;height:16px}.md-toast-close:hover{background:var(--surface-muted)}
.md-toast--success{--toast-tone:var(--success);--toast-tint:var(--success-bg)}.md-toast--error{--toast-tone:var(--danger);--toast-tint:var(--danger-bg)}.md-toast--warning{--toast-tone:var(--warning);--toast-tint:var(--warning-bg)}
@keyframes md-toast-in{from{opacity:0;transform:translateY(calc(-100% - 32px))}to{opacity:1;transform:translateY(0)}}
.md-toast--leaving{animation:md-toast-out 180ms ease-in forwards;pointer-events:none}
@keyframes md-toast-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(calc(-100% - 32px))}}
.admin-checklist{display:grid;gap:var(--space-4)}.admin-checklist .msh-export-group{margin:0;background:var(--surface)}.checklist-point-row{display:flex;align-items:center;gap:var(--space-2)}.checklist-point-row input{flex:1;min-width:0}.checklist-point-row .btn{flex-shrink:0}

/* ── Technische Formulare ── */

.panel-tech {
  padding: 0;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.tech-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
}

.tech-box {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 16px;
  box-shadow: none;
}

.tech-box + .tech-box {
  margin-top: 0;
}

.ur-form .tech-box {
  padding: 16px 20px;
}

.ur-box-title {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin: 0 0 6px;
}

.ur-box-heading-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.ur-box-heading-row .ur-box-title {
  margin-bottom: 0;
}

.ur-box-heading-actions {
  flex-shrink: 0;
}

.ur-box-subtitle {
  margin: 0 0 14px;
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--text-secondary);
  line-height: 1.4;
  text-transform: none;
  letter-spacing: normal;
}

.ur-kopf-row {
  display: grid;
  grid-template-columns: minmax(0, 2.2fr) minmax(140px, 0.9fr) minmax(160px, 1fr);
  gap: 12px 16px;
  align-items: end;
  margin-bottom: 16px;
}

.tech-field-hint {
  display: block;
  margin: -2px 0 4px;
  font-size: 0.6875rem;
  font-weight: 400;
  color: var(--text-secondary);
  text-transform: none;
  letter-spacing: normal;
  line-height: 1.3;
}

.ur-ident-grid .tech-field-hint {
  min-height: calc(0.6875rem * 1.3 * 2);
}

.ur-ident-grid .tech-field-hint-spacer {
  visibility: hidden;
}

.ur-bewertung-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ur-meldeart-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ur-meldeart-check {
  min-height: 52px;
  padding: 12px 14px;
  gap: 12px;
  align-items: flex-start;
  line-height: 1.35;
}

.ur-meldeart-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  min-height: 24px;
  flex: 0 0 24px;
  margin-top: 1px;
  border: 2px solid var(--border-strong);
  border-radius: 4px;
  background: var(--surface);
  cursor: pointer;
  transition: border-color 0.15s ease;
}

.ur-meldeart-check input[type="checkbox"]:checked {
  background-color: var(--surface);
  border-color: var(--border-strong);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M1.5 1.5L10.5 10.5M10.5 1.5L1.5 10.5' stroke='%23334155' stroke-width='2.75' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.ur-meldeart-check input[type="checkbox"]:checked:disabled {
  opacity: 1;
  background-color: var(--surface);
  border-color: var(--border-strong);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M1.5 1.5L10.5 10.5M10.5 1.5L1.5 10.5' stroke='%23334155' stroke-width='2.75' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  cursor: default;
}

.ur-meldeart-check input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.ur-massnahme-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ur-massnahme-check {
  min-height: 52px;
}

.tech-check.ur-massnahme-check {
  height: 56px;
  min-height: 56px;
  padding: 8px 12px;
  column-gap: 10px;
  align-items: center;
}

.tech-check.ur-massnahme-check > input[type="checkbox"] {
  margin: 0;
}

.tech-check.ur-massnahme-check .ur-massnahme-custom-text {
  height: 38px;
  min-height: 38px;
}

.ur-massnahme-custom {
  align-items: center;
}

.ur-massnahme-custom-text {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 40px;
  width: auto;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: none;
  font-size: 0.875rem;
  line-height: 1.35;
}

.ur-massnahme-custom-text:focus {
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.ur-massnahme-custom-text:disabled {
  background: var(--surface-raised);
  opacity: 0.75;
  cursor: not-allowed;
}

.ur-freigabe-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 16px;
  align-items: end;
}

.ur-freigabe-row .tech-field {
  height: 100%;
  justify-content: flex-end;
}

.ur-freigabe-row .tech-field > label {
  min-height: 18px;
}

.ur-freigabe-row .tech-field > input {
  width: 100%;
  height: 42px;
  min-height: 42px;
  line-height: 1.35;
}

.ur-anlagen-container {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.ur-anlagen-section-title {
  margin: 0 0 8px;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
}

.ur-anlagen-panel {
  width: 100%;
}

.ur-anlagen-caption {
  padding: 6px 8px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted);
  background: var(--surface);
  border-top: 1px solid var(--border);
  text-align: center;
}

.ur-anlagen-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
}

.ur-anlagen-item {
  position: relative;
  margin: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--surface-raised);
}

.ur-anlagen-preview-btn {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.ur-anlagen-preview-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.ur-anlagen-item img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  pointer-events: none;
  background: #fff;
}

.ur-anlagen-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
}

.ur-anlagen-remove:hover {
  background: rgba(185, 28, 28, 0.92);
}

.ur-anlagen-upload {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 120px;
  padding: 16px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text-secondary);
  cursor: pointer;
  text-align: center;
}

.ur-anlagen-upload:hover {
  border-color: var(--accent);
  color: var(--accent-hover);
  background: var(--accent-muted);
}

.ur-anlagen-upload-icon {
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1;
}

.ur-anlagen-upload-label {
  font-size: 0.875rem;
  font-weight: 600;
}

.ur-anlagen-upload-hint {
  font-size: 0.75rem;
}

.ur-anlagen-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ur-usage-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ur-usage-fields .tech-field {
  width: 100%;
}

.ur-usage-fields .tech-field-hint {
  min-height: auto;
}

.ur-field-label-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 14px;
  flex-wrap: wrap;
}

.ur-field-examples {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 2px 4px;
  min-width: 0;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}

.ur-example-prefix {
  color: var(--muted);
  margin-right: 3px;
}

.ur-example-link {
  display: inline-block;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--accent);
  font: inherit;
  line-height: inherit;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: pointer;
  white-space: nowrap;
}

.ur-example-link:hover:not(:disabled):not(.is-used) {
  background: transparent;
  color: var(--accent-hover);
  text-decoration-style: solid;
}

.ur-example-link.is-used {
  background: transparent;
  color: var(--muted);
  text-decoration: line-through;
  cursor: default;
}

.ur-example-separator {
  color: var(--muted);
  margin-left: -2px;
}

.ur-example-link:disabled {
  cursor: default;
  opacity: 0.7;
}

.ur-install-template-section .ur-box-subtitle {
  margin: -4px 0 12px;
}

.mwo-form .tech-section {
  border: none;
  padding: 0;
  margin: 0;
}

.mwo-form .tech-section legend {
  display: none;
}

.mwo-form-lock-notice {
  margin-bottom: 16px;
}

.document-form--deleted {
  pointer-events: none;
}

.document-form--deleted :disabled {
  opacity: 1;
}

.mwo-form--locked .ur-meldeart-check {
  pointer-events: none;
  cursor: default;
}

.mwo-form--locked input:not(#f-MWO_Nr):not([type="checkbox"]),
.mwo-form--locked textarea,
.mwo-form--locked select {
  background-color: var(--surface-raised);
}

.mwo-form--locked .ur-meldeart-check input[type="checkbox"] {
  background-color: var(--surface);
}

.mwo-form--locked .ur-meldeart-check input[type="checkbox"]:checked {
  background-color: var(--surface);
  border-color: var(--border-strong);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M1.5 1.5L10.5 10.5M10.5 1.5L1.5 10.5' stroke='%23334155' stroke-width='2.75' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.mwo-form--locked .btn-now {
  opacity: 0.45;
  pointer-events: none;
}

.desc-type-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: 100%;
  margin-bottom: 12px;
}

.desc-type-grid .desc-type-toggle {
  display: block;
  margin: 0;
  min-width: 0;
  cursor: pointer;
}

.desc-type-toggle-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.desc-type-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text-secondary);
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.25;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
  user-select: none;
  box-sizing: border-box;
}

.desc-type-toggle:hover .desc-type-toggle-btn {
  border-color: var(--border-strong);
  background: var(--surface-raised);
  color: var(--text);
}

.desc-type-toggle-input:checked + .desc-type-toggle-btn {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.desc-type-toggle-input:focus-visible + .desc-type-toggle-btn {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.desc-type-toggle-input:checked + .desc-type-toggle-btn:hover {
  border-color: var(--accent-hover);
  background: var(--accent-hover);
}

.desc-type-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.desc-type-block {
  padding: 12px;
  background: var(--surface-raised);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  width: 100%;
}

.desc-type-label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 10px;
}

.desc-type-row .tech-field .combo,
.desc-type-row .tech-field .combo-input {
  width: 100%;
}

.desc-type-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  width: 100%;
}

.desc-type-row .tech-field {
  min-width: 0;
}

.desc-type-row .tech-field input {
  width: 100%;
}

.desc-type-row .tech-field-hours input.desc-hours {
  font-family: ui-monospace, Consolas, monospace;
  letter-spacing: 0.04em;
  text-align: center;
}

.tech-grid-2 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
}

.mwo-kopf-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mwo-kopf-fields > .tech-field {
  width: 100%;
}

.tech-switch {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
  cursor: pointer;
  font-size: 0.875rem;
  color: var(--text);
}

.tech-switch.setting-switch-row {
  width: 100%;
  min-height: 70px;
  margin-top: 12px;
  padding: 13px 15px;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
}

.setting-switch-copy {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

.setting-switch-title {
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.35;
}

.setting-switch-description {
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.4;
}

.tech-switch input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.tech-switch-slider {
  width: 44px;
  height: 24px;
  background: var(--border-strong);
  border-radius: 999px;
  position: relative;
  flex-shrink: 0;
  transition: background 0.15s ease;
}

.tech-switch-slider::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.15s ease;
}

.tech-switch input:checked + .tech-switch-slider {
  background: var(--accent);
}

.tech-switch input:checked + .tech-switch-slider::after {
  transform: translateX(20px);
}

.tech-switch input:focus-visible + .tech-switch-slider {
  outline: 3px solid color-mix(in srgb, var(--accent) 28%, transparent);
  outline-offset: 2px;
}

.tech-switch input:disabled + .tech-switch-slider {
  cursor: not-allowed;
  opacity: 0.52;
}

.tech-switch-label {
  line-height: 1.4;
}

.repl-table .repl-col-qty {
  width: 64px;
  max-width: 64px;
}

.repl-table .repl-col-part,
.repl-table .repl-col-serial {
  min-width: 160px;
}

.repl-table .repl-col-reason {
  width: 100px;
}

.status-tag {
  min-height: 32px;
  padding: 4px 8px;
  font-size: 0.8125rem;
  font-weight: 600;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-raised);
  cursor: pointer;
}

.status-cell {
  white-space: nowrap;
}

.status-cell .status-select {
  max-width: 140px;
}

.tech-section {
  margin: 0;
  padding: 16px 20px;
  border: none;
  border-bottom: 1px solid var(--border);
}

.tech-section:last-of-type {
  border-bottom: none;
}

.tech-section legend {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding: 0 4px;
  margin-bottom: 12px;
  width: 100%;
}

.tech-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 12px 16px;
}

.tech-grid .tech-field > label,
.tech-grid .tech-field-now .tech-field-label-row {
  min-height: 24px;
  display: flex;
  align-items: center;
}

.tech-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

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

.tech-field label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-secondary);
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.tech-field input,
.tech-field select,
.tech-field textarea {
  min-height: 40px;
  font-size: 0.9375rem;
}

.tech-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
}

.tech-check {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 12px;
  margin: 0;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  font-size: 0.875rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: normal;
  cursor: pointer;
}

.tech-check input {
  width: auto;
  min-height: auto;
  margin: 0;
}

.tech-table input,
.tech-table select {
  min-height: 36px;
  padding: 6px 8px;
  font-size: 0.875rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  width: 100%;
}

.tech-table .tech-item-nr {
  font-weight: 700;
  color: var(--muted);
  text-align: center;
  width: 48px;
}

.panel-tech .btn-group {
  padding: 16px 20px;
  margin: 0;
  border-top: 1px solid var(--border);
  background: var(--surface-raised);
}

.panel-tech #msg {
  padding: 0 20px 16px;
}

/* ── Responsive ── */

@media (min-width: 1600px) {
  :root { --sidebar-width: 260px; }
}

@media (max-width: 1024px) {
  .sidebar-toggle { display: inline-flex; }

  .sidebar-close { display: inline-flex; }

  .app-main {
    margin-left: 0;
    width: 100%;
  }

  .form-action-bar {
    left: 0;
  }

  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: min(var(--sidebar-width), 85vw);
    z-index: 100;
    transform: translateX(-100%);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.15);
  }

  body.sidebar-open .sidebar { transform: translateX(0); }
  body.sidebar-open .sidebar-backdrop { display: block; }

  .sidebar-brand-name,
  .sidebar-label,
  .sidebar-user { display: block; }

  .sidebar-brand {
    justify-content: flex-start;
    padding: 18px 16px;
  }

  .sidebar-link { justify-content: flex-start; }

  .sidebar-footer .btn {
    display: inline-flex;
    font-size: 0.8125rem;
  }
}

@media (max-width: 768px) {

  .login-split { grid-template-columns: 1fr; }

  .login-brand {
    padding: 28px 24px;
    min-height: auto;
  }

  .login-brand-primary {
    font-size: 1.75rem;
  }

  .login-brand-secondary {
    font-size: 1rem;
  }
  .login-panel { padding: 24px 16px; }

  .page-header h1 { font-size: 1.25rem; }

  .page-header--with-search {
    grid-template-columns: 1fr;
  }

  .page-header--with-search h1,
  .page-header--with-search .page-header-search,
  .page-header--with-search .page-header-actions {
    justify-self: stretch;
  }

  .page-header--with-search .page-header-actions {
    justify-content: flex-start;
  }

  .btn-group {
    flex-direction: column;
    align-items: stretch;
  }

  .btn-group .btn { width: 100%; }

  .admin-form-row,
  .admin-compact-form {
    grid-template-columns: 1fr;
  }

  .form-action-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    min-height: auto;
  }

  .form-action-bar-actions {
    width: 100%;
  }

  .form-action-bar-actions .btn {
    flex: 1;
  }

  .form-action-bar-msg {
    justify-content: stretch;
  }

  .form-action-bar-msg .alert {
    max-width: none;
    width: 100%;
  }

  .desc-type-row {
    grid-template-columns: 1fr;
  }

  .ur-kopf-row,
  .ur-meldeart-grid,
  .ur-bewertung-grid,
  .ur-massnahme-grid,
  .ur-freigabe-row {
    grid-template-columns: 1fr;
  }

  .ur-massnahme-check,
  .ur-massnahme-custom {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

@media (max-width: 480px) {
  :root {
    --content-padding-x: 1rem;
    --content-padding-y: 1rem;
  }

  .topbar-meta {
    font-size: 0.8125rem;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .md-dialog-root {
    padding: 12px;
  }

  .md-dialog {
    max-height: calc(100vh - 24px);
    max-height: calc(100dvh - 24px);
  }

  .md-dialog-footer {
    flex-wrap: wrap;
  }

  .md-dialog-footer .btn {
    flex: 1 1 140px;
  }
}

.email-template-editor-card {
  margin-top: 1.25rem;
}

.email-tpl-options {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.email-tpl-options .email-tpl-switch {
  margin-top: 0;
  width: 100%;
  max-width: none;
  align-items: center;
}

.email-tpl-body {
  min-height: 10rem;
  resize: vertical;
}

@media (max-width: 560px) {
  .tech-switch.setting-switch-row {
    min-height: 64px;
    padding: 12px;
    gap: 14px;
  }
}

.email-tpl-variables-wrap {
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border);
}

.email-tpl-variables-wrap h3 {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
}

.email-tpl-variables.word-mapping-scroll {
  max-height: 260px;
  overflow-x: hidden;
  overflow-y: auto;
}

.email-tpl-variables {
  padding-top: 4px;
}

.email-template-editor-card .form-actions {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
  position: relative;
  z-index: 1;
  background: var(--surface);
}

.email-tpl-variables .word-mapping-group-title {
  margin-top: 14px;
}

.email-tpl-variables .word-mapping-group-title:first-child {
  margin-top: 0;
}

.email-tpl-variables .email-var-chip {
  cursor: pointer;
  border: 1px solid var(--border-strong);
  background: var(--surface);
  text-align: left;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.email-tpl-variables .email-var-chip:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 28%, transparent);
}

.email-tpl-variables .email-var-chip:hover .word-mapping-chip-meta {
  color: rgba(255, 255, 255, 0.88);
}

/* Dokumentbezogener Aktivitätsverlauf */
.activity-panel {
  margin-top: 28px;
  padding: 0;
  overflow: hidden;
  border-color: var(--border-strong);
}

.activity-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 22px 17px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-raised);
}

.activity-panel-header h2 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.3;
}

.activity-panel-header p {
  margin: 4px 0 0;
  color: var(--text-muted);
  font-size: 0.86rem;
}

.activity-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 88px;
  padding: 20px 22px;
  background: color-mix(in srgb, var(--surface-raised) 54%, var(--surface));
}

.activity-list--scrollable {
  max-height: 380px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.activity-item {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}

.activity-item--system {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px 14px;
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-left: 4px solid #94a3b8;
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.activity-item--created {
  border-left-color: #0f9f8f;
}

.activity-item--status {
  border-left-color: #3b82f6;
}

.activity-item--sent,
.activity-item--email {
  border-left-color: #8b5cf6;
}

.activity-item--serviceable-tag {
  border-left-color: #10b981;
}

.activity-item--printed {
  border-left-color: #64748b;
}

.activity-item--import {
  border-left-color: #f59e0b;
}

.activity-item--deleted {
  border-left-color: #dc2626;
}

.activity-item--created .activity-event-label {
  background: #dff7f2;
  color: #0f766e;
}

.activity-item--status .activity-event-label {
  background: #e5efff;
  color: #1d4ed8;
}

.activity-item--sent .activity-event-label,
.activity-item--email .activity-event-label {
  background: #f0e9ff;
  color: #6d28d9;
}

.activity-item--serviceable-tag .activity-event-label {
  background: #dff8ec;
  color: #047857;
}

.activity-item--printed .activity-event-label {
  background: #e8edf3;
  color: #475569;
}

.activity-item--import .activity-event-label {
  background: #fff2d6;
  color: #a16207;
}

.activity-item--deleted .activity-event-label {
  background: #fee2e2;
  color: #b91c1c;
}

.activity-item--system .activity-message {
  min-width: 0;
}

.activity-system-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  color: var(--text-muted);
  font-size: 0.76rem;
  white-space: nowrap;
}

.activity-system-meta strong {
  color: var(--text);
  font-size: 0.8rem;
}

.activity-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #e7edf5;
  color: #334155;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.02em;
}

.activity-bubble {
  min-width: 0;
  max-width: min(900px, calc(100% - 45px));
  padding: 11px 14px;
  border: 1px solid var(--border);
  border-radius: 4px 12px 12px 12px;
  background: var(--surface);
}

.activity-item--comment .activity-avatar {
  background: color-mix(in srgb, var(--accent) 16%, white);
  color: var(--accent);
}

.activity-item--comment .activity-bubble {
  border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
  background: color-mix(in srgb, var(--accent) 4%, var(--surface));
}

.activity-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 9px;
  margin-bottom: 5px;
  font-size: 0.78rem;
}

.activity-meta strong {
  color: var(--text);
  font-size: 0.84rem;
}

.activity-meta time {
  color: var(--text-muted);
}

.activity-event-label {
  padding: 2px 7px;
  border-radius: 999px;
  background: #e9eef5;
  color: #475569;
  font-size: 0.7rem;
  font-weight: 700;
}

.activity-message {
  color: var(--text);
  line-height: 1.48;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.activity-empty {
  display: grid;
  place-items: center;
  min-height: 48px;
  color: var(--text-muted);
  text-align: center;
  font-size: 0.88rem;
}

.activity-empty--error,
.activity-comment-feedback:not(:empty) {
  color: var(--danger);
}

.activity-composer {
  padding: 18px 22px 20px;
  border-top: 1px solid var(--border);
  background: var(--surface);
}

.activity-composer label {
  display: block;
  margin-bottom: 7px;
  font-size: 0.82rem;
  font-weight: 700;
}

.activity-composer textarea {
  width: 100%;
  min-height: 78px;
  resize: vertical;
}

.activity-composer-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  margin-top: 11px;
}

.activity-comment-feedback {
  margin-right: auto;
  color: var(--text-muted);
  font-size: 0.82rem;
}

@media (max-width: 680px) {
  .activity-panel-header,
  .activity-list,
  .activity-composer {
    padding-left: 16px;
    padding-right: 16px;
  }

  .activity-bubble {
    max-width: calc(100% - 45px);
  }

  .activity-item--system {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .activity-system-meta {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-left: 1px;
  }

  .activity-composer-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .activity-composer-actions .btn {
    width: 100%;
  }
}

/* Hilfe und Versionsinfo */
.help-page-card {
  padding: 0;
  overflow: hidden;
}

.help-content {
  color: var(--text);
  line-height: 1.6;
}

.help-page-card .help-content {
  padding: 24px 28px 32px;
}

.help-content .help-intro {
  margin-bottom: 22px;
}

.help-content .help-intro p {
  margin: 0 0 12px;
}

.help-quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.help-quick-links a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

.help-content section {
  padding: 0 2px 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--border);
  scroll-margin-top: 20px;
}

.help-content section:last-child {
  margin-bottom: 0;
  border-bottom: 0;
}

.help-content h2 {
  margin: 0 0 10px;
  color: var(--text);
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: normal;
  text-transform: none;
}

.help-content h3 {
  margin: 16px 0 8px;
  font-size: 0.95rem;
}

.help-content ul,
.help-content ol {
  margin: 8px 0 12px;
  padding-left: 22px;
}

.help-content li + li {
  margin-top: 6px;
}

.help-content a {
  color: var(--accent);
  font-weight: 650;
}

.help-editor-card {
  padding: 0;
  overflow: hidden;
}

.help-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-muted);
}

.help-editor,
.help-source-editor {
  width: 100%;
  min-height: 520px;
  max-height: 68vh;
  padding: 22px 24px;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  overflow: auto;
  resize: vertical;
  background: var(--surface);
}

.help-editor:focus,
.help-source-editor:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 28%, transparent);
  outline-offset: -2px;
}

.help-source-editor {
  font-family: Consolas, "Courier New", monospace;
  font-size: 0.82rem;
  line-height: 1.5;
}

.info-version-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.info-version-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 18px;
}

.info-version-card span {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.info-version-card strong {
  font-size: 1.35rem;
}

.version-rules {
  margin-bottom: 0;
}

.release-note {
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}

.release-note:first-child {
  padding-top: 2px;
}

.release-note:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.release-note-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.release-note-head span {
  color: var(--text-muted);
  font-size: 0.8rem;
}

.release-note ul {
  margin: 8px 0 0;
  padding-left: 20px;
}

@media (max-width: 760px) {
  .info-version-grid {
    grid-template-columns: 1fr;
  }

  .help-page-card .help-content,
  .help-editor,
  .help-source-editor {
    padding-left: 17px;
    padding-right: 17px;
  }
}
.import-wizard { margin-bottom: 18px; }
.import-wizard-heading, .import-wizard-toolbar, .import-review-navigation {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.import-wizard-heading h2 { margin: 0; }
.import-wizard-heading > span { color: var(--muted, #52627a); overflow-wrap: anywhere; }
.import-wizard-steps {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px;
  list-style: none; padding: 0; margin: 22px 0 18px;
}
.import-wizard-steps li {
  display: flex; align-items: center; gap: 10px; padding: 12px;
  color: #52627a; border-bottom: 3px solid #cbd5e1; background: #f5f7fa;
}
.import-wizard-steps li > span {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 26px;
  height: 26px; border: 1px solid currentColor; border-radius: 50%; font-weight: 700;
}
.import-wizard-steps li.is-active { color: var(--accent-hover); background: var(--accent-muted); border-color: var(--accent); font-weight: 700; }
.import-wizard-steps li.is-done { border-color: var(--accent); }
.import-overall-summary, .import-wizard-views, .import-filter-row, .import-package-counts {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 14px 0;
}
.import-overall-summary > span { padding-left: 12px; border-left: 1px solid #cbd5e1; }
.import-filter-row [aria-pressed="true"], .import-wizard-views [aria-pressed="true"] {
  color: var(--accent-hover); border-color: var(--accent); background: var(--accent-muted); box-shadow: inset 0 -2px var(--accent);
}
.import-review-navigation { margin: 12px 0 18px; }
.import-package-counts > span { min-width: 130px; padding: 14px; background: #f5f7fa; border-radius: 6px; }
.import-package-counts strong { display: block; color: #15324f; font-size: 24px; }
.import-queue td { overflow-wrap: anywhere; }
.import-wizard button:focus-visible, .import-filter-row button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
@media (max-width: 850px) {
  .import-wizard-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .import-wizard-toolbar { align-items: flex-start; }
}
.md-dialog.stats-export-dialog { --dialog-width:var(--dialog-size-export); }
.stats-export-dialog .stats-export-option { display:flex; align-items:center; gap:10px; padding:9px 0; margin:0; cursor:pointer; }
.stats-export-dialog input[type="checkbox"] { width:16px; height:16px; min-height:16px; padding:0; margin:0; flex:0 0 16px; accent-color:var(--accent); }
.stats-export-dialog .grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; margin-top:10px; border-top:1px solid var(--border); }
@media(max-width:600px) { .stats-export-dialog .grid-2 { grid-template-columns:1fr; } }

/* Shared UI variants: preserve the existing application design. */
.ui-icon-button{width:var(--control-height-compact);min-width:var(--control-height-compact);height:var(--control-height-compact);min-height:var(--control-height-compact);padding:var(--space-2);color:var(--accent)}
.ui-icon-button svg{width:18px;height:18px;flex:none}
.ui-icon-button--danger{color:var(--danger)}
.ui-icon-button--danger:hover:not(:disabled){background:var(--danger-bg);border-color:var(--danger)}
.ui-paging{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-3);flex-wrap:wrap;padding:var(--space-3) var(--space-4);color:var(--text-muted)}
.ui-inline-loading{display:flex;justify-content:center;align-items:center;gap:var(--space-3);min-height:8rem;color:var(--text-muted)}
.ui-inline-loading .md-screen-loader-spinner{width:28px;height:28px;border-width:3px;flex-shrink:0}
.card-heading{margin:0;font-size:var(--font-size-section);font-weight:600;color:var(--text);text-transform:none;letter-spacing:normal}
.tech-switch.setting-switch-row--compact{min-height:var(--control-height);margin:0;padding:var(--space-2) var(--space-3)}
dialog.ui-native-dialog{position:fixed;inset:0;margin:auto;width:min(var(--dialog-width,var(--dialog-size-compact)),calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);padding:0;border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);color:var(--text);box-shadow:var(--shadow-overlay);overflow:auto;font:inherit}
dialog.ui-native-dialog::backdrop{background:var(--overlay-backdrop)}
dialog.ui-native-dialog[open]{display:flex;flex-direction:column}
.ui-native-dialog .md-dialog-body{min-height:0;overflow:auto}
.ui-native-dialog .md-dialog-footer{flex-shrink:0}
dialog.ui-session-dialog{--dialog-width:var(--dialog-size-session);padding:var(--space-6);gap:var(--space-4)}
.ui-session-dialog input{margin:var(--space-2) 0 var(--space-4)}
.ui-session-dialog form>.btn{margin-bottom:var(--space-2);max-width:100%;white-space:normal}
.ui-session-dialog [role=alert]{color:var(--danger)}
.ui-session-warning{position:fixed;bottom:var(--space-6);right:var(--space-6);z-index:var(--layer-session-warning);width:max-content;max-width:calc(100vw - 48px);max-height:calc(100dvh - 48px);overflow:auto;overflow-wrap:anywhere;padding:var(--space-5);background:var(--warning-bg);color:var(--text);border:1px solid var(--warning);box-shadow:var(--shadow-md);border-radius:var(--radius)}
.ui-session-warning .btn{white-space:normal;max-width:100%}
@media(max-width:480px){.ui-session-warning{bottom:var(--space-4);right:var(--space-4);max-width:calc(100vw - 32px)}dialog.ui-session-dialog{padding:var(--space-4)}}
@media(pointer:coarse){.ui-icon-button{width:var(--control-height);height:var(--control-height);min-height:var(--control-height)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Administration: shared blueprint layout; original editor contracts remain intact. */
.admin-groups{display:flex;gap:var(--space-2);overflow-x:auto;padding:2px 2px var(--space-3);border-bottom:1px solid var(--border);margin-bottom:var(--space-3)}
.admin-group{flex-shrink:0;min-height:var(--control-height);padding:var(--space-2) var(--space-4);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit;cursor:pointer}
.admin-group.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.admin-group:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.admin-subtabs{flex-wrap:nowrap;overflow-x:auto;margin-bottom:var(--space-4)}
.admin-subtabs .admin-tab{flex-shrink:0;white-space:nowrap}
.admin-workspace .admin-table th:last-child,.admin-workspace .admin-table td.admin-actions{ text-align:right }
.admin-row-actions,.admin-section-actions{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-2)}
.admin-row-actions .btn+.btn{margin-left:0}
.admin-section-actions{margin-top:var(--space-3)}
.admin-workspace .admin-panel-toolbar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}
.admin-workspace .admin-panel-toolbar h3{margin:0}
.admin-workspace .admin-settings-card,.admin-workspace .admin-module-settings{border-radius:var(--radius-md)}
body:has(.admin-workspace) .form-action-bar-actions{order:2;margin-left:auto;justify-content:flex-end}
body:has(.admin-workspace) .form-action-bar-msg{order:1}
.eq-fixed-preview{display:flex;align-items:center;justify-content:center;min-height:150px;margin-top:var(--space-3);background:var(--surface-raised);border-radius:var(--radius)}
.eq-fixed-preview img{width:100%;max-width:260px;height:150px;object-fit:contain}
@media(max-width:650px){.admin-workspace .admin-panel-toolbar{flex-wrap:wrap}.admin-workspace .admin-panel-toolbar>.btn{margin-left:auto}.admin-group{padding:var(--space-2) var(--space-3)}body:has(.admin-workspace) .form-action-bar-actions{flex-basis:100%;justify-content:flex-end}}

.admin-workspace .admin-subtabs{border:0;border-radius:0;background:transparent;padding:0 0 var(--space-2);gap:var(--space-2);box-shadow:none}
.admin-workspace .admin-subtabs .admin-tab{border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;color:var(--text-secondary)}
.admin-workspace .admin-subtabs .admin-tab.active{border-bottom-color:var(--accent);color:var(--accent);background:transparent}

/* Shared administration refinements: standard create buttons, aligned actions. */
.admin-workspace .admin-panel-toolbar-actions,.admin-workspace .eq-toolbar.admin-panel-toolbar{justify-content:flex-start}
.admin-workspace td.admin-actions{text-align:right;white-space:nowrap}
.admin-template-analysis{margin:var(--space-3) 0 var(--space-4)}
.admin-info-card{width:100%;max-width:none}
.admin-info-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);margin:var(--space-4) 0}
.admin-info-facts dt{color:var(--text-muted);font-size:var(--font-size-label)}
.admin-info-facts dd{margin:var(--space-1) 0 0;overflow-wrap:anywhere;font-weight:600}
.admin-details{border-top:1px solid var(--border);padding-top:var(--space-3);margin-top:var(--space-3)}
.admin-details summary{cursor:pointer;color:var(--text);font-weight:600}
.admin-details .release-notes{margin-top:var(--space-3)}
@media(max-width:650px){.admin-info-facts{grid-template-columns:1fr}}

.admin-backup-tools{display:flex;align-items:flex-end;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-4)}
.admin-backup-tools label{margin:0;min-width:160px}

/* Familiar workflow: legible pending steps, no status before first save. */
.workflow-stepper-wrap{--wf-done:var(--success);--wf-active:var(--accent);--wf-pending:var(--text-muted);--wf-label:var(--text);--wf-label-pending:var(--text);width:100%;max-width:610px}
.workflow-stepper-track{display:grid;grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr);align-items:start}
.workflow-step-shell{min-width:0;display:block}
.workflow-step{width:100%;min-width:0;gap:var(--space-2);opacity:1}
.workflow-step-node{width:34px;height:34px;border:2px solid var(--text-muted);font-size:var(--font-size-label);font-weight:700}
.workflow-step--active .workflow-step-node{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.workflow-step--active .workflow-step-node::after{content:none}
.workflow-step--done .workflow-step-node{border-color:var(--success)}
.workflow-step--pending .workflow-step-node{background:var(--surface);color:var(--text-muted)}
.workflow-step-label{font-size:var(--font-size-label);font-weight:600;white-space:normal}
.workflow-step--active .workflow-step-label{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.workflow-step-subline{color:var(--text-muted);font-size:.75rem;line-height:1.35;min-height:1.35em;text-align:center}
.workflow-step--active .workflow-step-subline{color:var(--accent)}
.workflow-step--done .workflow-step-subline{color:var(--success)}
.workflow-step-connector{width:100%;height:2px;margin-top:16px}
.workflow-unsaved .workflow-step-node{border-style:dashed}
.workflow-unsaved .workflow-step-connector{background:none;border-top:2px dashed var(--text-muted)}
.ui-session-dialog form{display:grid;gap:var(--space-4)}
.ui-session-dialog .form-group{margin:0}
.ui-session-dialog .form-group[hidden]{display:none}
.ui-session-dialog input{margin:var(--space-2) 0 0}
.ui-session-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:flex-end;padding-top:var(--space-3);border-top:1px solid var(--border)}
.ui-session-actions .btn{white-space:normal;max-width:100%}
.ui-session-actions [hidden]{display:none}
.ui-session-dialog [data-error]:empty{display:none}
@media(max-width:480px){.workflow-stepper-track{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr)}.ui-session-actions{flex-direction:column}.ui-session-actions .btn{width:100%}}

/* MWO templates reuse field actions, menus and the shared selection dialog. */
.mwo-topic-field{display:flex;align-items:center;gap:var(--space-3);min-width:0}
.mwo-topic-field>input{flex:1;min-width:0}
.mwo-topic-trigger{width:44px;height:44px;flex-shrink:0;padding:10px}
.mwo-topic-trigger svg{display:block;width:22px;height:22px}
.mwo-topic-menu .drop-up-menu{top:calc(100% + 6px);bottom:auto;left:auto;right:0;min-width:220px}
.data-table td.mwo-template-actions{text-align:right;white-space:nowrap}
.md-dialog--pick{--dialog-width:var(--dialog-size-form)}
.md-dialog--pick .md-dialog-body{display:grid;gap:var(--space-4)}
.md-pick-item{min-height:44px;overflow-wrap:anywhere}

/* Inline Topic feedback shares the compact information-badge treatment. */
.topic-label-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-2);margin-bottom:6px}
.tech-field .topic-label-row>label{margin-bottom:0}
.topic-label-hint{display:inline-block;padding:2px 6px;border-radius:var(--radius-sm);font-size:.75rem;line-height:1.4;font-weight:400;text-transform:none;color:var(--info);background:var(--info-bg)}
.topic-label-hint--error{color:var(--danger);background:var(--danger-bg)}

/* Align the filter row at its actual box edges. */
.stats-filter-grid>.tech-switch.stats-filter-switch{margin:0}
.stats-filter-grid>.stats-filter-actions{margin:0;padding:0;align-self:end}

/* Reauthentication reuses the original login layout and preserves the document underneath. */
dialog.ui-session-login[open]{position:fixed;inset:0;margin:0;padding:0;width:100vw;max-width:none;height:100dvh;max-height:none;border:0;border-radius:0;background:var(--bg);color:var(--text);display:block;overflow:auto}
.ui-session-login .login-split{min-height:100dvh}
.ui-session-login [data-error]{color:var(--danger);overflow-wrap:anywhere}
.ui-session-login .btn-link{display:block;margin:var(--space-4) auto 0;white-space:normal}

.ui-session-login [hidden]{display:none!important}

/* Personal dashboard widgets use the shared card, dialog and control system. */
.dash-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5);align-items:start}
.personal-dashboard{--dashboard-header-height:calc(var(--control-height) + 2 * var(--space-4) + 1px)}
.dash-widget{padding:0;min-width:0;overflow:hidden;display:flex;flex-direction:column}.dash-full{grid-column:1/-1}
.dash-widget>.dash-heading,.dash-widget>.dash-editor{flex-shrink:0}
.dash-widget>.dash-body{min-height:0}
.dash-widget>.dash-body:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.dash-heading,.dash-body{padding:var(--space-4) var(--space-5)}
.dash-heading{border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:var(--dashboard-header-height);box-sizing:border-box;flex-wrap:wrap}.dash-heading h2{font-size:1rem;margin:0}
.dash-heading .dash-filters,.dash-heading .dash-add{margin:0 0 0 auto;justify-content:flex-end}
.dash-heading .dash-filter{display:flex;align-items:center;gap:var(--space-2);min-width:0;flex:0 1 auto;margin:0}
.dash-heading select{width:auto;max-width:100%;min-height:var(--control-height)}
.dash-heading .dash-filters{max-width:100%}
.dash-list{overflow:auto;scrollbar-gutter:stable;padding-inline-end:var(--space-5);box-sizing:border-box}
.dash-list:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.dash-list.eq-stock-grid{grid-template-columns:minmax(0,1fr);margin:0}
.dash-body .dashboard-chart-legend{margin:var(--space-3) 0 0;justify-content:flex-start}
.dash-actions,.dash-row-end,.dash-paging{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);flex-wrap:wrap}
.dash-editbar,.dash-editor{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.dash-editbar{margin-bottom:var(--space-4)}.dash-editor{padding:var(--space-3);background:var(--accent-muted)}
.dash-editor select{width:auto;min-width:90px}.dash-editor label{display:flex;gap:var(--space-2);align-items:center}
.dash-row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-3) 0;border-bottom:1px solid var(--border)}
.dash-row:last-child{border-bottom:0}.dash-subject{min-width:0;overflow-wrap:anywhere}.dash-subject strong{font-size:.875rem}.dash-subject small{display:block;color:var(--muted);margin-top:var(--space-1)}
.dash-unseen{border-left:3px solid var(--accent);padding-left:var(--space-3)}
.dash-badge{display:inline-block;border-radius:999px;background:var(--surface-muted);padding:2px var(--space-2);font-size:.75rem;white-space:nowrap}
.dash-good{color:var(--success);background:var(--success-bg)}.dash-danger{color:var(--danger);background:var(--danger-bg)}.dash-warning{color:var(--warning);background:var(--warning-bg)}.dash-info{color:var(--info);background:var(--info-bg)}
.dash-filters{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:end;margin-bottom:var(--space-4)}
.dash-filter{display:grid;gap:var(--space-1);flex:1;min-width:130px;font-size:.8125rem}.dash-filter select{width:100%}
.tech-switch.dash-switch{gap:var(--space-2);font-size:.8125rem;min-height:var(--control-height);margin:0}
.dash-catalog-row{margin-bottom:var(--space-2)}.dash-kpis{display:flex;gap:var(--space-5);margin-bottom:var(--space-3);flex-wrap:wrap}.dash-kpis b{font-size:1.5rem}
.dash-event{padding:var(--space-3);background:var(--surface-raised);border-radius:6px;margin-bottom:var(--space-2);overflow-wrap:anywhere}.dash-event p{margin:0 0 var(--space-2)}.dash-event small,.dash-caption{color:var(--muted)}
.dash-error{color:var(--danger)}.dash-paging{padding-top:var(--space-3)}.dash-add{margin-bottom:var(--space-3)}
.dash-body .dashboard-chart-panel{border:0;box-shadow:none;margin:0;padding:0}.dash-body .module-grid{margin:0}
@media(max-width:850px){.dash-grid{grid-template-columns:1fr}.dash-full{grid-column:auto}.dash-row{flex-wrap:wrap}.dash-row-end{margin-left:auto}}

/* Personal shortcut and widget selection, using the shared dialog and switches. */
.md-dialog.dash-options-dialog{width:min(800px,calc(100vw - 32px));max-width:800px}
.dash-catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
.dash-catalog-grid .dash-catalog-row{margin:0;min-width:0}
.dash-shortcut-option{display:flex;align-items:center;gap:var(--space-3);margin-top:var(--space-3)}
.dash-shortcut-option .setting-switch-row{flex:1;min-width:0;margin:0}
.dash-shortcut-grid{display:grid;grid-template-columns:repeat(var(--shortcut-columns,4),minmax(0,1fr));gap:var(--space-4)}
.dash-shortcut-grid .module-card{min-width:0}
.dash-shortcut-grid .module-card-actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.dash-widget{container-type:inline-size}
@container (max-width:900px){.dash-shortcut-grid{grid-template-columns:repeat(min(var(--shortcut-columns,4),3),minmax(0,1fr))}}
@container (max-width:600px){.dash-shortcut-grid{grid-template-columns:repeat(min(var(--shortcut-columns,4),2),minmax(0,1fr))}}
@container (max-width:400px){.dash-shortcut-grid{grid-template-columns:1fr}}
@media(max-width:540px){.dash-catalog-grid{grid-template-columns:1fr}}

/* Completion checklist follows the existing blue form-dialog header. */
.md-dialog--checklist{padding:0;--dialog-width:var(--dialog-size-compact)}
.md-dialog--checklist .md-dialog-header{padding:var(--space-5);background:var(--accent);color:var(--on-accent);margin:0}
.md-dialog--checklist .md-dialog-title{color:inherit}
.md-dialog--checklist .md-dialog-body{padding:var(--space-5);display:grid;gap:var(--space-3);margin:0}
.md-dialog--checklist .md-dialog-body p,.md-dialog--checklist .setting-switch-row{margin:0}
.md-dialog--checklist .md-dialog-footer{padding:var(--space-4) var(--space-5);margin:0;border-top:1px solid var(--border)}

.md-toast-root .ui-session-warning{position:static;inset:auto;width:auto;max-width:none;max-height:none;pointer-events:auto;margin:0;box-sizing:border-box}

[data-check-message]:empty,[data-storage-message]:empty,#backup-status:empty,.mwo-template-msg:empty,.az-error:empty{display:none}

/* Session warning: text and action remain distinct, including inside dialogs. */
.ui-session-warning{display:flex;align-items:center;gap:var(--space-6)}
.ui-session-warning-copy{flex:1;min-width:0}
.ui-session-warning-copy p{margin:var(--space-2) 0 0}
.ui-session-warning-copy [data-error]:empty{display:none}
.ui-session-warning>.btn{flex:0 0 auto;margin-left:auto;align-self:center}
@media(max-width:600px){.ui-session-warning{flex-wrap:wrap;gap:var(--space-4)}.ui-session-warning-copy{flex-basis:100%}.ui-session-warning>.btn{margin-left:auto}}

.md-required-marker{color:var(--danger,#c62828);font-weight:700;white-space:pre}

/* Reserve space above the complete shell, including the sidebar and sticky header. */
:root{--connection-banner-height:0px}
.connection-banner{position:fixed;inset:0 0 auto;z-index:20000;background:#b91c1c;color:#fff;padding:10px 20px;text-align:center;font-size:.9375rem;font-weight:600;line-height:1.4;box-shadow:0 1px 4px #0002}
.connection-banner[hidden]{display:none}
.connection-banner.is-recovered{background:#166534}
.app-shell{padding-top:var(--connection-banner-height)}
.app-main{height:calc(100vh - var(--connection-banner-height));height:calc(100dvh - var(--connection-banner-height))}
.sidebar{top:var(--connection-banner-height);height:calc(100vh - var(--connection-banner-height));height:calc(100dvh - var(--connection-banner-height))}

/* Service overview always keeps four columns; narrow views can scroll within the area. */
.daily-service-area{margin:0;padding:16px;border:1px solid var(--border,#b6c1d1);border-radius:6px;min-width:0;overflow-x:auto}
.daily-service-area legend{padding:0 6px;font-weight:600}
.daily-service-grid{min-width:760px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.daily-service-box{border:1px solid var(--border,#b6c1d1);border-radius:6px;background:#f3f5f8;padding:12px;display:flex;flex-direction:column;gap:10px;min-width:0}
.daily-service-box h3{margin:0;font-size:.9rem;overflow-wrap:anywhere}
.daily-service-box .setting-switch-row{padding:10px;margin:0;min-height:52px}
.daily-service-box small{font-size:.75rem;line-height:1.45;color:#596579;overflow-wrap:anywhere}
.daily-service-box label{min-width:0}.daily-service-box input[type=number]{width:100%;min-width:0}
.daily-service-value{margin:0}.daily-service-box.is-readonly{background:#f8fafc}
.daily-service-confirmation{margin-top:auto;padding-top:4px}
.daily-service-work{margin:0;font-size:.8rem;overflow-wrap:anywhere}
.daily-service-box.is-inactive{background:#f8fafc;color:#758096}
.daily-service-box.is-inactive input{opacity:.65}

.daily-service-heading{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.daily-service-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media(max-width:760px){.daily-service-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.daily-service-heading,.daily-service-options{grid-template-columns:1fr}}

.daily-service-area[hidden],.daily-service-box[hidden]{display:none!important}