:root {
  color-scheme: dark;
  --bg: #070a10;
  --bg-elevated: #0b0f18;
  --surface: #101620;
  --surface-strong: #151c28;
  --surface-soft: rgba(19, 27, 40, 0.72);
  --surface-hover: #182131;
  --border: rgba(151, 174, 214, 0.14);
  --border-strong: rgba(151, 174, 214, 0.24);
  --border-accent: rgba(93, 135, 255, 0.48);
  --text: #f4f7fb;
  --text-soft: #c3ccda;
  --muted: #8793a5;
  --muted-strong: #a7b1c0;
  --accent: #5b8cff;
  --accent-bright: #77a2ff;
  --accent-indigo: #7567ff;
  --accent-surface: rgba(75, 114, 255, 0.12);
  --success: #43d6a1;
  --success-surface: rgba(67, 214, 161, 0.1);
  --danger: #ff6f87;
  --danger-surface: rgba(255, 91, 118, 0.1);
  --warning: #f2b766;
  --warning-surface: rgba(242, 183, 102, 0.1);
  --violet: #b28cff;
  --cyan: #54c9df;
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 18px;
  --shadow-sm: 0 10px 30px rgba(0, 0, 0, 0.16);
  --shadow-lg: 0 24px 70px rgba(0, 0, 0, 0.28);
  --focus-ring: 0 0 0 3px rgba(91, 140, 255, 0.28);
  --max-width: 1360px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}

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

html {
  min-width: 320px;
  min-height: 100%;
  background: var(--bg);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  background:
    radial-gradient(circle at 12% -5%, rgba(66, 104, 255, 0.13), transparent 30rem),
    radial-gradient(circle at 90% 22%, rgba(112, 80, 255, 0.08), transparent 28rem),
    linear-gradient(180deg, #090d14 0, var(--bg) 28rem);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection {
  color: #fff;
  background: rgba(91, 140, 255, 0.55);
}

a {
  color: inherit;
  text-underline-offset: 3px;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
.button {
  touch-action: manipulation;
}

.app-shell {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

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

.skip-link {
  position: fixed;
  z-index: 100;
  top: 10px;
  left: 12px;
  min-height: 40px;
  padding: 9px 14px;
  color: #fff;
  background: var(--accent);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg);
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 160ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.topbar {
  position: sticky;
  z-index: 20;
  top: 0;
  flex: 0 0 auto;
  border-bottom: 1px solid var(--border);
  background: rgba(7, 10, 16, 0.84);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.14);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
}

.topbar-inner {
  width: min(calc(100% - 48px), var(--max-width));
  min-height: 72px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.brand {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 12px;
  color: var(--text);
  border-radius: var(--radius-sm);
  text-decoration: none;
}

.brand-logo {
  width: 40px;
  height: 40px;
  display: block;
  flex: 0 0 auto;
  filter: drop-shadow(0 8px 16px rgba(66, 103, 255, 0.22));
}

.brand-copy {
  display: grid;
  line-height: 1.1;
}

.brand-copy strong {
  font-size: 14px;
  font-weight: 780;
  letter-spacing: 0.025em;
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

.workspace-toolbar {
  border-bottom: 1px solid var(--border);
  background: rgba(11, 15, 24, 0.82);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
}

.workspace-toolbar-inner {
  width: min(calc(100% - 48px), var(--max-width));
  min-height: 64px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.workspace-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

.user-menu {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 2px;
}

.user-menu form {
  margin: 0;
}

.signed-in-user {
  max-width: 120px;
  overflow: hidden;
  color: var(--muted-strong);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.login-shell {
  min-height: min(620px, calc(100vh - 210px));
  display: grid;
  place-items: center;
}

.login-card {
  width: min(100%, 440px);
  padding: clamp(28px, 5vw, 44px);
  background: linear-gradient(145deg, rgba(21, 29, 43, 0.96), rgba(13, 19, 29, 0.96));
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}

.login-card h1 {
  margin: 8px 0 0;
  font-size: clamp(34px, 6vw, 48px);
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.login-form {
  margin-top: 28px;
  display: grid;
  gap: 10px;
}

.login-form label {
  margin-top: 6px;
  color: var(--text-soft);
  font-size: 12px;
  font-weight: 700;
}

.login-form .button {
  margin-top: 12px;
}

.form-alert {
  margin-top: 22px;
  padding: 11px 13px;
  color: #ffd7de;
  background: var(--danger-surface);
  border: 1px solid rgba(255, 111, 135, 0.3);
  border-radius: var(--radius-sm);
  font-size: 13px;
}

.global-search {
  width: clamp(220px, 22vw, 330px);
  display: flex;
  align-items: stretch;
}

.global-search input {
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 8px 0 0 8px;
  font-size: 11px;
}

.global-search button {
  min-height: 38px;
  padding: 0 11px;
  color: var(--text-soft);
  background: var(--surface-hover);
  border: 1px solid var(--border-strong);
  border-left: 0;
  border-radius: 0 8px 8px 0;
  font-size: 10px;
  font-weight: 750;
}

.mobile-search-link {
  display: none;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  background: rgba(14, 20, 30, 0.72);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.nav-link {
  min-height: 34px;
  padding: 7px 11px;
  display: inline-flex;
  align-items: center;
  color: var(--muted-strong);
  border-radius: 7px;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  transition: color 150ms ease, background-color 150ms ease;
}

.nav-link:hover {
  color: var(--text);
  background: var(--surface-hover);
}

.local-indicator,
.footer-storage {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted-strong);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.035em;
  white-space: nowrap;
}

.local-indicator i,
.footer-storage i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  background: var(--success);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(67, 214, 161, 0.1), 0 0 12px rgba(67, 214, 161, 0.32);
}

.main-content {
  width: min(calc(100% - 48px), var(--max-width));
  margin: 0 auto;
  padding: 46px 0 76px;
  flex: 1 0 auto;
}

.eyebrow {
  margin: 0;
  color: var(--accent-bright);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.17em;
  line-height: 1.4;
  text-transform: uppercase;
}

.subtitle {
  max-width: 650px;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: clamp(14px, 1.4vw, 16px);
}

.required {
  color: var(--danger);
}

.button {
  min-height: 42px;
  padding: 10px 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--text);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  box-shadow: none;
  font-size: 13px;
  font-weight: 740;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.button:hover {
  transform: translateY(-1px);
}

.button-primary {
  color: #fff;
  background: linear-gradient(135deg, var(--accent), #5369ed 58%, var(--accent-indigo));
  border-color: rgba(134, 169, 255, 0.3);
  box-shadow: 0 8px 22px rgba(64, 96, 224, 0.23), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.button-primary:hover {
  background: linear-gradient(135deg, #6b98ff, #6176f4 58%, #8276ff);
  box-shadow: 0 10px 28px rgba(64, 96, 224, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.button-secondary {
  color: var(--text);
  background: rgba(28, 38, 55, 0.76);
  border-color: var(--border-strong);
}

.button-secondary:hover {
  background: var(--surface-hover);
  border-color: var(--border-accent);
}

.button-ghost {
  color: var(--text-soft);
  background: rgba(12, 17, 26, 0.6);
  border-color: var(--border);
}

.button-ghost:hover {
  color: var(--text);
  background: var(--surface-strong);
  border-color: var(--border-strong);
}

.button-compact {
  min-height: 40px;
  padding: 9px 14px;
  font-size: 12px;
}

.button-icon {
  position: relative;
  display: inline-grid;
  width: 18px;
  height: 18px;
  place-items: center;
  font-size: 0;
  font-weight: 400;
  line-height: 1;
}

.button-icon::before,
.button-icon::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  content: "";
  background: currentColor;
  border-radius: 2px;
  transform: translate(-50%, -50%);
}

.button-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--accent-bright);
  outline-offset: 3px;
  box-shadow: var(--focus-ring);
}

.brand:focus-visible,
.breadcrumb a:focus-visible,
.order-number:focus-visible,
.row-action a:focus-visible {
  border-radius: 5px;
}

.dashboard-hero,
.page-heading,
.detail-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 36px;
}

.order-vehicle-image {
  position: relative;
  width: 122px;
  height: 92px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  background: var(--surface-strong);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.order-vehicle-image,
.vehicle-hero-image {
  color: var(--text);
  text-decoration: none;
}

.order-vehicle-image:hover,
.order-vehicle-image:focus-visible,
.vehicle-hero-image:hover,
.vehicle-hero-image:focus-visible {
  border-color: var(--accent-bright);
}

.order-vehicle-image img,
.vehicle-image-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.order-vehicle-image-placeholder,
.vehicle-image-placeholder {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(145deg, rgba(102, 137, 188, .18), rgba(20, 26, 36, .45));
}

.order-vehicle-image-placeholder::before,
.vehicle-image-placeholder::before {
  content: '';
  position: absolute;
  top: 36%;
  left: 17%;
  width: 66%;
  height: 31%;
  border: 2px solid rgba(195, 215, 244, .54);
  border-radius: 7px 9px 5px 5px;
}

.order-vehicle-image-placeholder::after,
.vehicle-image-placeholder::after {
  content: '';
  position: absolute;
  top: 24%;
  left: 31%;
  width: 38%;
  height: 21%;
  border: 2px solid rgba(195, 215, 244, .54);
  border-bottom: 0;
  border-radius: 6px 8px 0 0;
}

.order-vehicle-image-placeholder i,
.vehicle-image-placeholder i {
  position: absolute;
  z-index: 1;
  top: 61%;
  width: 10%;
  aspect-ratio: 1;
  border: 2px solid rgba(195, 215, 244, .7);
  border-radius: 50%;
  background: var(--surface-strong);
}

.order-vehicle-image-placeholder i:first-child,
.vehicle-image-placeholder i:first-child { left: 26%; }
.order-vehicle-image-placeholder i:last-child,
.vehicle-image-placeholder i:last-child { right: 26%; }

.order-vehicle-image-action,
.vehicle-image-action {
  position: absolute;
  right: 6px;
  bottom: 6px;
  padding: 3px 5px;
  border: 1px solid rgba(205, 225, 255, .26);
  border-radius: 4px;
  color: #eef5ff;
  background: rgba(7, 10, 16, .76);
  font-size: 9px;
  font-weight: 740;
  line-height: 1;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.vehicle-hero-image {
  position: relative;
  width: 146px;
  height: 110px;
  flex: 0 0 auto;
  padding: 0;
  overflow: hidden;
  cursor: zoom-in;
  border: 1px solid var(--border-strong);
  border-radius: 11px;
  background: var(--surface-strong);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.vehicle-hero-image img,
.vehicle-image-dialog-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.vehicle-hero-image .vehicle-image-action { cursor: pointer; }

.vehicle-image-dialog {
  width: min(720px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 32px));
  padding: 0;
  overflow: auto;
  color: var(--text);
  background: var(--surface-raised);
  border: 1px solid var(--border-strong);
  border-radius: 13px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .58);
}
.vehicle-image-dialog::backdrop { background: rgba(2, 4, 8, .74); backdrop-filter: blur(3px); }
.vehicle-image-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 19px 20px 15px; border-bottom: 1px solid var(--border); }
.vehicle-image-dialog-header h2 { margin: 4px 0 0; font-size: 21px; }
.vehicle-image-dialog-body { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr); gap: 18px; padding: 20px; }
.vehicle-image-dialog-preview { min-height: 270px; overflow: hidden; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--surface-strong); }
.vehicle-image-dialog-controls { min-width: 0; }
.vehicle-image-dialog-controls > p { margin: 0 0 13px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.vehicle-image-dialog-controls form { display: grid; gap: 9px; margin: 0 0 10px; }
.vehicle-image-dialog-controls label { display: grid; gap: 5px; color: var(--muted-strong); font-size: 11px; font-weight: 680; }
.vehicle-image-dialog-controls input[type="file"] { max-width: 100%; color: var(--muted); font-size: 11px; }
.vehicle-image-dialog-controls input[type="file"]::file-selector-button { margin-right: 8px; padding: 6px 8px; border: 1px solid var(--border-strong); border-radius: 5px; color: var(--text); background: var(--surface-strong); font: inherit; }

.dashboard-hero {
  min-height: 172px;
  padding: 8px 0 34px;
  border-bottom: 1px solid var(--border);
}

.dashboard-intro,
.detail-title-group,
.form-heading > div {
  min-width: 0;
}

.order-vehicle-image + .detail-title-group { margin-right: auto; }

.vehicle-thumbnail-cell { width: 1%; white-space: nowrap; }
.vehicle-list-thumbnail { display: block; width: 52px; height: 39px; overflow: hidden; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface-strong); }
.vehicle-list-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; }
.vehicle-list-thumbnail-placeholder { background: linear-gradient(145deg, rgba(102, 137, 188, .18), rgba(20, 26, 36, .45)); }

.dashboard-intro h1,
.page-heading h1,
.detail-hero h1 {
  margin: 7px 0 0;
  font-size: clamp(34px, 4.5vw, 60px);
  font-weight: 750;
  letter-spacing: -0.05em;
  line-height: 1.02;
}

.dashboard-toolbar {
  display: flex;
  flex: 0 0 auto;
  padding-bottom: 2px;
}

.stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0 22px;
}

.stat {
  position: relative;
  min-width: 0;
  min-height: 104px;
  padding: 17px 19px;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(21, 29, 43, 0.94), rgba(13, 19, 29, 0.94));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.stat::after {
  position: absolute;
  right: -20px;
  bottom: -42px;
  width: 100px;
  height: 100px;
  content: "";
  background: var(--accent);
  border-radius: 50%;
  filter: blur(48px);
  opacity: 0.08;
  pointer-events: none;
}

.stat-label {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.13em;
  line-height: 1.3;
  text-transform: uppercase;
}

.stat strong {
  display: block;
  margin-top: 5px;
  font-size: 27px;
  font-weight: 740;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.stat small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
}

.stat-active {
  border-color: rgba(91, 140, 255, 0.22);
}

.stat-active strong {
  color: var(--accent-bright);
}

.stat-ready {
  border-color: rgba(67, 214, 161, 0.2);
}

.stat-ready::after {
  background: var(--success);
}

.stat-ready strong {
  color: var(--success);
}

.panel,
.form-section {
  background: linear-gradient(145deg, rgba(18, 25, 37, 0.96), rgba(13, 19, 29, 0.96));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.orders-panel {
  overflow: hidden;
}

.panel-heading {
  min-height: 74px;
  padding: 17px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--border);
}

.panel-heading h2 {
  margin: 4px 0 0;
  font-size: 17px;
  font-weight: 720;
  letter-spacing: -0.025em;
  line-height: 1.25;
}

.record-count {
  padding: 5px 9px;
  color: var(--muted-strong);
  background: rgba(129, 153, 194, 0.07);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.table-scroll {
  max-width: 100%;
  overflow-x: auto;
  scrollbar-color: var(--border-strong) transparent;
  scrollbar-width: thin;
}

.orders-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.orders-table th {
  padding: 10px 15px;
  color: var(--muted);
  background: rgba(5, 8, 13, 0.34);
  border-bottom: 1px solid var(--border);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.orders-table td {
  padding: 14px 15px;
  color: var(--text-soft);
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

.orders-table tbody tr {
  transition: background-color 150ms ease;
}

.orders-table tbody tr:last-child td {
  border-bottom: 0;
}

.orders-table tbody tr:hover {
  background: rgba(38, 52, 75, 0.38);
}

.orders-table td strong {
  color: var(--text);
  font-weight: 680;
}

.orders-table small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
  white-space: nowrap;
}

.order-number {
  color: var(--accent-bright);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.order-number:hover {
  color: #a8c3ff;
  text-decoration: underline;
}

.customer-link {
  color: inherit;
  text-decoration-color: rgba(119, 162, 255, 0.42);
  text-decoration-thickness: 1px;
}

.customer-link:hover {
  color: var(--accent-bright);
}

.row-action {
  width: 56px;
  text-align: right;
}

.row-action a {
  width: 40px;
  height: 40px;
  display: inline-grid;
  place-items: center;
  color: var(--muted-strong);
  background: rgba(14, 20, 30, 0.76);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 17px;
  text-decoration: none;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.row-action a:hover {
  color: #fff;
  background: var(--accent-surface);
  border-color: var(--border-accent);
  transform: translateX(2px);
}

.status {
  display: inline-flex;
  width: max-content;
  align-items: center;
  gap: 7px;
  padding: 6px 9px;
  color: var(--muted-strong);
  background: rgba(135, 147, 165, 0.08);
  border: 1px solid rgba(135, 147, 165, 0.2);
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.07em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.status::before {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  content: "";
  background: currentColor;
  border-radius: 50%;
  box-shadow: 0 0 8px currentColor;
}

.status-new {
  color: #aeb9c8;
  background: rgba(174, 185, 200, 0.08);
  border-color: rgba(174, 185, 200, 0.2);
}

.status-planned {
  color: #78a8ff;
  background: rgba(91, 140, 255, 0.09);
  border-color: rgba(91, 140, 255, 0.24);
}

.status-working {
  color: var(--warning);
  background: var(--warning-surface);
  border-color: rgba(242, 183, 102, 0.26);
}

.status-waiting {
  color: var(--violet);
  background: rgba(178, 140, 255, 0.09);
  border-color: rgba(178, 140, 255, 0.24);
}

.status-ready {
  color: var(--success);
  background: var(--success-surface);
  border-color: rgba(67, 214, 161, 0.24);
}

.status-picked-up {
  color: var(--cyan);
  background: rgba(84, 201, 223, 0.09);
  border-color: rgba(84, 201, 223, 0.24);
}

.status-cancelled {
  color: var(--danger);
  background: var(--danger-surface);
  border-color: rgba(255, 111, 135, 0.24);
}

.status-large {
  min-height: 40px;
  padding: 9px 13px;
  font-size: 10px;
}

.plate {
  display: inline-flex;
  max-width: 100%;
  padding: 3px 7px;
  color: #131923;
  background: linear-gradient(180deg, #f4f7fa, #d8dee5);
  border: 2px solid #b9c2cc;
  border-radius: 5px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8), 0 2px 7px rgba(0, 0, 0, 0.23);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.055em;
  line-height: 1.25;
  white-space: nowrap;
}

.plate-large {
  padding: 5px 10px;
  font-size: 14px;
}

.empty-state {
  position: relative;
  min-height: 390px;
  padding: 48px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  overflow: hidden;
  text-align: center;
  background:
    radial-gradient(circle at 50% 25%, rgba(91, 140, 255, 0.12), transparent 16rem),
    linear-gradient(145deg, rgba(17, 24, 36, 0.84), rgba(10, 15, 23, 0.84));
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.empty-state h2 {
  margin: 9px 0 8px;
  font-size: clamp(25px, 3vw, 34px);
  font-weight: 730;
  letter-spacing: -0.035em;
}

.empty-state p:not(.eyebrow) {
  max-width: 550px;
  margin: 0 0 25px;
  color: var(--muted);
  font-size: 14px;
}

.empty-symbol {
  width: 68px;
  height: 68px;
  margin-bottom: 23px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
  padding-bottom: 17px;
  background: var(--accent-surface);
  border: 1px solid rgba(91, 140, 255, 0.28);
  border-radius: 18px;
  box-shadow: 0 12px 35px rgba(50, 80, 200, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.empty-symbol span {
  width: 4px;
  background: linear-gradient(180deg, var(--accent-bright), var(--accent-indigo));
  border-radius: 5px;
}

.empty-symbol span:nth-child(1) { height: 13px; opacity: 0.72; }
.empty-symbol span:nth-child(2) { height: 28px; }
.empty-symbol span:nth-child(3) { height: 20px; opacity: 0.86; }

.breadcrumb {
  margin: -7px 0 25px;
}

.breadcrumb a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  border-radius: 5px;
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
  transition: color 150ms ease;
}

.breadcrumb a:hover {
  color: var(--text);
}

.breadcrumb a span {
  color: var(--accent-bright);
  font-size: 16px;
}

.page-heading {
  margin-bottom: 30px;
}

.form-heading {
  align-items: center;
}

.form-heading h1 {
  font-size: clamp(32px, 4vw, 51px);
}

.order-reference {
  min-width: 162px;
  padding: 11px 14px;
  display: grid;
  flex: 0 0 auto;
  background: var(--accent-surface);
  border: 1px solid var(--border-accent);
  border-radius: var(--radius-sm);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.order-reference small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.order-reference strong {
  margin-top: 3px;
  color: var(--accent-bright);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.alert {
  min-height: 54px;
  margin: 0 0 22px;
  padding: 11px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  font-size: 12px;
}

.alert > div {
  display: grid;
  gap: 2px;
}

.alert > div > span {
  color: var(--muted-strong);
}

.alert-icon {
  width: 30px;
  height: 30px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 850;
}

.alert-error {
  color: #ff9bae;
  background: linear-gradient(90deg, var(--danger-surface), var(--surface-soft) 45%);
  border-color: rgba(255, 111, 135, 0.28);
}

.alert-error strong {
  color: #ffb0be;
}

.alert-success {
  color: var(--success);
  background: linear-gradient(90deg, var(--success-surface), var(--surface-soft) 45%);
  border-color: rgba(67, 214, 161, 0.27);
}

.order-form {
  display: grid;
  gap: 16px;
}

.form-section {
  padding: 25px;
  display: grid;
  grid-template-columns: minmax(190px, 0.68fr) minmax(0, 2.25fr);
  gap: 34px;
}

.section-heading {
  display: flex;
  align-items: flex-start;
  gap: 13px;
}

.section-number {
  min-width: 30px;
  padding: 3px 5px;
  flex: 0 0 auto;
  color: var(--accent-bright);
  background: var(--accent-surface);
  border: 1px solid rgba(91, 140, 255, 0.2);
  border-radius: 5px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.4;
  text-align: center;
}

.section-heading h2 {
  margin: -3px 0 4px;
  font-size: 16px;
  font-weight: 710;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.section-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 19px 15px;
}

.field {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.field > span:first-child {
  color: var(--text-soft);
  font-size: 10px;
  font-weight: 720;
  letter-spacing: 0.03em;
}

.field-full { grid-column: span 6; }
.field-half { grid-column: span 3; }
.field-third { grid-column: span 2; }

.field-code {
  margin-left: 5px;
  color: var(--accent-bright);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
}

.owner-lock,
.intake-hint {
  margin: 0;
  padding: 14px 16px;
  color: var(--text-soft);
  background: var(--accent-surface);
  border: 1px solid rgba(91, 140, 255, 0.2);
  border-radius: var(--radius-sm);
}

.intake-hint { margin-bottom: 18px; }

.data-list-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 24px;
}

.search-page-form {
  max-width: 780px;
  margin: 0 0 28px;
}

.search-page-form > label {
  display: block;
  margin-bottom: 8px;
  color: var(--text-soft);
  font-size: 11px;
  font-weight: 720;
}

.search-page-form > div { display: flex; gap: 10px; }
.search-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.search-group { overflow: hidden; }
.result-list { margin: 0; padding: 0; list-style: none; }
.result-list li + li { border-top: 1px solid var(--border); }
.result-list a { min-height: 70px; padding: 14px 20px; display: flex; flex-direction: column; justify-content: center; gap: 6px; color: var(--text); text-decoration: none; }
.result-list a:hover { background: var(--surface-hover); }
.result-list span { color: var(--muted-strong); font-size: 11px; }
.search-empty { padding: 12px 20px 22px; color: var(--muted); }
.compact-empty { min-height: 250px; }

.create-search-section > :not(.section-heading),
.fallback-section > :not(.section-heading) {
  grid-column: 2;
}

.order-search-form {
  display: grid;
  gap: 12px;
}

.order-search-label {
  color: var(--text-soft);
  font-size: 10px;
  font-weight: 720;
  letter-spacing: 0.03em;
}

.search-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}

.search-inline-message {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.search-inline-message-empty {
  padding: 11px 13px;
  color: #ffb0be;
  background: var(--danger-surface);
  border: 1px solid rgba(255, 111, 135, 0.28);
  border-radius: var(--radius-sm);
  font-weight: 700;
}

.order-search-results {
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  list-style: none;
}

.order-search-results li + li { border-top: 1px solid var(--border); }

.order-search-results a {
  min-height: 62px;
  padding: 11px 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  color: var(--text-soft);
  text-decoration: none;
}

.order-search-results a:hover { background: var(--surface-hover); }
.order-search-results strong,
.order-search-results small { display: block; }
.order-search-results small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.order-search-results a > span:last-child { color: var(--accent-bright); font-size: 10px; font-weight: 700; }

.selected-vehicle-card {
  padding: 14px 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  background: var(--success-surface);
  border: 1px solid rgba(67, 214, 161, 0.27);
  border-radius: var(--radius-sm);
}

.selected-vehicle-card strong,
.selected-vehicle-card small { display: block; }
.selected-vehicle-card small,
.selected-label { margin-bottom: 3px; color: var(--muted); font-size: 9px; }
.selected-label { color: var(--success); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }

.fallback-resolved {
  padding: 13px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text-soft);
  background: var(--success-surface);
  border: 1px solid rgba(67, 214, 161, 0.2);
  border-radius: var(--radius-sm);
  font-size: 11px;
}

.fallback-resolved a {
  margin-left: auto;
  color: var(--accent-bright);
  font-weight: 680;
}

.fallback-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
}

.fallback-links a { color: var(--accent-bright); font-size: 11px; font-weight: 680; }

.button:disabled {
  opacity: .48;
  cursor: not-allowed;
  transform: none;
}

.create-submit-state {
  display: flex;
  align-items: center;
  gap: 12px;
}

.create-submit-state p {
  max-width: 270px;
  margin: 0;
  color: #ffb0be;
  font-size: 10px;
  line-height: 1.4;
  text-align: right;
}

input,
select,
textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  color: var(--text);
  background: rgba(5, 9, 15, 0.7);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  outline: none;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.18);
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

textarea {
  min-height: 108px;
  line-height: 1.55;
  resize: vertical;
}

input:hover,
select:hover,
textarea:hover {
  background: rgba(7, 12, 20, 0.88);
  border-color: rgba(151, 174, 214, 0.36);
}

input:focus,
select:focus,
textarea:focus {
  background: rgba(7, 12, 20, 0.96);
  border-color: var(--accent);
  box-shadow: var(--focus-ring), inset 0 1px 2px rgba(0, 0, 0, 0.18);
}

input[aria-invalid="true"],
select[aria-invalid="true"],
textarea[aria-invalid="true"] {
  border-color: var(--danger);
  background: rgba(255, 91, 118, 0.045);
}

input[aria-invalid="true"]:focus,
select[aria-invalid="true"]:focus,
textarea[aria-invalid="true"]:focus {
  box-shadow: 0 0 0 3px rgba(255, 111, 135, 0.18);
}

input::placeholder,
textarea::placeholder {
  color: #606c7d;
  opacity: 1;
}

select {
  cursor: pointer;
}

.readonly-status,
.readonly-status:hover,
.readonly-status:focus {
  color: var(--success);
  background: var(--success-surface);
  border-color: rgba(78, 210, 151, 0.24);
  box-shadow: none;
  cursor: default;
  font-weight: 760;
}

.uppercase {
  text-transform: uppercase;
}

.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: 0.025em;
}

.field-error {
  color: #ff9aae;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.4;
}

.field-hint {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
}

.input-suffix {
  display: flex;
}

.input-suffix input {
  min-width: 0;
  border-radius: var(--radius-sm) 0 0 var(--radius-sm);
}

.input-suffix span {
  min-width: 46px;
  display: grid;
  place-items: center;
  color: var(--muted-strong);
  background: var(--surface-strong);
  border: 1px solid var(--border-strong);
  border-left: 0;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: 10px;
  font-weight: 700;
}

.form-actions {
  padding: 6px 0 0;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.compact-form-section {
  margin: 18px 0 22px;
}

.compact-form-section .form-actions {
  grid-column: span 6;
  justify-content: flex-start;
}

.catalog-page {
  width: min(100%, 1040px);
  margin: 0 auto;
}

.catalog-page-hero { min-height: 154px; }

.catalog-create-panel {
  margin: 18px 0 22px;
  overflow: hidden;
}

.catalog-section-header {
  min-height: 82px;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--border);
}

.catalog-scope-chip,
.catalog-type,
.catalog-number {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 999px;
  white-space: nowrap;
}

.catalog-scope-chip {
  padding: 5px 9px;
  color: var(--muted-strong);
  background: rgba(129, 153, 194, 0.07);
  font-size: 9px;
  font-weight: 760;
}

.catalog-create-form {
  padding: 22px 24px 24px;
  align-items: start;
}

.catalog-kind-field { grid-column: span 2; }
.catalog-name-field { grid-column: span 4; }

.catalog-number-note {
  min-height: 48px;
  padding: 9px 12px;
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted-strong);
  background: rgba(91, 140, 255, 0.07);
  border: 1px solid rgba(91, 140, 255, 0.18);
  border-radius: 8px;
  font-size: 10px;
  line-height: 1.45;
}

.catalog-number-note strong { color: var(--text-soft); }

.catalog-note-icon {
  width: 26px;
  height: 26px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  color: var(--accent-bright);
  background: var(--accent-surface);
  border-radius: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 800;
}

.catalog-detail-fields {
  padding: 14px;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
  background: rgba(5, 9, 15, 0.28);
  border: 1px solid var(--border);
  border-radius: 9px;
}

.catalog-detail-fields .field > span small {
  margin-left: 4px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 680;
}

.catalog-create-form .catalog-create-actions {
  padding-top: 0;
  grid-column: 1 / -1;
  justify-content: flex-start;
}

.catalog-list-panel { margin-bottom: 22px; }

.catalog-list-toolbar {
  padding: 14px 20px;
  background: rgba(5, 9, 15, 0.25);
  border-bottom: 1px solid var(--border);
}

.catalog-list-toolbar .catalog-search {
  width: min(100%, 560px);
  display: block;
}

.catalog-search > label {
  display: block;
  margin-bottom: 6px;
  color: var(--text-soft);
  font-size: 10px;
  font-weight: 720;
}

.catalog-search > div { display: flex; }
.catalog-search input { min-width: 0; }

.catalog-entry-identity strong,
.catalog-entry-identity .catalog-number { display: block; }

.catalog-entry-identity .catalog-number {
  width: max-content;
  max-width: 100%;
  margin-top: 6px;
  padding: 3px 7px;
  color: var(--muted-strong);
  background: rgba(5, 9, 15, 0.46);
  border-radius: 5px;
  font-size: 9px;
  overflow-wrap: anywhere;
  white-space: normal;
}

.catalog-type {
  padding: 4px 8px;
  color: var(--accent-bright);
  background: var(--accent-surface);
  border-color: rgba(91, 140, 255, 0.2);
  font-size: 9px;
  font-weight: 760;
}

.catalog-type-service {
  color: var(--violet);
  background: rgba(178, 140, 255, 0.1);
  border-color: rgba(178, 140, 255, 0.22);
}

.catalog-value { color: var(--text-soft); font-weight: 700; }
.catalog-table th:last-child,
.catalog-table td:last-child { width: 1%; text-align: right; }
.catalog-row-action .button { min-width: 94px; }
.catalog-empty {
  padding: 22px 20px;
  display: grid;
  gap: 3px;
}

.catalog-empty strong { font-size: 12px; }
.catalog-empty span { color: var(--muted); font-size: 10px; }

.catalog-edit-hero,
.catalog-edit-panel {
  width: min(100%, 860px);
  margin-right: auto;
  margin-left: auto;
}

.catalog-edit-panel {
  margin-top: 18px;
  margin-bottom: 22px;
  overflow: hidden;
}

.catalog-edit-summary {
  padding: 24px 26px 21px;
  border-bottom: 1px solid var(--border);
}

.catalog-edit-summary .section-heading {
  padding: 0;
  border-bottom: 0;
}

.catalog-edit-summary .section-heading > div {
  min-width: 0;
}

.catalog-edit-summary h2 {
  overflow-wrap: anywhere;
}

.catalog-edit-meta {
  margin: 14px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.catalog-edit-meta > div {
  min-width: 0;
  padding: 6px 9px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  background: rgba(5, 9, 15, 0.4);
  border: 1px solid var(--border);
  border-radius: 6px;
}

.catalog-edit-meta dt {
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.catalog-edit-meta dd {
  margin: 0;
  color: var(--text-soft);
  font-size: 10px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.catalog-edit-form {
  padding: 22px 26px 26px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
}

.catalog-edit-name-field {
  width: 100%;
}

.catalog-edit-secondary-field {
  width: min(100%, 320px);
}

.catalog-edit-form .catalog-edit-actions {
  margin: 2px 0 0;
  padding: 18px 0 0;
  justify-content: flex-start;
  background: transparent;
  border-top: 1px solid var(--border);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.muted-copy {
  margin: 0;
  padding: 0 21px 21px;
  color: var(--muted);
}

.detail-hero {
  margin-bottom: 14px;
  padding: 5px 0 22px;
  align-items: center;
  border-bottom: 1px solid var(--border);
}

.detail-hero h1.detail-identity {
  margin: 8px 0 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: normal;
}

.detail-hero .customer-detail-title {
  font-family: inherit;
  overflow-wrap: anywhere;
}

.detail-identity {
  min-width: 0;
}

.vehicle-name {
  min-width: 0;
  color: var(--text);
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight: 740;
  letter-spacing: -0.035em;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.detail-hero .plate-large {
  padding: 7px 12px;
  font-size: clamp(18px, 2.2vw, 27px);
}

.detail-order-reference {
  margin: 9px 0 0;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--muted);
  font-size: 10px;
}

.detail-order-reference span {
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.detail-order-reference strong {
  color: var(--muted-strong);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  letter-spacing: 0.02em;
}

.detail-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 11px;
}

.generation-form {
  display: grid;
  justify-items: stretch;
  min-width: 190px;
  margin: 0;
}

.generation-button[disabled] {
  cursor: wait;
  opacity: 0.78;
}

.generation-progress-status {
  display: grid;
  gap: 5px;
  max-width: 240px;
  margin-top: 7px;
  color: var(--muted-strong);
  font-size: 9px;
  line-height: 1.4;
}

.generation-progress-status[hidden] { display: none; }

.generation-progress-track {
  display: block;
  height: 3px;
  overflow: hidden;
  background: rgba(151, 174, 214, 0.15);
  border-radius: 999px;
}

.generation-progress-track span {
  display: block;
  width: 45%;
  height: 100%;
  background: var(--accent);
  border-radius: inherit;
  animation: generation-progress 1.2s ease-in-out infinite;
}

@keyframes generation-progress {
  from { transform: translateX(-110%); }
  to { transform: translateX(245%); }
}

.service-analysis-section,
.generated-instructions-card {
  margin: 0 0 18px;
  padding: 0 14px;
}

.service-analysis-section h3,
.generated-instructions-card h3 {
  margin-top: 0;
}

.service-analysis-section ul {
  margin-bottom: 0;
}

.generated-instructions-heading,
.generated-instructions-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.generated-instructions-heading { margin-bottom: 7px; }

.generated-instructions {
  display: block;
  width: 100%;
  margin: 0;
  resize: vertical;
  white-space: pre-wrap;
}

.generated-instructions-readonly {
  min-height: 88px;
  padding: 12px 13px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  color: var(--text-soft);
  background: rgba(12, 17, 26, 0.42);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 12px;
  line-height: 1.6;
}

.generated-instructions-actions { margin-top: 10px; justify-content: flex-end; }

.integrity-notice,
.form-audit-note {
  margin: -7px 0 18px;
  padding: 12px 15px;
  color: var(--muted-strong);
  background: rgba(31, 119, 180, 0.08);
  border: 1px solid rgba(85, 166, 224, 0.18);
  border-radius: var(--radius-sm);
  font-size: 10px;
  line-height: 1.55;
}

.integrity-notice,
.form-audit-note {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.integrity-notice {
  color: var(--warning);
  background: var(--warning-surface);
  border-color: rgba(245, 181, 68, 0.2);
}

.integrity-notice-editable {
  color: var(--success);
  background: var(--success-surface);
  border-color: rgba(78, 210, 151, 0.2);
}

.integrity-notice span,
.form-audit-note span { color: var(--text-soft); }

.form-audit-note {
  margin: -9px 0 17px;
}

.detail-grid,
.detail-secondary {
  display: grid;
  gap: 16px;
}

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

@media (max-width: 480px) {
  .service-analysis-section,
  .generated-instructions-card { padding-right: 8px; padding-left: 8px; }
  .generated-instructions-heading,
  .generated-instructions-actions { flex-wrap: wrap; }
  .generated-instructions-actions { justify-content: stretch; }
  .generated-instructions-actions .button { flex: 1 1 120px; }
}

.work-order-cockpit {
  display: grid;
  grid-template-columns: minmax(0, 2.15fr) minmax(290px, 0.85fr);
  align-items: start;
  gap: 16px;
}

.cockpit-workspace,
.cockpit-context,
.context-card,
.detail-secondary {
  min-width: 0;
}

.cockpit-context {
  display: grid;
  gap: 12px;
}

.detail-secondary {
  margin-top: 16px;
  grid-template-columns: minmax(0, 1fr);
}

.detail-card {
  min-width: 0;
  overflow: hidden;
}

.detail-card-wide {
  grid-column: span 2;
}

.detail-card .panel-heading {
  min-height: 70px;
}

.cockpit-workspace > .panel-heading {
  min-height: 64px;
}

.cockpit-workspace {
  padding: 14px;
  display: grid;
  gap: 16px;
  background: linear-gradient(145deg, rgba(14, 21, 33, 0.94), rgba(8, 13, 21, 0.94));
}

.work-area {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 10px;
}

.task-work-area {
  background: rgba(13, 22, 34, 0.7);
  border-color: rgba(91, 140, 255, 0.25);
}

.position-work-area {
  background: rgba(8, 13, 21, 0.82);
  border-color: rgba(178, 140, 255, 0.28);
}

.task-work-area > .panel-heading {
  min-height: 64px;
  background: linear-gradient(90deg, rgba(24, 41, 66, 0.72), rgba(13, 22, 34, 0.3));
}

.context-card .panel-heading {
  min-height: 56px;
  padding: 11px 15px;
}

.context-card .panel-heading h2 {
  margin-top: 2px;
  font-size: 15px;
  overflow-wrap: anywhere;
}

.context-emphasis {
  margin: 0;
  padding: 15px;
  color: var(--warning);
  font-size: 18px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.context-card .muted-copy {
  padding: 14px 15px 16px;
  font-size: 11px;
}

.context-card .data-list > div {
  min-height: 46px;
  padding: 9px 15px;
  grid-template-columns: minmax(108px, 0.8fr) minmax(0, 1.2fr);
  gap: 12px;
}

.context-card .data-list dt { font-size: 10px; }
.context-card .data-list dd { font-size: 11px; line-height: 1.4; }

.detail-card > .prose {
  min-height: 100px;
  padding: 21px;
  color: var(--text-soft);
}

.task-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.task-item {
  min-width: 0;
  padding: 11px 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--border);
}

.task-item-in_progress { box-shadow: inset 3px 0 0 rgba(242, 183, 102, 0.72); }
.task-item-done { box-shadow: inset 3px 0 0 rgba(67, 214, 161, 0.48); }
.task-item-error { box-shadow: inset 3px 0 0 rgba(255, 111, 135, 0.62); }

.task-copy {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.task-copy p {
  min-width: 0;
  margin: 0;
  color: var(--text-soft);
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.task-position {
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 10px;
  font-weight: 800;
}

.task-status {
  padding: 5px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.task-status-in_progress { color: var(--warning); background: var(--warning-surface); }
.task-status-done { color: var(--success); background: var(--success-surface); }
.task-status-error { color: var(--danger); background: var(--danger-surface); }

.task-status-actions fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(98px, auto) minmax(72px, auto);
  border: 0;
  gap: 6px;
}

.task-status-button {
  min-height: 44px;
  padding: 8px 11px;
  color: var(--muted-strong);
  background: rgba(12, 17, 26, 0.65);
  border: 1px solid var(--border);
  border-radius: 7px;
  font-size: 10px;
  font-weight: 730;
  cursor: pointer;
}

.task-status-button:hover,
.task-status-button:focus-visible {
  color: var(--text);
  border-color: var(--border-accent);
}

.task-action-primary {
  color: #071019;
  border-color: transparent;
  font-weight: 820;
}

.task-action-primary.task-status-button-in_progress {
  background: var(--warning);
  border-color: rgba(255, 215, 145, 0.3);
}

.task-action-primary.task-status-button-done {
  background: var(--success);
  border-color: rgba(118, 245, 196, 0.3);
}

.task-action-primary:hover { color: #071019; filter: brightness(1.06); }
.task-action-alternative.task-status-button-error { color: var(--danger); border-color: rgba(255, 111, 135, 0.28); }
.task-action-alternative.task-status-button-done { color: var(--success); border-color: rgba(67, 214, 161, 0.25); }

.task-legacy-note {
  color: var(--muted);
  font-size: 9px;
}

.list-pagination {
  padding: 10px 14px 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.order-positions {
  margin: 0;
  overflow: hidden;
}

.order-position-heading {
  min-height: 62px;
  padding: 13px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--border);
}

.order-position-heading h3 {
  margin: 2px 0 0;
  font-size: 15px;
}

.order-position-count { flex: 0 0 auto; }

.order-position-empty {
  padding: 18px 16px;
  display: grid;
  gap: 3px;
}

.order-position-empty strong { font-size: 12px; }
.order-position-empty span { color: var(--muted); font-size: 10px; }

.order-position-list {
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  list-style: none;
}

.order-position-card {
  min-width: 0;
  padding: 13px 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(116px, auto);
  align-items: start;
  gap: 11px 18px;
  background: rgba(11, 17, 26, 0.34);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.order-position-card + .order-position-card { border-top: 1px solid var(--border); }

.order-position-identity {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}

.order-position-marker {
  width: 30px;
  height: 30px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  color: var(--accent-bright);
  background: var(--accent-surface);
  border: 1px solid rgba(91, 140, 255, 0.24);
  border-radius: 8px;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: 0.04em;
}

.order-position-marker-service {
  color: var(--violet);
  background: rgba(178, 140, 255, 0.1);
  border-color: rgba(178, 140, 255, 0.22);
}

.order-position-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.order-position-copy strong,
.order-position-copy .order-position-catalog-link,
.order-position-copy span {
  overflow-wrap: anywhere;
}

.order-position-copy strong {
  color: var(--text);
  font-size: 12px;
  line-height: 1.35;
}

.order-position-catalog-link {
  display: block;
  width: fit-content;
  max-width: 100%;
  color: var(--accent-bright);
  font-size: 12px;
  font-weight: 760;
  line-height: 1.35;
  text-decoration-color: rgba(120, 164, 255, 0.62);
}

.order-position-catalog-link:hover,
.order-position-catalog-link:focus-visible {
  color: #d5e2ff;
  text-decoration-thickness: 2px;
}

.order-position-copy span {
  color: var(--muted);
  font-size: 9px;
}

.order-position-review {
  margin: 5px 0 0;
  color: var(--warning);
  font-size: 10px;
  line-height: 1.45;
}
.order-position-value {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.order-position-value > div {
  min-width: 76px;
  padding: 7px 9px;
  display: grid;
  gap: 1px;
  background: rgba(5, 9, 15, 0.58);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.order-position-value dt {
  color: var(--muted);
  font-size: 7px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.order-position-value dd {
  margin: 0;
  color: var(--text-soft);
  font-size: 11px;
  font-weight: 740;
  white-space: nowrap;
}

.order-position-controls {
  min-width: 0;
  padding-top: 11px;
  display: flex;
  align-items: end;
  grid-column: 1 / -1;
  justify-content: space-between;
  gap: 7px;
  border-top: 1px solid rgba(151, 174, 214, 0.1);
}

.order-position-edit-form {
  min-width: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 180px)) auto;
  align-items: end;
  gap: 8px;
}

.order-position-field {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.order-position-field label {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.order-position-field input {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 8px 10px;
  font-size: 11px;
}

.order-position-edit-form .button { min-height: 40px; padding: 8px 12px; font-size: 10px; }
.order-position-action { margin: 0; }
.order-position-action .button { min-height: 40px; padding: 8px 12px; font-size: 10px; }

.order-position-line-total {
  min-width: 116px;
  margin: 0;
  text-align: right;
}

.order-position-line-total > div { display: grid; gap: 3px; }
.order-position-line-total dt {
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.order-position-line-total dd {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  font-weight: 780;
  white-space: nowrap;
}

.order-position-total {
  padding: 14px 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 22px;
  background: rgba(17, 25, 38, 0.48);
  border-top: 1px solid var(--border);
}

.order-position-total dl { grid-column: 2; grid-row: 1; margin: 0; }
.order-position-total dl > div { display: grid; gap: 2px; text-align: right; }
.order-position-total dt { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.order-position-total dd { margin: 0; color: var(--text); font-size: 19px; font-weight: 790; white-space: nowrap; }
.order-position-total p { grid-column: 1; grid-row: 1; margin: 0; color: var(--muted-strong); font-size: 10px; line-height: 1.45; }

.order-catalog-add-area {
  padding: 17px 16px 18px;
  background: linear-gradient(180deg, rgba(17, 24, 36, 0.54), rgba(9, 14, 22, 0.32));
  border-top: 1px solid var(--border);
}

.order-catalog-search { max-width: 680px; margin: 0; }

.order-catalog-search > label {
  display: block;
  margin-bottom: 7px;
  color: var(--text-soft);
  font-size: 11px;
  font-weight: 740;
}

.order-catalog-search-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.order-catalog-search input {
  min-width: 0;
  min-height: 40px;
  padding: 8px 11px;
  border-radius: 8px 0 0 8px;
  font-size: 12px;
}

.order-catalog-search button {
  min-height: 40px;
  padding: 0 15px;
  color: var(--text);
  background: rgba(35, 48, 70, 0.9);
  border: 1px solid var(--border-strong);
  border-left: 0;
  border-radius: 0 8px 8px 0;
  font-size: 11px;
  font-weight: 760;
  cursor: pointer;
}

.order-catalog-search button:hover {
  background: var(--surface-hover);
  border-color: var(--border-accent);
}

.order-catalog-helper {
  max-width: 680px;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.order-catalog-helper a { color: var(--accent-bright); font-weight: 700; }

.order-catalog-picker {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.order-catalog-picker-row {
  min-width: 0;
  padding: 11px 12px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  background: rgba(11, 17, 26, 0.72);
  border: 1px solid var(--border);
  border-radius: 9px;
}

.order-catalog-entry-copy,
.order-catalog-selection-copy { min-width: 0; }

.order-catalog-entry-copy strong,
.order-catalog-entry-copy span,
.order-catalog-selection-copy span {
  display: block;
  overflow-wrap: anywhere;
}

.order-catalog-entry-copy strong { color: var(--text); font-size: 12px; }
.order-catalog-entry-copy span,
.order-catalog-selection-copy span { margin-top: 2px; color: var(--muted); font-size: 9px; }

.order-catalog-selection {
  max-width: 860px;
  margin-top: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 13px;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(24, 33, 48, 0.86), rgba(13, 20, 30, 0.86));
  border: 1px solid var(--border-strong);
  border-radius: 10px;
}

.order-catalog-selection-copy { padding: 13px 0 0 14px; }
.order-catalog-selection-copy .eyebrow { margin-bottom: 4px; }
.order-catalog-selection h4 { margin: 0; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.order-catalog-adjust { margin: 12px 12px 0 0; }

.order-catalog-add-form {
  padding: 11px 12px 12px;
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(150px, 240px)) auto;
  align-items: end;
  justify-content: start;
  gap: 9px;
  background: rgba(5, 9, 15, 0.28);
  border-top: 1px solid var(--border);
}

.order-catalog-add-form label {
  min-width: 0;
  display: grid;
  gap: 5px;
  color: var(--muted-strong);
  font-size: 10px;
  font-weight: 700;
}

.order-catalog-add-form input { min-width: 0; min-height: 38px; }
.order-catalog-add-form .button { min-height: 38px; }

.order-catalog-create {
  max-width: 860px;
  margin-top: 15px;
  border-top: 1px solid var(--border);
}

.order-catalog-create summary {
  padding-top: 13px;
  color: var(--accent-bright);
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.order-catalog-create-form {
  padding-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.order-catalog-create-form label { display: grid; gap: 5px; color: var(--muted-strong); font-size: 10px; font-weight: 700; }
.order-catalog-create-form label small { color: var(--muted); font-weight: 500; }
.order-catalog-create-form .button { justify-self: start; align-self: end; }

@media (max-width: 700px) {
  .order-catalog-picker { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-selection { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-adjust { margin: 0 13px; justify-self: start; }
}

@media (max-width: 520px) {
  .order-positions { margin-right: 12px; margin-left: 12px; }
  .order-position-heading { align-items: flex-start; }
  .order-position-card { grid-template-columns: minmax(0, 1fr); }
  .order-position-line-total { justify-self: start; text-align: left; }
  .order-position-value { justify-self: start; }
  .order-position-controls { width: 100%; align-items: stretch; flex-direction: column; justify-self: stretch; }
  .order-position-edit-form { grid-template-columns: minmax(0, 1fr); }
  .order-position-edit-form .button { width: 100%; }
  .order-position-action { width: 100%; }
  .order-position-action .button { width: 100%; }
  .order-catalog-add-area { padding-right: 12px; padding-left: 12px; }
  .order-catalog-picker-row { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-picker-row .button { width: 100%; }
  .order-catalog-add-form { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-add-form .button { width: 100%; }
  .order-catalog-create-form { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-create-form .button { width: 100%; }
  .order-position-total { grid-template-columns: minmax(0, 1fr); }
  .order-position-total dl,
  .order-position-total p { grid-column: 1; grid-row: auto; }
  .order-position-total dl > div { text-align: left; }
}

.completion-gate {
  margin: 14px 16px 16px;
  padding: 15px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: rgba(31, 119, 180, 0.09);
  border: 1px solid rgba(85, 166, 224, 0.2);
  border-radius: 9px;
}

.completion-gate strong { font-size: 12px; }
.completion-gate p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 10px;
}

.button-complete-ready {
  color: #07150f;
  background: linear-gradient(135deg, #62e8b5, var(--success));
  border-color: rgba(118, 245, 196, 0.42);
  box-shadow: 0 8px 24px rgba(67, 214, 161, 0.2);
}

.button-complete-blocked,
.button-complete-blocked:hover {
  color: #8e99a8;
  background: #252b35;
  border-color: rgba(151, 174, 214, 0.16);
  box-shadow: none;
}

.task-terminal-note {
  margin: 0;
  padding: 15px 20px;
  color: var(--muted);
  background: rgba(5, 9, 15, 0.34);
  font-size: 11px;
}

.history-card .panel-heading {
  border-bottom: 0;
}

.history-summary {
  display: block;
  color: inherit;
  cursor: pointer;
  list-style: none;
}

.history-summary::-webkit-details-marker { display: none; }

.history-summary:hover {
  background: rgba(151, 174, 214, 0.04);
}

.history-summary:focus-visible {
  outline: 2px solid var(--accent-bright);
  outline-offset: -3px;
}

.history-summary .panel-heading {
  width: 100%;
}

.history-summary-meta,
.history-summary-action {
  display: flex;
  align-items: center;
  gap: 10px;
}

.history-summary-action {
  color: var(--accent-bright);
  font-size: 10px;
  font-weight: 760;
}

.history-summary-close { display: none; }

.history-summary-chevron {
  display: inline-block;
  font-size: 16px;
  line-height: 1;
  transition: transform 160ms ease;
}

.history-card[open] .history-summary-open { display: none; }
.history-card[open] .history-summary-close { display: inline; }
.history-card[open] .history-summary-chevron { transform: rotate(180deg); }

.history-content {
  border-top: 1px solid var(--border);
}

.history-intro {
  margin: 0;
  padding: 0 20px 15px;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
  font-size: 10px;
}

.history-timeline {
  margin: 0;
  padding: 5px 20px 18px;
  list-style: none;
}

.history-event {
  position: relative;
  min-width: 0;
  padding: 15px 0 0 28px;
}

.history-event:not(:last-child)::before {
  position: absolute;
  top: 25px;
  bottom: -21px;
  left: 7px;
  width: 1px;
  background: linear-gradient(var(--border-accent), var(--border));
  content: '';
}

.history-marker {
  position: absolute;
  top: 22px;
  left: 3px;
  width: 9px;
  height: 9px;
  background: var(--accent);
  border: 2px solid var(--surface);
  border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(72, 170, 238, 0.18);
}

.history-event-malformed .history-marker { background: var(--muted); }

.history-event > article {
  min-width: 0;
  overflow: hidden;
  background: rgba(6, 10, 16, 0.42);
  border: 1px solid var(--border);
  border-radius: 9px;
}

.history-event-header {
  min-width: 0;
  padding: 12px 14px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.history-event-header > div:first-child { min-width: 0; }

.history-event-header h3 {
  margin: 0;
  color: var(--text);
  font-size: 12px;
  letter-spacing: -0.01em;
}

.history-event-header p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 9px;
  overflow-wrap: anywhere;
}

.history-meta {
  display: flex;
  flex: 0 0 auto;
  align-items: flex-end;
  flex-direction: column;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
  white-space: nowrap;
}

.history-meta span span {
  color: var(--accent);
  font-size: 7px;
}

.history-changes {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--border);
  list-style: none;
}

.history-changes > li {
  min-width: 0;
  padding: 11px 14px;
  display: grid;
  grid-template-columns: minmax(125px, 0.32fr) minmax(0, 1fr);
  align-items: start;
  gap: 14px;
}

.history-changes > li + li { border-top: 1px solid rgba(151, 174, 214, 0.08); }

.history-changes > li > strong {
  padding-top: 14px;
  color: var(--muted-strong);
  font-size: 9px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.history-result-value {
  margin: 0;
  color: var(--text-soft);
  line-height: 1.55;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.history-value-pair {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
}

.history-value-pair > div { min-width: 0; }

.history-value-pair > div > span {
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.history-value-pair p {
  min-width: 0;
  margin: 2px 0 0;
  color: var(--text-soft);
  font-size: 10px;
  line-height: 1.45;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.history-arrow {
  color: var(--accent);
  text-align: center;
}

.history-long-values { min-width: 0; }

.history-long-values summary {
  padding: 9px 11px;
  color: var(--text-soft);
  background: rgba(19, 27, 40, 0.72);
  border: 1px solid var(--border);
  border-radius: 7px;
  font-size: 9px;
  line-height: 1.45;
  cursor: pointer;
  overflow-wrap: anywhere;
}

.history-long-values[open] summary { margin-bottom: 10px; }

.history-empty {
  min-height: 110px;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  color: var(--muted);
  text-align: center;
  font-size: 10px;
}

.history-empty strong { color: var(--text-soft); font-size: 12px; }

.history-pagination {
  padding: 0 22px 22px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.generation-suggestions .generation-suggestion-list { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 14px; }
.generation-suggestions .generation-suggestion { display: grid; gap: 12px; padding: 16px; overflow-wrap: anywhere; background: linear-gradient(135deg, rgba(26, 38, 57, .92), rgba(17, 25, 38, .96)); border: 1px solid var(--border); border-left: 4px solid var(--accent); border-radius: 10px; box-shadow: 0 8px 20px rgba(0, 0, 0, .12); }
.generation-suggestions .generation-suggestion-article { border-left-color: var(--accent-bright); }
.generation-suggestions .generation-suggestion-service { border-left-color: var(--success); }
.generation-suggestions .suggestion-heading { display: flex; align-items: center; gap: 9px; min-width: 0; }
.generation-suggestions .suggestion-heading strong { min-width: 0; color: var(--text); font-size: 15px; line-height: 1.35; }
.generation-suggestions .suggestion-kind { flex: 0 0 auto; padding: 4px 7px; color: var(--accent-bright); background: rgba(91, 140, 255, .14); border: 1px solid rgba(91, 140, 255, .34); border-radius: 999px; font-size: 10px; font-weight: 800; letter-spacing: .06em; line-height: 1; text-transform: uppercase; }
.generation-suggestions .suggestion-kind-service { color: var(--success); background: rgba(67, 214, 161, .12); border-color: rgba(67, 214, 161, .3); }
.generation-suggestions .suggestion-meta { padding: 10px 11px; color: var(--text-soft); background: rgba(7, 12, 20, .3); border-radius: 7px; font-size: 12px; line-height: 1.45; }
.generation-suggestions .suggestion-catalog-match { padding-top: 11px; color: var(--muted); border-top: 1px solid var(--border); font-size: 12px; line-height: 1.45; }
.generation-suggestions .suggestion-review { margin: 0; padding: 9px 11px; border-radius: 7px; font-size: 12px; line-height: 1.45; }
.generation-suggestions .generation-suggestion-accepted, .generation-suggestions .generation-suggestion-rejected, .generation-suggestions .generation-suggestion-superseded { opacity: .72; border-left-color: var(--muted); }
.generation-suggestions .suggestion-status { margin: 0; padding-top: 11px; border-top: 1px solid var(--border); }
.generation-suggestions .suggestion-actions, .generation-suggestions .suggestion-bulk-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; padding-top: 12px; border-top: 1px solid var(--border); }
.generation-suggestions .suggestion-actions form, .generation-suggestions .suggestion-bulk-actions form { margin: 0; }

@media (max-width: 520px) {
  .generation-suggestions .generation-suggestion { gap: 10px; padding: 13px; }
  .generation-suggestions .suggestion-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
  .generation-suggestions .suggestion-actions { display: grid; grid-template-columns: 1fr; }
  .generation-suggestions .suggestion-actions .button { width: 100%; justify-content: center; }
}
.generation-protocol {
  margin-top: 28px;
  padding-top: 28px;
  border-top: 1px solid rgba(151, 174, 214, 0.16);
}

.generation-protocol-heading,
.generation-run-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.generation-protocol-heading h3,
.generation-run-header h4 { margin: 0; }

.generation-run-list {
  display: grid;
  gap: 16px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.generation-run {
  border: 1px solid rgba(151, 174, 214, 0.2);
  border-left: 4px solid var(--accent);
  border-radius: 12px;
  background: rgba(8, 18, 36, 0.46);
  padding: 18px;
}

.generation-run-failed,
.generation-run-stale { border-left-color: var(--danger); }

.generation-run-header p { margin: 5px 0 0; }

.generation-run-times,
.generation-facts,
.generation-validation-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.generation-run-times div,
.generation-facts div,
.generation-validation-list div {
  display: grid;
  grid-template-columns: minmax(90px, 0.45fr) minmax(0, 1fr);
  gap: 12px;
}

.generation-run-times dt,
.generation-facts dt,
.generation-validation-list dt { color: var(--muted); }

.generation-run-times dd,
.generation-facts dd,
.generation-validation-list dd { margin: 0; }

.generation-run-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.generation-run-grid section,
.generation-protocol-block,
.generation-error {
  border-radius: 10px;
  background: rgba(151, 174, 214, 0.06);
  padding: 14px;
}

.generation-run-grid h5,
.generation-protocol-block h5,
.generation-error h5 { margin: 0 0 9px; }

.generation-run-grid p,
.generation-protocol-block p,
.generation-error p { margin: 0; }

.generation-run-grid ul,
.generation-protocol-block ul,
.generation-protocol-block ol { margin: 8px 0 0; padding-left: 22px; }

.generation-run-details { margin-top: 16px; }

.generation-run-details > summary {
  cursor: pointer;
  color: var(--text-soft);
  font-weight: 700;
}

.generation-run-details[open] > summary { margin-bottom: 14px; }

.generation-protocol-block + .generation-protocol-block,
.generation-protocol-block + .generation-error { margin-top: 10px; }

.generation-protocol-block h6 { margin: 14px 0 4px; }

.generation-step-list {
  display: grid;
  gap: 8px;
  list-style: none;
  padding: 0 !important;
}

.generation-step-list li {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
}

.generation-step-list time { color: var(--muted); }
.generation-step-failed span { color: var(--danger); }

@media (max-width: 740px) {
  .generation-protocol-heading,
  .generation-run-header { display: grid; }
  .generation-run-grid { grid-template-columns: 1fr; }
  .generation-step-list li { grid-template-columns: 1fr; gap: 2px; }
}

.completion-dialog {
  position: fixed;
  z-index: 60;
  top: 50%;
  left: 50%;
  width: min(calc(100% - 32px), 520px);
  max-height: calc(100vh - 32px);
  padding: 24px;
  overflow: auto;
  background: linear-gradient(145deg, #151d2a, #0d131d);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-lg);
  box-shadow: 0 0 0 100vmax rgba(2, 4, 8, 0.78), var(--shadow-lg);
  transform: translate(-50%, -50%);
}

.completion-dialog h2 {
  margin: 7px 0 8px;
  font-size: 24px;
  letter-spacing: -0.03em;
}

.completion-dialog > p:not(.eyebrow) { margin: 0; color: var(--text-soft); }
.completion-dialog ul { margin: 16px 0; padding-left: 21px; color: var(--warning); }
.completion-dialog li { padding: 3px 0; overflow-wrap: anywhere; }
.completion-dialog-actions {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.completion-dialog-actions form { margin: 0; }

.prose {
  margin: 0;
  line-height: 1.65;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.internal-note {
  margin: 0 16px 16px;
  padding: 15px 16px;
  background: linear-gradient(90deg, var(--warning-surface), rgba(242, 183, 102, 0.035));
  border: 1px solid rgba(242, 183, 102, 0.2);
  border-radius: var(--radius-sm);
}

.internal-note-label {
  margin-bottom: 7px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--warning);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.internal-note-label span {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  line-height: 1;
}

.internal-note .prose {
  color: #d4c3a7;
  font-size: 12px;
}

.customer-notes,
.inline-empty {
  min-height: 88px;
  padding: 20px;
  color: var(--text-soft);
}

.inline-empty {
  margin: 0;
  display: flex;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
}

.data-list {
  margin: 0;
}

.data-list > div {
  min-height: 54px;
  padding: 11px 20px;
  display: grid;
  grid-template-columns: minmax(130px, 0.8fr) minmax(0, 1.2fr);
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--border);
}

.data-list > div:last-child {
  border-bottom: 0;
}

.data-list dt {
  color: var(--muted);
  font-size: 10px;
}

.data-list dd {
  min-width: 0;
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  font-weight: 680;
  text-align: right;
}

.break-word {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.error-page {
  min-height: min(620px, calc(100vh - 200px));
  display: grid;
  grid-template-columns: minmax(220px, 0.65fr) minmax(280px, 1fr);
  align-items: center;
  gap: clamp(32px, 7vw, 90px);
  padding: 50px clamp(24px, 7vw, 96px);
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 50%, rgba(91, 140, 255, 0.12), transparent 19rem),
    linear-gradient(145deg, rgba(17, 24, 36, 0.82), rgba(10, 15, 23, 0.82));
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}

.error-visual {
  position: relative;
  min-width: 0;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  color: var(--accent-bright);
  background: var(--accent-surface);
  border: 1px solid rgba(91, 140, 255, 0.24);
  border-radius: 28%;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 25px 70px rgba(49, 78, 193, 0.14);
  transform: rotate(-5deg);
}

.error-visual::before,
.error-visual::after {
  position: absolute;
  content: "";
  background: currentColor;
  border-radius: 999px;
  opacity: 0.15;
}

.error-visual::before {
  width: 55%;
  height: 4px;
  top: 20%;
}

.error-visual::after {
  width: 4px;
  height: 55%;
  right: 20%;
}

.error-visual span {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: clamp(42px, 8vw, 95px);
  font-weight: 850;
  letter-spacing: -0.08em;
  line-height: 1;
  transform: rotate(5deg);
}

.error-visual-warning {
  color: var(--danger);
  background: var(--danger-surface);
  border-color: rgba(255, 111, 135, 0.24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 25px 70px rgba(160, 43, 72, 0.13);
}

.error-content {
  min-width: 0;
}

.error-content h1 {
  margin: 8px 0 12px;
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 750;
  letter-spacing: -0.05em;
  line-height: 1.04;
}

.error-content > p:not(.eyebrow) {
  max-width: 520px;
  margin: 0 0 26px;
  color: var(--muted);
}

.footer {
  flex: 0 0 auto;
  border-top: 1px solid var(--border);
  background: rgba(6, 9, 14, 0.5);
}

.footer-inner {
  width: min(calc(100% - 48px), var(--max-width));
  min-height: 58px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: #657184;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.sidebar-version {
  color: var(--text-soft);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.sidebar-account-user {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.settings-menu-toggle {
  display: inline-grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  padding: 0;
  color: var(--muted-strong);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 7px;
  cursor: pointer;
}

.settings-menu-toggle:hover,
.settings-menu-toggle[aria-expanded="true"] {
  color: var(--text);
  background: var(--surface-hover);
  border-color: var(--border-strong);
}

.settings-menu-toggle:focus-visible,
.settings-menu-item:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.settings-menu {
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 30;
  min-width: 176px;
  padding: 5px;
  background: var(--surface-strong);
  border: 1px solid var(--border-strong);
  border-radius: 9px;
  box-shadow: var(--shadow-sm);
}

.settings-menu[hidden] { display: none; }

.settings-menu form { margin: 0; }

.settings-menu-item {
  display: flex;
  width: 100%;
  min-height: 36px;
  align-items: center;
  padding: 8px 10px;
  color: var(--text-soft);
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.settings-menu-item:hover { color: var(--text); background: var(--accent-surface); }

.footer-meta {
  display: flex;
  align-items: center;
  gap: 20px;
}

.footer-storage {
  color: #718095;
  font-size: 9px;
  letter-spacing: 0.07em;
}

@media (max-width: 980px) {
  .topbar-inner { align-items: flex-start; padding: 12px 0; }
  .topbar-actions { flex-wrap: wrap; justify-content: flex-end; }
  .global-search { order: 3; width: 100%; }
  .main-content {
    padding-top: 38px;
  }

  .dashboard-hero {
    min-height: 156px;
  }

  .form-section {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .create-search-section > :not(.section-heading),
  .fallback-section > :not(.section-heading) {
    grid-column: 1;
  }

  .section-heading {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border);
  }

  .detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

@media (max-width: 740px) {
  .topbar {
    position: static;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .skip-link {
    position: absolute;
  }

  .topbar-inner,
  .main-content,
  .footer-inner {
    width: min(calc(100% - 28px), var(--max-width));
  }

  .topbar-inner {
    min-height: 56px;
    padding: 7px 0;
    align-items: center;
    flex-wrap: nowrap;
    gap: 7px;
  }

  .main-content {
    padding: 27px 0 58px;
    scroll-margin-top: 12px;
  }

  .local-indicator {
    display: none;
  }

  .topbar-actions {
    width: auto;
    min-width: 0;
    flex: 1;
    flex-wrap: nowrap;
    gap: 4px;
    justify-content: flex-end;
  }

  .signed-in-user {
    max-width: 64px;
    font-size: 9px;
  }

  .main-nav {
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .main-nav::-webkit-scrollbar { display: none; }

  .brand { width: auto; }
  .brand-copy { display: none; }
  .global-search { display: none; }
  .mobile-search-link {
    width: 36px;
    height: 36px;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    color: var(--muted-strong);
    background: rgba(14, 20, 30, 0.72);
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 21px;
    line-height: 1;
    text-decoration: none;
  }

  .dashboard-hero,
  .page-heading,
  .detail-hero {
    align-items: flex-start;
    flex-direction: column;
    gap: 23px;
  }

  .dashboard-hero {
    min-height: 0;
    padding: 6px 0 26px;
  }

  .dashboard-toolbar {
    width: 100%;
  }

  .dashboard-toolbar .button {
    width: 100%;
  }

  .stats {
    gap: 8px;
    margin: 14px 0 18px;
  }

  .stat {
    min-height: 92px;
    padding: 14px;
  }

  .stat strong {
    font-size: 23px;
  }

  .orders-panel {
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  .orders-panel .panel-heading {
    min-height: 64px;
    padding: 12px 0;
  }

  .table-scroll {
    overflow: visible;
  }

  .orders-table,
  .orders-table tbody {
    display: block;
  }

  .orders-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  .orders-table tr {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    margin-bottom: 10px;
    padding: 10px;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(19, 27, 40, 0.96), rgba(12, 18, 28, 0.96));
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
  }

  .orders-table td {
    min-width: 0;
    min-height: 57px;
    padding: 8px 9px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 0;
  }

  .orders-table td::before {
    margin-bottom: 4px;
    color: var(--muted);
    content: attr(data-label);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
  }

  .orders-table td:first-child,
  .orders-table td:nth-child(2) {
    border-bottom: 1px solid var(--border);
  }

  .orders-table td.row-action {
    display: none;
  }

  .catalog-table td.row-action {
    width: auto;
    grid-column: 1 / -1;
    display: flex;
    align-items: stretch;
    text-align: left;
  }

  .catalog-table .row-action a {
    width: 100%;
    min-height: 44px;
    height: auto;
    display: inline-flex;
  }

  .form-heading {
    margin-bottom: 23px;
  }

  .order-reference {
    min-width: min(100%, 220px);
  }

  .form-section {
    padding: 20px 17px;
  }

  .catalog-edit-summary {
    padding: 21px 20px 19px;
  }

  .catalog-edit-form {
    padding: 20px;
  }

  .field-half,
  .field-third {
    grid-column: span 6;
  }

  .catalog-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .catalog-form > .field,
  .catalog-form > .form-hint,
  .catalog-form > .form-actions {
    grid-column: 1 / -1;
  }

  .catalog-form .field > :is(input, select) {
    width: 100%;
  }

  .catalog-page { width: 100%; }

  .catalog-section-header {
    padding: 18px 17px;
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .catalog-create-form { padding: 18px 17px 20px; }
  .catalog-kind-field,
  .catalog-name-field { grid-column: 1 / -1; }
  .catalog-detail-fields { grid-template-columns: minmax(0, 1fr); }

  .catalog-list-toolbar { padding: 13px 0 16px; }

  .catalog-list-toolbar .catalog-search {
    width: 100%;
    display: block;
  }

  .catalog-table td.catalog-entry-identity { grid-column: 1 / -1; }
  .catalog-table th:last-child,
  .catalog-table td:last-child { width: auto; text-align: left; }

  .search-input-row,
  .selected-vehicle-card,
  .order-search-results a {
    grid-template-columns: minmax(0, 1fr);
  }

  .search-input-row .button { width: 100%; }
  .order-search-results a {
    min-height: 84px;
    padding: 15px;
  }
  .order-search-results a > .selection-action {
    display: block;
    font-size: 11px;
  }

  .fallback-links a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .order-search-label,
  .order-search-results small,
  .selected-vehicle-card small,
  .selected-label,
  .create-submit-state p,
  .field-hint { font-size: 11px; }

  .fallback-resolved {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .fallback-resolved a {
    width: 100%;
    margin-left: 42px;
  }

  .form-actions {
    position: static;
    margin: 0 -14px -26px;
    padding: 13px 14px max(13px, env(safe-area-inset-bottom));
    background: rgba(7, 10, 16, 0.92);
    border-top: 1px solid var(--border);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
  }

  .form-actions .button {
    flex: 1;
  }

  .create-submit-state {
    min-width: 0;
    flex: 1;
    flex-direction: column;
    align-items: stretch;
  }

  .create-submit-state p {
    max-width: none;
    text-align: left;
  }

  .detail-actions {
    width: 100%;
    justify-content: space-between;
  }

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

  .integrity-notice,
  .form-audit-note {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .search-groups,
  .data-list-columns { grid-template-columns: 1fr; }

  .detail-card-wide {
    grid-column: auto;
  }

  .task-item {
    grid-template-columns: 1fr;
    gap: 11px;
  }

  .task-status-actions fieldset {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  }

  .history-changes > li {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .history-changes > li > strong { padding-top: 0; }

  .completion-gate {
    align-items: stretch;
    flex-direction: column;
  }

  .completion-gate form,
  .completion-gate .button {
    width: 100%;
  }

  .data-list > div {
    grid-template-columns: minmax(110px, 0.7fr) minmax(0, 1.3fr);
  }

  .error-page {
    min-height: 560px;
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 36px 28px;
    text-align: center;
  }

  .error-visual {
    width: min(58vw, 220px);
    margin: 0 auto;
  }

  .error-content > p:not(.eyebrow) {
    margin-right: auto;
    margin-left: auto;
  }

  .footer-inner {
    padding: 15px 0;
    flex-wrap: wrap;
  }

  .footer-meta {
    gap: 12px;
  }
}

@media (max-width: 520px) {
  .brand { display: none; }
  .topbar-public .brand { display: inline-flex; }

  .topbar-actions {
    width: 100%;
    gap: 4px;
  }

  .button-compact {
    padding: 9px 11px;
  }

  .catalog-edit-form .catalog-edit-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .catalog-edit-actions .button {
    width: 100%;
    min-height: 46px;
  }

  .nav-link {
    min-height: 32px;
    padding: 7px 8px;
    font-size: 10px;
  }

  .new-order-button {
    font-size: 0;
  }

  .intake-button { display: none; }

  .new-order-button .button-icon {
    display: inline-grid;
  }

  .dashboard-intro h1,
  .page-heading h1 {
    font-size: 36px;
  }

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

  .stat {
    padding: 12px 10px;
  }

  .stat-label {
    font-size: 8px;
    letter-spacing: 0.08em;
  }

  .stat strong {
    font-size: 21px;
  }

  .stat small {
    font-size: 8px;
  }

  .empty-state {
    min-height: 360px;
    padding: 38px 20px;
  }

  .orders-table tr {
    grid-template-columns: 1fr;
  }

  .orders-table td:first-child {
    border-bottom: 0;
  }

  .orders-table td:nth-child(2) {
    order: -1;
  }

  .detail-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .detail-actions .status,
  .detail-actions .button {
    width: 100%;
    justify-content: center;
  }

  .service-analysis-card .panel-heading,
  .generated-instructions-card .panel-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .service-analysis-card .panel-heading .status,
  .generated-instructions-card .panel-heading .status {
    max-width: 100%;
    white-space: normal;
  }

  .data-list > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }

  .task-copy {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  .task-copy .task-status {
    width: max-content;
    grid-column: 2;
  }

  .task-status-button {
    min-height: 42px;
    padding-right: 5px;
    padding-left: 5px;
    font-size: 9px;
  }

  .history-timeline { padding-right: 12px; padding-left: 12px; }
  .history-event { padding-left: 21px; }
  .history-event:not(:last-child)::before { left: 5px; }
  .history-marker { left: 1px; }
  .history-event-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }
  .history-meta {
    align-items: flex-start;
    white-space: normal;
  }
  .history-value-pair {
    grid-template-columns: minmax(0, 1fr);
    gap: 5px;
  }
  .history-arrow { text-align: left; transform: rotate(90deg); transform-origin: center; }

  .completion-dialog {
    width: calc(100% - 24px);
    padding: 20px;
  }

  .completion-dialog-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .completion-dialog-actions form,
  .completion-dialog-actions .button {
    width: 100%;
  }

  .data-list dd {
    text-align: left;
  }

  .footer-inner {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .footer-meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}

@media (max-width: 700px) {
  .detail-hero {
    padding-bottom: 18px;
    gap: 14px;
  }

  .detail-hero h1.detail-identity {
    gap: 10px;
  }

  .work-order-cockpit {
    grid-template-columns: minmax(0, 1fr);
  }

  .cockpit-context {
    grid-template-columns: minmax(0, 1fr);
  }

  .task-item {
    padding: 12px;
    grid-template-columns: minmax(0, 1fr);
  }

  .task-status-actions,
  .task-status-actions fieldset {
    min-width: 0;
    width: 100%;
  }

  .task-status-actions fieldset {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  }

  .task-status-button {
    min-width: 0;
    min-height: 44px;
    white-space: normal;
  }

  .order-positions {
    margin-right: 0;
    margin-left: 0;
  }

  .cockpit-workspace {
    padding: 10px;
    gap: 12px;
  }

  .order-position-list { padding: 0; }

  .completion-gate {
    margin-right: 12px;
    margin-left: 12px;
  }
}

@media (max-width: 700px) {
  .order-vehicle-image { width: 98px; height: 74px; }
  .vehicle-hero-image { width: 132px; height: 99px; }
  .vehicle-list-thumbnail { width: 46px; height: 35px; }
  .vehicle-image-dialog-body { grid-template-columns: 1fr; }
  .vehicle-image-dialog-preview { min-height: 220px; max-height: 48vh; }
}

@media (max-width: 520px) {
  .detail-hero:has(.order-vehicle-image), .detail-hero:has(.vehicle-hero-image) { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: start; gap: 14px; }
  .detail-hero:has(.order-vehicle-image) .order-vehicle-image { width: 92px; height: 69px; }
  .detail-hero:has(.vehicle-hero-image) .vehicle-hero-image { width: 112px; height: 84px; }
  .detail-hero:has(.order-vehicle-image) .detail-title-group, .detail-hero:has(.vehicle-hero-image) .detail-title-group { margin-right: 0; }
  .detail-hero:has(.order-vehicle-image) .detail-actions, .detail-hero:has(.vehicle-hero-image) .detail-actions { grid-column: 1 / -1; }
  .vehicle-image-dialog { width: min(100vw - 20px, 720px); }
  .vehicle-image-dialog-header, .vehicle-image-dialog-body { padding: 15px; }
}

@media (max-width: 390px) {
  .topbar-inner,
  .main-content,
  .footer-inner {
    width: calc(100% - 24px);
  }

  .brand {
    gap: 9px;
  }

  .brand-logo {
    width: 38px;
    height: 38px;
  }

  .brand-copy strong {
    font-size: 12px;
  }

  .topbar-inner {
    gap: 10px;
  }

  .main-nav {
    gap: 1px;
  }

  .nav-link {
    padding-right: 6px;
    padding-left: 6px;
  }

  .detail-hero .plate-large {
    font-size: 17px;
  }

  .vehicle-name {
    font-size: 19px;
  }

  .task-copy {
    column-gap: 8px;
  }

  .task-status-actions fieldset {
    grid-template-columns: minmax(0, 1fr);
  }

  .context-card .data-list > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  .context-card .data-list dd {
    text-align: left;
  }

  .form-section {
    padding: 18px 14px;
  }

  .catalog-edit-summary,
  .catalog-edit-form {
    padding-right: 14px;
    padding-left: 14px;
  }

  .form-actions {
    margin-right: -12px;
    margin-left: -12px;
    padding-right: 12px;
    padding-left: 12px;
  }

  .error-page {
    padding-right: 20px;
    padding-left: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .generation-progress-track span {
    width: 100%;
    animation: none;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  .button:hover,
  .row-action a:hover {
    transform: none;
  }
}

@media (forced-colors: active) {
  .button,
  .panel,
  .form-section,
  .status,
  input,
  select,
  textarea {
    border: 1px solid CanvasText;
  }

  .local-indicator i,
  .footer-storage i,
  .status::before {
    forced-color-adjust: none;
  }
}
.intake-scanner-panel,.intake-match-panel{margin-bottom:1rem}.scan-upload-row{display:flex;gap:1rem;align-items:end;flex-wrap:wrap}.scan-upload-row .field{flex:1 1 18rem}.scan-status{min-height:1.5rem;margin-top:.75rem}.intake-match-results{display:grid;gap:.5rem;margin:.75rem 0}.match-choice{text-align:left;border:1px solid var(--border,#39414b);background:var(--surface,#1b2026);color:inherit;border-radius:.5rem;padding:.75rem;cursor:pointer}.match-choice:hover,.match-choice:focus-visible{border-color:var(--accent,#e77d2f)}.intake-selection{margin-bottom:1rem;padding:.75rem;border-left:3px solid var(--accent,#e77d2f);background:rgba(255,255,255,.035)}
.intake-form [data-scan-uncertain]{outline:2px solid var(--accent,#e77d2f);outline-offset:2px}.scanner-protocol{margin-top:1rem}.scanner-protocol summary{cursor:pointer}

/* Compact application shell: the navigation remains persistent on large screens
   and becomes an explicitly opened menu on touch-sized screens. */
.sidebar-toggle { display: none; }
.compact-empty-state { padding: 18px 20px; display: grid; gap: 3px; }
.compact-empty-state strong { font-size: 13px; }
.compact-empty-state span, .table-meta { color: var(--muted); font-size: 11px; }
.table-meta { display: block; margin-top: 2px; }
.invoice-amount { color: var(--success); font-weight: 800; white-space: nowrap; }
.invoice-list-panel .panel-heading { min-height: 58px; }

/* Printable invoice document within the persistent dark application shell. */
.invoice-detail-page { max-width: 980px; margin: 0 auto; }
.invoice-document-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 0 18px; }
.invoice-back-link { display: inline-flex; align-items: center; gap: 7px; color: var(--text-soft); font-size: 13px; font-weight: 700; text-decoration: none; }
.invoice-back-link:hover, .invoice-back-link:focus-visible { color: var(--text); text-decoration: underline; }
.invoice-document { overflow: hidden; color: #202833; background: #fff; border: 1px solid rgba(211, 219, 229, .9); border-radius: 4px; box-shadow: 0 24px 56px rgba(0, 0, 0, .28); }
.invoice-document-header { display: flex; justify-content: space-between; gap: 28px; padding: 42px 48px 29px; color: #fff; background: #1a2533; }
.invoice-branding, .invoice-document-kind, .invoice-recipient, .invoice-title-block, .invoice-document-meta, .invoice-reference-strip, .invoice-totals dl { margin: 0; }
.invoice-product-name { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -.03em; }.invoice-product-subtitle { margin: 1px 0 0; color: #cbd7e7; font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.invoice-document-kind { display: grid; align-content: start; justify-items: end; gap: 2px; text-align: right; }.invoice-document-kind span, .invoice-document-kind small { color: #cbd7e7; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }.invoice-document-kind strong { font-size: 16px; }
.invoice-address-and-title { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, .9fr); gap: 36px; padding: 38px 48px 30px; }.invoice-section-label { margin: 0 0 8px; color: #607084; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.invoice-recipient { display: grid; align-content: start; gap: 1px; font-size: 14px; line-height: 1.5; }.invoice-recipient strong { margin-bottom: 2px; font-size: 16px; }.invoice-title-block { text-align: right; }.invoice-title-block h1 { margin: 0 0 18px; color: #172330; font-size: clamp(25px, 4vw, 34px); line-height: 1.12; letter-spacing: -.035em; }
.invoice-document-meta { display: grid; gap: 7px; }.invoice-document-meta div, .invoice-totals dl > div { display: flex; justify-content: space-between; gap: 14px; }.invoice-document-meta dt { color: #68788c; font-size: 12px; }.invoice-document-meta dd { margin: 0; font-size: 12px; font-weight: 750; }
.invoice-reference-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-block: 1px solid #dce3eb; background: #f5f7fa; }.invoice-reference-strip div { min-width: 0; padding: 14px 18px; border-right: 1px solid #dce3eb; }.invoice-reference-strip div:last-child { border-right: 0; }.invoice-reference-strip span { display: block; margin-bottom: 3px; color: #6b7889; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.invoice-reference-strip strong { display: block; overflow-wrap: anywhere; color: #263341; font-size: 12px; line-height: 1.35; }
.invoice-lines { padding: 32px 48px 0; }.invoice-table-wrap { overflow-x: auto; }.invoice-document-table { width: 100%; border-collapse: collapse; font-size: 13px; }.invoice-document-table th { padding: 0 10px 10px; color: #657386; border-bottom: 2px solid #53677d; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-align: left; text-transform: uppercase; white-space: nowrap; }.invoice-document-table th:first-child, .invoice-document-table td:first-child { padding-left: 0; }.invoice-document-table th:last-child, .invoice-document-table td:last-child { padding-right: 0; }.invoice-document-table td { padding: 14px 10px; vertical-align: top; border-bottom: 1px solid #dfe5eb; }.invoice-document-table td strong { display: block; color: #1f2b38; font-size: 13px; overflow-wrap: anywhere; }.invoice-line-description { display: block; margin-top: 3px; color: #667589; font-size: 11px; overflow-wrap: anywhere; }.invoice-document-table .numeric { text-align: right; white-space: nowrap; }.invoice-document-table .invoice-line-total { color: #172330; font-weight: 800; }
.invoice-empty-state { display: grid; gap: 3px; padding: 22px; color: #566579; border: 1px dashed #b9c5d2; background: #f7f9fb; font-size: 13px; }.invoice-empty-state strong { color: #263341; }.invoice-document-bottom { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 320px); align-items: end; gap: 34px; padding: 29px 48px 38px; }.invoice-draft-note { margin: 0; color: #58687a; font-size: 12px; line-height: 1.55; }.invoice-draft-note strong { color: #314155; }.invoice-totals { padding-top: 2px; }.invoice-totals dl { display: grid; gap: 7px; font-size: 13px; }.invoice-totals dt { color: #5b6b7d; }.invoice-totals dd { margin: 0; color: #263341; font-weight: 750; text-align: right; white-space: nowrap; }.invoice-totals .invoice-total-grand { margin-top: 5px; padding-top: 11px; border-top: 2px solid #53677d; }.invoice-total-grand dt, .invoice-total-grand dd { color: #172330; font-size: 17px; font-weight: 850; }.invoice-document-footer { display: flex; justify-content: space-between; gap: 18px; padding: 15px 48px; color: #647386; border-top: 1px solid #dce3eb; font-size: 10px; }

@media (max-width: 740px) { .invoice-detail-page { max-width: none; }.invoice-document-toolbar { margin-bottom: 12px; }.invoice-document { border-radius: 2px; }.invoice-document-header { flex-direction: column; padding: 25px 20px 21px; }.invoice-document-kind { justify-items: start; text-align: left; }.invoice-address-and-title { grid-template-columns: 1fr; gap: 25px; padding: 25px 20px 22px; }.invoice-title-block { text-align: left; }.invoice-reference-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }.invoice-reference-strip div:nth-child(2n) { border-right: 0; }.invoice-reference-strip div:nth-child(-n + 2) { border-bottom: 1px solid #dce3eb; }.invoice-lines { padding: 22px 20px 0; }.invoice-table-wrap { overflow: visible; }.invoice-document-table, .invoice-document-table tbody, .invoice-document-table tr, .invoice-document-table td { display: block; width: 100%; }.invoice-document-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }.invoice-document-table tr { padding: 13px 0; border-bottom: 1px solid #dfe5eb; }.invoice-document-table td { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 3px 0; border: 0; text-align: right; }.invoice-document-table td::before { content: attr(data-label); color: #657386; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-align: left; text-transform: uppercase; }.invoice-document-table td:nth-child(2) { display: block; padding-bottom: 8px; text-align: left; }.invoice-document-table td:nth-child(2)::before { display: none; }.invoice-document-table .numeric { text-align: right; }.invoice-document-bottom { grid-template-columns: 1fr; gap: 24px; padding: 24px 20px 30px; }.invoice-document-footer { align-items: start; flex-direction: column; gap: 3px; padding: 13px 20px; } }

@media print { @page { size: A4; margin: 12mm; } html, body { min-width: 0; background: #fff; } body { color: #202833; font-size: 10pt; }.skip-link, .app-shell-private .topbar, .app-shell-private .workspace-toolbar, .invoice-document-toolbar, .app-shell-private .footer { display: none !important; }.app-shell, .app-shell-private, .app-shell-private .main-content { display: block; width: auto; min-height: 0; margin: 0; padding: 0; }.invoice-detail-page { max-width: none; margin: 0; }.invoice-document { border: 0; box-shadow: none; }.invoice-document-header { padding: 0 0 7mm; }.invoice-address-and-title { padding: 7mm 0 6mm; }.invoice-lines { padding: 7mm 0 0; }.invoice-document-bottom { padding: 7mm 0; }.invoice-document-footer { padding: 4mm 0 0; }.invoice-document-table tr, .invoice-reference-strip, .invoice-document-bottom { break-inside: avoid; } }

/* Dashboard cockpit: operational density without introducing a second visual language. */
.cockpit-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; padding:8px 0 25px; border-bottom:1px solid var(--border); }
.cockpit-heading h1 { margin:6px 0 0; font-size:clamp(27px,3.3vw,43px); font-weight:760; letter-spacing:-.045em; line-height:1.05; }
.cockpit-heading-actions { display:flex; flex-wrap:wrap; gap:8px; }
.cockpit-primary-grid,.cockpit-secondary-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(310px,.9fr); gap:14px; margin-top:16px; }
.cockpit-secondary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.cockpit-panel { min-width:0; overflow:hidden; background:linear-gradient(145deg,rgba(18,25,37,.98),rgba(11,16,25,.98)); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.cockpit-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:68px; padding:15px 18px; border-bottom:1px solid var(--border); }
.cockpit-panel-heading h2 { margin:3px 0 0; font-size:17px; font-weight:730; letter-spacing:-.025em; }
.text-link { color:var(--accent-bright); font-size:11px; font-weight:720; white-space:nowrap; }
.text-link:hover { color:var(--text); }
.cockpit-empty { display:grid; gap:7px; padding:24px 19px 25px; color:var(--muted); font-size:12px; line-height:1.5; }
.cockpit-empty strong { color:var(--text); font-size:14px; }.cockpit-empty a { width:max-content; margin-top:3px; color:var(--accent-bright); font-weight:700; }.cockpit-empty.compact { min-height:118px; }
.cockpit-agenda-list,.cockpit-lift-list { margin:0; padding:0; list-style:none; }
.cockpit-agenda-list li + li { border-top:1px solid var(--border); }.cockpit-agenda-list a { display:grid; grid-template-columns:72px minmax(0,1fr) auto; align-items:start; gap:18px; padding:17px 20px; color:var(--text-soft); }.cockpit-agenda-list a:hover,.cockpit-work-row:hover { background:rgba(59,84,126,.16); }
.cockpit-agenda-list time { display:grid; gap:4px; padding-top:2px; color:var(--muted); font-size:10px; line-height:1.3; }.cockpit-agenda-list time strong { color:var(--text); font-size:16px; line-height:1.1; }.cockpit-agenda-copy { min-width:0; display:grid; gap:7px; }.cockpit-agenda-copy strong { color:var(--text); font-size:14px; line-height:1.35; }.cockpit-agenda-copy span { color:var(--muted); font-size:11px; line-height:1.45; overflow-wrap:anywhere; }.cockpit-chevron { align-self:center; color:var(--accent-bright); }
.cockpit-priority { border-color:rgba(91,140,255,.25); }.cockpit-priority-list { display:grid; padding:8px; gap:5px; }.cockpit-priority-item { display:grid; gap:3px; padding:10px 11px; color:var(--muted); border-left:2px solid var(--border-strong); border-radius:4px; }.cockpit-priority-item:hover { background:rgba(59,84,126,.18); }.cockpit-priority-item > span:not(.status) { color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.cockpit-priority-item strong { color:var(--text); font-size:12px; }.cockpit-priority-item small { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.cockpit-priority-offer { border-left-color:var(--warning); }.cockpit-priority-invoice { border-left-color:var(--accent-bright); }
.cockpit-work { margin-top:14px; }.cockpit-work-list { display:grid; }.cockpit-work-row { display:grid; grid-template-columns:94px minmax(120px,.8fr) 52px minmax(155px,1.2fr) minmax(100px,.6fr) auto; align-items:center; gap:16px; padding:12px 18px; color:var(--muted); border-top:1px solid var(--border); }.cockpit-work-row:first-child { border-top:0; }.cockpit-work-row > span:not(.status) { min-width:0; }.cockpit-work-thumbnail { display:grid; width:52px; height:39px; overflow:hidden; place-items:center; border:1px solid var(--border-strong); border-radius:6px; background:var(--surface-strong); }.cockpit-work-thumbnail img { display:block; width:100%; height:100%; object-fit:cover; }.cockpit-work-thumbnail-placeholder { display:grid; width:100%; height:100%; place-items:center; color:var(--accent-bright); background:linear-gradient(145deg,rgba(102,137,188,.18),rgba(20,26,36,.45)); font-size:20px; line-height:1; }.cockpit-work-row strong,.cockpit-work-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.cockpit-work-row strong { color:var(--text); font-size:12px; }.cockpit-work-row small,.cockpit-lift-reference { margin-top:3px; font-size:10px; }.cockpit-lift-reference { color:var(--muted-strong); }
.cockpit-lift-list li { display:grid; grid-template-columns:auto minmax(90px,.65fr) minmax(0,1.35fr); align-items:center; gap:10px; min-height:44px; padding:0 18px; border-top:1px solid var(--border); }.cockpit-lift-list strong { color:var(--text); font-size:12px; }.cockpit-lift-list li > span:last-child,.cockpit-lift-list a { overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.cockpit-lift-list a { color:var(--accent-bright); }.cockpit-lift-state { width:7px; height:7px; border-radius:50%; background:var(--success); box-shadow:0 0 0 4px rgba(67,214,161,.1); }.cockpit-lift-state.is-occupied { background:var(--warning); box-shadow:0 0 0 4px rgba(246,184,83,.1); }
.cockpit-finance-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.cockpit-finance-list a { display:grid; gap:4px; min-width:0; padding:15px 18px; border-top:1px solid var(--border); }.cockpit-finance-list a + a { border-left:1px solid var(--border); }.cockpit-finance-list a:hover { background:rgba(59,84,126,.16); }.cockpit-finance-list span { color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.cockpit-finance-list strong { overflow:hidden; color:var(--text); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.cockpit-finance-list small { overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.cockpit-directory { display:flex; gap:9px; margin:14px 0 4px; }.cockpit-directory a { display:grid; grid-template-columns:auto 1fr; column-gap:9px; align-items:center; min-width:0; padding:11px 14px; color:var(--muted); border:1px solid var(--border); border-radius:var(--radius); }.cockpit-directory a:hover { color:var(--text); border-color:var(--border-strong); }.cockpit-directory a > span { grid-row:span 2; color:var(--accent-bright); font-size:18px; }.cockpit-directory strong { color:var(--text); font-size:12px; }.cockpit-directory small { font-size:10px; }
@media (max-width: 760px) { .cockpit-heading { align-items:start; flex-direction:column; padding-bottom:18px; }.cockpit-heading-actions { width:100%; }.cockpit-heading-actions .button { flex:1 1 0; justify-content:center; }.cockpit-primary-grid,.cockpit-secondary-grid { grid-template-columns:1fr; gap:12px; margin-top:12px; }.cockpit-work { margin-top:12px; }.cockpit-work-row { grid-template-columns:86px minmax(0,1fr) auto; gap:9px; padding:12px 14px; }.cockpit-work-row > span:nth-child(2) strong { overflow:visible; text-overflow:clip; white-space:normal; overflow-wrap:anywhere; }.cockpit-work-row > span:nth-child(3),.cockpit-work-row > span:nth-child(4),.cockpit-lift-reference { display:none; }.cockpit-panel-heading { min-height:62px; padding:13px 14px; }.cockpit-agenda-list a { grid-template-columns:68px minmax(0,1fr) auto; gap:14px; padding:16px 14px; }.cockpit-finance-list { grid-template-columns:1fr; }.cockpit-finance-list a + a { border-left:0; }.cockpit-directory { margin-top:12px; }.cockpit-directory a { flex:1 1 0; padding:10px; }.cockpit-directory small { display:none; } }
@media (max-width: 420px) { .cockpit-agenda-list a { grid-template-columns:58px minmax(0,1fr) auto; gap:11px; padding:15px 12px; }.cockpit-agenda-list time strong { font-size:15px; }.cockpit-agenda-copy { gap:6px; } }

/* Auftragspositionen: kompakter operativer Arbeitsbereich */
.position-work-area {
  background: linear-gradient(165deg, rgba(13, 20, 31, 0.96), rgba(7, 11, 18, 0.98));
}

.order-position-heading {
  min-height: 66px;
  padding: 14px 18px;
  background: linear-gradient(90deg, rgba(41, 31, 66, 0.52), rgba(12, 18, 29, 0.15));
}

.saved-order-positions { min-width: 0; }

.order-position-section-heading {
  padding: 11px 18px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  background: rgba(4, 8, 14, 0.46);
  border-bottom: 1px solid rgba(151, 174, 214, 0.12);
}

.order-position-section-heading h4,
.order-catalog-add-heading h4 {
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.3;
}

.order-position-section-heading span,
.order-catalog-add-heading > span {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.order-position-list {
  gap: 8px;
  padding: 10px;
  background: rgba(3, 6, 11, 0.22);
}

.order-position-card,
.app-shell-private .order-position-card {
  min-height: 0;
  padding: 0;
  display: block;
  background: linear-gradient(135deg, rgba(17, 27, 42, 0.76), rgba(9, 14, 23, 0.92));
  border: 1px solid rgba(135, 156, 196, 0.2);
  border-radius: 9px;
  box-shadow: inset 3px 0 0 rgba(178, 140, 255, 0.36);
}

.order-position-card + .order-position-card { border-top: 1px solid rgba(135, 156, 196, 0.2); }

.order-position-card-header {
  min-width: 0;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
}

.order-position-identity { align-items: flex-start; }
.order-position-marker { width: 32px; height: 32px; border-radius: 7px; }
.order-position-copy { gap: 3px; }
.order-position-copy strong,
.order-position-copy .order-position-catalog-link { font-size: 13px; }
.order-position-copy span { font-size: 9px; }

.order-position-line-total,
.app-shell-private .order-position-line-total {
  min-width: 124px;
  padding-left: 14px;
  margin: 0;
  border-left: 1px solid rgba(151, 174, 214, 0.14);
}

.order-position-line-total dd { color: var(--accent-bright); font-size: 15px; }

.order-position-controls,
.app-shell-private .order-position-controls {
  min-width: 0;
  padding: 11px 14px 13px;
  display: grid;
  grid-template-columns: minmax(240px, 1.35fr) minmax(290px, 1fr) auto;
  align-items: end;
  justify-content: normal;
  gap: 9px;
  border-top: 1px solid rgba(151, 174, 214, 0.13);
  background: rgba(3, 7, 13, 0.32);
}

.order-position-name-form,
.order-position-edit-form,
.app-shell-private .order-position-edit-form {
  min-width: 0;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 7px;
}

.order-position-edit-form,
.app-shell-private .order-position-edit-form {
  grid-template-columns: repeat(2, minmax(96px, 1fr)) auto;
}

.order-position-field { gap: 4px; }
.order-position-field label { font-size: 8px; }
.order-position-field input { min-height: 38px; padding: 7px 9px; }
.order-position-edit-form .button,
.order-position-name-form .button,
.order-position-action .button,
.app-shell-private .order-position-edit-form .button,
.app-shell-private .order-position-action .button {
  min-height: 38px;
  padding: 7px 10px;
  font-size: 9px;
}

.order-position-action { margin: 0; }

.order-catalog-link-workspace {
  max-width: none;
  margin: 0;
  border-top: 1px solid rgba(178, 140, 255, 0.2);
  background: rgba(19, 14, 31, 0.38);
}

.order-catalog-link-workspace summary {
  padding: 10px 14px;
  color: var(--violet);
}

.order-catalog-link-content {
  padding: 0 14px 14px;
  display: grid;
  gap: 10px;
}

.order-catalog-link-content > form:first-child { max-width: 720px; }
.order-catalog-link-content label { display: block; margin-bottom: 5px; color: var(--muted-strong); font-size: 10px; font-weight: 700; }
.order-catalog-link-content .muted-copy { margin: 0; font-size: 10px; }

.order-catalog-link-results {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 7px;
}

.order-catalog-link-results form {
  min-width: 0;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(178, 140, 255, 0.2);
  border-radius: 7px;
  background: rgba(6, 9, 16, 0.5);
}

.order-catalog-link-results span { overflow-wrap: anywhere; color: var(--text-soft); font-size: 10px; }
.order-catalog-link-workspace .order-catalog-create-form { max-width: 760px; margin-top: 0; }

.order-position-total {
  margin: 0 10px 10px;
  padding: 10px 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  border: 1px solid rgba(135, 156, 196, 0.18);
  border-radius: 8px;
  background: rgba(24, 33, 48, 0.54);
}

.order-position-total dd { color: var(--accent-bright); font-size: 17px; }

.order-catalog-add-area {
  padding: 16px 18px 18px;
  background: linear-gradient(165deg, rgba(27, 23, 43, 0.6), rgba(8, 14, 23, 0.74));
  border-top: 1px solid rgba(178, 140, 255, 0.3);
}

.order-catalog-add-heading {
  margin-bottom: 13px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.order-catalog-add-heading h4 { margin-top: 3px; font-size: 14px; }
.order-catalog-search,
.order-catalog-helper,
.order-catalog-selection,
.order-catalog-create { max-width: none; }
.order-catalog-search { width: min(100%, 900px); }
.order-catalog-picker { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.order-catalog-selection { grid-template-columns: minmax(0, 1fr) auto; }
.order-catalog-add-form { grid-template-columns: repeat(2, minmax(150px, 260px)) auto; }

@media (max-width: 980px) {
  .order-position-controls,
  .app-shell-private .order-position-controls { grid-template-columns: minmax(0, 1fr) minmax(270px, 0.9fr) auto; }
}

@media (max-width: 740px) {
  .order-position-heading,
  .order-position-section-heading,
  .order-catalog-add-area { padding-right: 13px; padding-left: 13px; }
  .order-position-list { padding: 8px; }
  .order-position-controls,
  .app-shell-private .order-position-controls { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .order-position-name-form { grid-column: 1 / -1; }
  .order-position-action { justify-self: end; }
}

@media (max-width: 520px) {
  .order-position-heading,
  .order-position-section-heading,
  .order-catalog-add-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .order-position-card-header { padding: 12px; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .order-position-line-total,
  .app-shell-private .order-position-line-total { padding: 8px 0 0; border-top: 1px solid rgba(151, 174, 214, 0.13); border-left: 0; text-align: left; }
  .order-position-controls,
  .app-shell-private .order-position-controls { padding: 11px 12px 12px; grid-template-columns: minmax(0, 1fr); }
  .order-position-name-form,
  .order-position-edit-form,
  .app-shell-private .order-position-edit-form { grid-column: auto; grid-template-columns: minmax(0, 1fr); }
  .order-position-name-form .button,
  .order-position-edit-form .button,
  .order-position-action,
  .order-position-action .button { width: 100%; }
  .order-position-action { justify-self: stretch; }
  .order-catalog-link-content { padding-right: 12px; padding-left: 12px; }
  .order-catalog-link-results { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-link-results form { grid-template-columns: minmax(0, 1fr); }
  .order-catalog-link-results .button { width: 100%; }
  .order-position-total { margin: 0 8px 8px; }
  .order-catalog-add-form { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 741px) {
  .app-shell-private {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    align-items: start;
  }

  .app-shell-private .topbar {
    position: sticky;
    top: 0;
    grid-row: 1 / span 3;
    width: 248px;
    height: 100vh;
    overflow-y: auto;
    border-right: 1px solid var(--border);
    border-bottom: 0;
    background: rgba(7, 10, 16, 0.94);
  }

  .app-shell-private .topbar-inner {
    width: 100%; min-height: 100%; margin: 0; padding: 18px 14px;
    display: grid; grid-template-columns: minmax(0, 1fr) 34px; grid-template-rows: auto minmax(0, 1fr); align-content: start; gap: 16px 8px;
  }

  .app-shell-private .brand { min-width: 0; }
  .app-shell-private .sidebar-toggle {
    min-width: 34px; min-height: 34px; display: inline-grid; place-items: center; padding: 0;
    color: var(--muted-strong); background: var(--surface); border: 1px solid var(--border); border-radius: 8px; cursor: pointer;
  }
  .app-shell-private .topbar-actions { grid-column: 1 / -1; align-self: start; display: block; min-height: 0; }
  .app-shell-private .main-nav { display: grid; gap: 3px; padding: 4px 0; border-block: 1px solid var(--border); }
  .app-shell-private .nav-link { min-height: 38px; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; color: var(--muted-strong); font-size: 12px; font-weight: 720; text-decoration: none; }
  .app-shell-private .nav-link:hover, .app-shell-private .nav-link:focus-visible, .app-shell-private .nav-link.is-active { color: var(--text); background: var(--accent-surface); }
  .app-shell-private .nav-link.is-active { box-shadow: inset 2px 0 0 var(--accent); }
  .nav-icon { width: 18px; flex: 0 0 18px; color: var(--accent-bright); text-align: center; font-size: 15px; }
  .app-shell-private .sidebar-account { position: absolute; right: 14px; bottom: 18px; left: 14px; display: grid; gap: 7px; padding: 14px 0 0; border-top: 1px solid var(--border); }
  .app-shell-private .sidebar-version { margin-top: 7px; padding-top: 14px; border-top: 1px solid var(--border); }
  .app-shell-private .workspace-toolbar { grid-column: 2; grid-row: 1; width: 100%; }
  .app-shell-private .workspace-toolbar-inner { width: min(calc(100% - 48px), var(--max-width)); }
  .app-shell-private .global-search { width: clamp(240px, 32vw, 480px); }
  .app-shell-private .global-search input { min-width: 0; }
  .app-shell-private .main-content, .app-shell-private .footer { grid-column: 2; width: 100%; }
  .app-shell-private .main-content { grid-row: 2; width: min(calc(100% - 48px), var(--max-width)); padding: 30px 0 52px; }
  .app-shell-private .footer { grid-row: 3; }
  .app-shell-private .footer-inner { width: min(calc(100% - 48px), var(--max-width)); }

  .app-shell-private.sidebar-collapsed { grid-template-columns: 68px minmax(0, 1fr); }
  .app-shell-private.sidebar-collapsed .topbar { width: 68px; overflow: visible; }
  .app-shell-private.sidebar-collapsed .topbar-inner { grid-template-columns: 1fr; grid-template-rows: auto auto auto 1fr; padding: 16px; gap: 14px; }
  .app-shell-private.sidebar-collapsed .brand { justify-content: center; }
  .app-shell-private.sidebar-collapsed .brand-copy { display: none; }
  .app-shell-private.sidebar-collapsed .sidebar-toggle { grid-row: 2; }
  .app-shell-private.sidebar-collapsed .topbar-actions { grid-column: 1; grid-row: 3; gap: 10px; }
  .app-shell-private.sidebar-collapsed .main-nav { border: 0; }
  .app-shell-private.sidebar-collapsed .nav-link { justify-content: center; padding: 8px; }
  .app-shell-private.sidebar-collapsed .nav-link > span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  .app-shell-private.sidebar-collapsed .sidebar-account { right: 16px; bottom: 16px; left: 16px; display: grid; justify-items: center; padding: 0; border: 0; }
  .app-shell-private.sidebar-collapsed .signed-in-user,
  .app-shell-private.sidebar-collapsed .sidebar-version { display: none; }
  .app-shell-private.sidebar-collapsed .settings-menu-toggle { width: 36px; height: 36px; flex-basis: 36px; }
  .app-shell-private.sidebar-collapsed .settings-menu { right: auto; left: 0; }
  .app-shell-private .panel { border-radius: 10px; }
  .app-shell-private .panel-heading { min-height: 58px; padding: 13px 16px; }
  .app-shell-private .detail-card .panel-heading { min-height: 58px; }
  .app-shell-private .page-heading { margin-bottom: 22px; }
  .app-shell-private .work-order-cockpit { gap: 12px; }
  .app-shell-private .task-item { min-height: 54px; padding: 8px 14px; grid-template-columns: minmax(0, 1fr) minmax(174px, auto); gap: 12px; }
  .app-shell-private .task-copy { grid-template-columns: 24px minmax(0, 1fr) auto; gap: 9px; }
  .app-shell-private .task-copy p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .app-shell-private .task-status-actions fieldset { grid-template-columns: repeat(2, auto); }
  .app-shell-private .task-status-button { min-height: 34px; padding: 6px 9px; }
}

@media (min-width: 1300px) {
  .app-shell-private .order-position-card { min-height: 62px; padding: 9px 14px; grid-template-columns: minmax(180px, 1fr) minmax(300px, auto) minmax(94px, auto); align-items: center; gap: 12px; }
  .app-shell-private .order-position-copy { display: block; }
  .app-shell-private .order-position-copy strong, .app-shell-private .order-position-copy .order-position-catalog-link, .app-shell-private .order-position-copy span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .app-shell-private .order-position-controls { grid-column: auto; padding-top: 0; display: flex; align-items: end; gap: 6px; border-top: 0; }
  .app-shell-private .order-position-edit-form { display: flex; align-items: end; gap: 6px; }
  .app-shell-private .order-position-field { min-width: 88px; }
  .app-shell-private .order-position-field input { width: 92px; min-height: 34px; padding: 5px 7px; }
  .app-shell-private .order-position-edit-form .button, .app-shell-private .order-position-action .button { min-height: 34px; padding: 6px 9px; }
  .app-shell-private .order-position-line-total { margin: 0; text-align: right; }
}

@media (max-width: 740px) {
  .app-shell-private .topbar { position: sticky; top: 0; }
  .app-shell-private .topbar-inner { width: min(calc(100% - 28px), var(--max-width)); min-height: 54px; padding: 8px 0; display: grid; grid-template-columns: auto 1fr auto; gap: 8px; }
  .app-shell-private .brand-copy, .app-shell-private .sidebar-account { display: none; }
  .app-shell-private .sidebar-toggle { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 8px; }
  .app-shell-private .topbar-actions { display: contents; }
  .app-shell-private .main-nav { display: none; grid-column: 1 / -1; grid-row: 2; padding: 8px; background: var(--surface-strong); border: 1px solid var(--border-strong); border-radius: 10px; }
  .app-shell-private.sidebar-mobile-open .main-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
  .app-shell-private.sidebar-mobile-open .sidebar-account { position: static; display: grid; grid-column: 1 / -1; grid-row: 3; gap: 7px; padding: 14px 8px 8px; background: var(--surface-strong); border: 1px solid var(--border-strong); border-radius: 10px; }
  .app-shell-private .settings-menu { position: static; min-width: 0; box-shadow: none; }
  .app-shell-private .sidebar-version { margin-top: 4px; padding: 8px 0 0; border-top: 1px solid var(--border); }
  .app-shell-private .nav-link { min-height: 40px; display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 7px; color: var(--text-soft); text-decoration: none; font-size: 12px; }
  .app-shell-private .nav-link.is-active { background: var(--accent-surface); color: var(--text); }
  .app-shell-private .workspace-toolbar { position: sticky; z-index: 19; top: 54px; }
  .app-shell-private .workspace-toolbar-inner { width: min(calc(100% - 28px), var(--max-width)); min-height: 0; padding: 8px 0; flex-wrap: wrap; gap: 8px; }
  .app-shell-private .workspace-toolbar .global-search { display: flex; flex: 1 1 220px; order: initial; width: auto; }
  .app-shell-private .workspace-actions { flex: 1 1 auto; justify-content: flex-end; }
  .app-shell-private .main-content { padding-top: 22px; }
  .invoice-table .table-action { padding-top: 8px; }
  .app-shell-private .task-copy p { white-space: normal; }
  .app-shell-private .order-position-card, .app-shell-private .order-position-controls, .app-shell-private .order-position-edit-form { display: grid; }
  .app-shell-private .order-position-copy strong, .app-shell-private .order-position-copy .order-position-catalog-link, .app-shell-private .order-position-copy span { white-space: normal; }
}

@media (max-width: 460px) {
  .app-shell-private .workspace-actions { width: 100%; justify-content: stretch; }
  .app-shell-private .workspace-actions .button { flex: 1 1 0; justify-content: center; }
  .app-shell-private .workspace-actions .intake-button { display: flex; }
  .app-shell-private .workspace-actions .new-order-button { font-size: 12px; }
}

/* Die breite Desktop-Regel des Shell-Layouts darf die Positionskarten nicht wieder aufspalten. */
@media (min-width: 1300px) {
  .app-shell-private .order-position-card { min-height: 0; padding: 0; display: block; }
  .app-shell-private .order-position-controls { padding: 11px 14px 13px; display: grid; grid-template-columns: minmax(240px, 1.35fr) minmax(290px, 1fr) auto; align-items: end; gap: 9px; border-top: 1px solid rgba(151, 174, 214, 0.13); }
  .app-shell-private .order-position-edit-form { display: grid; grid-template-columns: repeat(2, minmax(96px, 1fr)) auto; gap: 7px; }
  .app-shell-private .order-position-field { min-width: 0; }
  .app-shell-private .order-position-field input { width: 100%; min-height: 38px; padding: 7px 9px; }
  .app-shell-private .order-position-edit-form .button,
  .app-shell-private .order-position-action .button { min-height: 38px; padding: 7px 10px; }
  .app-shell-private .order-position-line-total { margin: 0; text-align: right; }
}

/* Kompakter Werkstattkalender: Monatsraster bleibt auf schmalen Geräten horizontal lesbar. */
.calendar-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.calendar-heading h1 { margin: 0; font-size: clamp(28px, 4vw, 38px); letter-spacing: -0.04em; }
.calendar-heading .subtitle { margin: 4px 0 0; }
.calendar-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 320px); align-items: start; gap: 16px; }
.calendar-month-panel { overflow: hidden; }
.calendar-month-toolbar { min-height: 58px; display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); text-align: center; }
.calendar-month-toolbar h2 { margin: 0; font-size: 15px; text-transform: capitalize; }
.calendar-weekdays, .calendar-grid { min-width: 630px; display: grid; grid-template-columns: repeat(7, minmax(90px, 1fr)); }
.calendar-weekdays { padding: 10px 0 7px; color: var(--muted); border-bottom: 1px solid var(--border); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.calendar-grid { grid-auto-rows: minmax(104px, auto); }
.calendar-day { min-width: 0; padding: 7px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: rgba(255,255,255,.012); }
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day-outside { background: rgba(0,0,0,.12); color: var(--muted); }
.calendar-day-number { display: block; margin-bottom: 5px; color: var(--muted-strong); font-size: 11px; font-weight: 750; }
.calendar-day-outside .calendar-day-number { opacity: .45; }
.calendar-event { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 4px; align-items: baseline; margin: 3px 0; padding: 3px 4px; color: var(--text-soft); border-left: 2px solid var(--accent); border-radius: 4px; background: var(--accent-surface); font-size: 10px; line-height: 1.28; text-decoration: none; }
.calendar-event:hover, .calendar-event:focus-visible { color: var(--text); background: rgba(91,140,255,.24); outline: none; box-shadow: var(--focus-ring); }
.calendar-event time { color: var(--muted-strong); font-variant-numeric: tabular-nums; }
.calendar-event strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event-dropoff { border-left-color: var(--warning); background: var(--warning-surface); }
.calendar-event-pickup { border-left-color: var(--success); background: var(--success-surface); }
.calendar-agenda { overflow: hidden; }
.calendar-agenda-list { display: grid; gap: 0; padding: 0; margin: 0; list-style: none; }
.calendar-agenda-list li + li { border-top: 1px solid var(--border); }
.calendar-agenda-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; padding: 12px 15px; color: var(--text-soft); text-decoration: none; }
.calendar-agenda-list a:hover, .calendar-agenda-list a:focus-visible { background: var(--surface-hover); outline: none; box-shadow: inset 3px 0 0 var(--accent); }
.calendar-agenda-list time { grid-column: 1 / -1; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.calendar-agenda-list strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.calendar-type-label { align-self: center; padding: 2px 5px; border-radius: 4px; color: var(--accent-bright); background: var(--accent-surface); font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.calendar-type-dropoff { color: var(--warning); background: var(--warning-surface); }.calendar-type-pickup { color: var(--success); background: var(--success-surface); }
.calendar-form { width: min(100%, 880px); display: grid; gap: 12px; }.calendar-form-section { margin: 0; }.calendar-reference-error { margin: 0 0 12px; }
.calendar-core-section, .calendar-links-section { padding: 18px; }.calendar-core-grid, .calendar-links-content { min-width: 0; }.calendar-core-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, .42fr); gap: 12px; }.calendar-title-field { grid-column: 1 / -1; }.calendar-time-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; grid-column: 1 / -1; }.calendar-note-field { grid-column: 1 / -1; }.calendar-note-field span small { color: var(--muted); font-weight: 500; }
.calendar-reference-row { display: grid; grid-template-columns: 86px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 42px; padding: 6px 0; border-bottom: 1px solid var(--border); }
.calendar-reference-kind { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.calendar-reference-value { overflow-wrap: anywhere; color: var(--text-soft); font-size: 13px; }.calendar-reference-empty { color: var(--muted); }.calendar-reference-row [hidden] { display: none !important; }
.calendar-reference-search { padding-top: 12px; }.calendar-reference-search label { color: var(--text-soft); font-size: 12px; font-weight: 720; }.calendar-reference-search-controls { display: grid; grid-template-columns: minmax(115px, .42fr) minmax(0, 1fr) auto; gap: 8px; margin-top: 6px; }
.calendar-reference-results { display: grid; gap: 5px; padding: 0; margin: 9px 0 0; list-style: none; }.calendar-reference-results button { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 10px; align-items: center; padding: 9px 10px; color: var(--text-soft); border: 1px solid var(--border); border-radius: 7px; background: var(--surface); font: inherit; font-size: 12px; text-align: left; cursor: pointer; }.calendar-reference-results button:hover, .calendar-reference-results button:focus-visible { border-color: var(--border-accent); background: var(--surface-hover); outline: none; box-shadow: var(--focus-ring); }.calendar-reference-results strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.calendar-reference-results span:not(:last-child) { color: var(--muted); font-size: 11px; }.calendar-reference-results span:last-child { grid-row: 1 / span 2; grid-column: 2; color: var(--accent-bright); font-size: 11px; }
.calendar-detail-hero { margin-bottom: 16px; }.calendar-detail-grid { margin-bottom: 16px; }.calendar-delete-form { display: flex; justify-content: flex-end; }.button-danger { color: var(--danger); border-color: rgba(255,111,135,.3); }.button-danger:hover, .button-danger:focus-visible { color: #fff; background: var(--danger-surface); border-color: var(--danger); }

@media (max-width: 960px) { .calendar-layout { grid-template-columns: 1fr; }.calendar-agenda { max-width: none; }.calendar-agenda-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }.calendar-agenda-list li + li { border-top: 0; }.calendar-agenda-list li { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }.calendar-agenda-list li:nth-child(2n) { border-right: 0; } }
@media (max-width: 740px) { .calendar-heading { align-items: start; flex-direction: column; margin-bottom: 16px; }.calendar-heading .button { width: 100%; justify-content: center; }.calendar-month-panel { overflow: hidden; }.calendar-weekdays, .calendar-grid { min-width: 0; grid-template-columns: repeat(7, minmax(0, 1fr)); }.calendar-grid { grid-auto-rows: minmax(92px, auto); }.calendar-day { padding: 5px 3px; }.calendar-event { grid-template-columns: 1fr; gap: 1px; padding: 3px; }.calendar-event strong { font-size: 9px; }.calendar-agenda-list { grid-template-columns: 1fr; }.calendar-agenda-list li, .calendar-agenda-list li:nth-child(2n) { border-right: 0; border-bottom: 1px solid var(--border); }.calendar-core-grid, .calendar-time-fields { grid-template-columns: 1fr; }.calendar-core-section, .calendar-links-section { padding: 14px; }.calendar-reference-row { grid-template-columns: 76px minmax(0, 1fr); }.calendar-reference-row .button { grid-column: 2; justify-self: start; }.calendar-reference-search-controls { grid-template-columns: 1fr; }.calendar-reference-search-controls .button { width: 100%; justify-content: center; }.calendar-delete-form { justify-content: stretch; }.calendar-delete-form .button { width: 100%; justify-content: center; } }

/* Mobile-Listen: Identität zuerst, Metadaten in einer kompakten zweiten Ebene. */
@media (max-width: 740px) {
  .entity-list-panel .orders-table tr {
    gap: 3px 12px;
    margin-bottom: 8px;
    padding: 10px 12px;
    border-radius: 10px;
  }

  .entity-list-panel .orders-table td {
    min-height: 0;
    padding: 3px 0;
    line-height: 1.35;
  }

  .entity-list-panel .orders-table td::before {
    margin-bottom: 2px;
    font-size: 9px;
    letter-spacing: 0.09em;
  }

  .entity-list-panel .orders-table td:first-child,
  .entity-list-panel .orders-table td:nth-child(2) { border-bottom: 0; }

  .entity-orders-panel .orders-table tr {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "order status"
      "customer customer"
      "vehicle vehicle"
      "plate lift"
      "acceptance acceptance";
  }

  .entity-orders-panel .orders-table td:nth-child(1) { grid-area: status; align-self: start; justify-self: end; padding-top: 0; }
  .entity-orders-panel .orders-table td:nth-child(2) { grid-area: order; }
  .entity-orders-panel .orders-table td:nth-child(3) { grid-area: customer; }
  .entity-orders-panel .orders-table td:nth-child(4) { display: none; }
  .entity-orders-panel .orders-table td:nth-child(5) { grid-area: vehicle; }
  .entity-orders-panel .orders-table td:nth-child(6) { grid-area: plate; }
  .entity-orders-panel .orders-table td:nth-child(7) { grid-area: lift; }
  .entity-orders-panel .orders-table td:nth-child(8) { grid-area: acceptance; }

  .entity-orders-panel .orders-table td:nth-child(1)::before,
  .entity-orders-panel .orders-table td:nth-child(2)::before,
  .entity-orders-panel .orders-table td:nth-child(5)::before { display: none; }

  .entity-orders-panel .orders-table td:nth-child(n + 6):nth-child(-n + 8) {
    flex-direction: row;
    align-items: center;
    gap: 4px;
    color: var(--muted-strong);
    font-size: 11px;
    white-space: nowrap;
  }

  .entity-orders-panel .orders-table td:nth-child(n + 6):nth-child(-n + 8)::before { margin: 0; }
  .entity-orders-panel .orders-table td:nth-child(7)::before { content: "Bühne"; }
  .entity-orders-panel .orders-table td:nth-child(8)::before { content: "Annahme"; }

  .entity-vehicles-panel .orders-table tr {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
      "identity plate"
      "vehicle customer"
      "inspection inspection";
  }

  .entity-vehicles-panel .orders-table td:nth-child(1) { display: none; }
  .entity-vehicles-panel .orders-table td:nth-child(2) { grid-area: identity; }
  .entity-vehicles-panel .orders-table td:nth-child(3) { grid-area: plate; justify-self: end; }
  .entity-vehicles-panel .orders-table td:nth-child(4) { grid-area: vehicle; }
  .entity-vehicles-panel .orders-table td:nth-child(5) { grid-area: customer; }
  .entity-vehicles-panel .orders-table td:nth-child(6) { grid-area: inspection; }
  .entity-vehicles-panel .orders-table td:nth-child(2)::before,
  .entity-vehicles-panel .orders-table td:nth-child(3)::before { display: none; }
  .entity-vehicles-panel .orders-table td:nth-child(6) {
    flex-direction: row;
    align-items: center;
    gap: 5px;
    color: var(--muted-strong);
    font-size: 11px;
  }
  .entity-vehicles-panel .orders-table td:nth-child(6)::before { margin: 0; }

  .entity-catalog-panel .catalog-table tr {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "identity identity"
      "kind value"
      "action action";
  }

  .entity-catalog-panel .catalog-table td:nth-child(1) { grid-area: identity; }
  .entity-catalog-panel .catalog-table td:nth-child(2) { grid-area: kind; }
  .entity-catalog-panel .catalog-table td:nth-child(3) { grid-area: value; }
  .entity-catalog-panel .catalog-table td:nth-child(4) { grid-area: action; }
  .entity-catalog-panel .catalog-table td:nth-child(1)::before,
  .entity-catalog-panel .catalog-table td:nth-child(2)::before { display: none; }
  .entity-catalog-panel .catalog-table td:nth-child(3) {
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    font-size: 11px;
  }
  .entity-catalog-panel .catalog-table td:nth-child(3)::before { margin: 0; }
  .entity-catalog-panel .catalog-table td.row-action {
    align-items: stretch;
    padding-top: 5px;
  }
  .entity-catalog-panel .catalog-table .row-action a {
    width: max-content;
    min-width: 112px;
    min-height: 44px;
  }
}

@media (max-width: 360px) {
  .entity-orders-panel .orders-table tr {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "order status"
      "customer customer"
      "vehicle vehicle"
      "plate lift"
      "acceptance acceptance";
  }
}

.permission-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  grid-column: 1 / -1;
}
.permission-grid label { display: grid; gap: 4px; font-size: 12px; color: var(--muted-strong); }
.permission-grid.compact { min-width: 420px; grid-template-columns: repeat(2, minmax(160px, 1fr)); }