:root {
  color-scheme: light;
  --bg: #f3f2ef;
  --surface: #ffffff;
  --surface-soft: #fbfaf8;
  --surface-strong: #f7f3f0;
  --line: #d9d6d1;
  --line-soft: #ece6df;
  --text: #1f1d1b;
  --muted: #6f6962;
  --accent: #a41313;
  --button-red: #a41313;
  --accent-dark: #641f14;
  --accent-soft: #f5e8e6;
  --doc-job: #756044;
  --doc-job-dark: #5b4934;
  --doc-job-soft: #f8f5ee;
  --doc-job-border: #eadfce;
  --doc-calculation: #a41313;
  --doc-calculation-dark: #641f14;
  --doc-calculation-soft: #fff4f2;
  --doc-calculation-border: #f1cbc5;
  --doc-offer: #2f5f9f;
  --doc-offer-dark: #254a7d;
  --doc-offer-soft: #edf4ff;
  --doc-offer-border: #d8e2fa;
  --doc-customer-order: #b45f06;
  --doc-customer-order-dark: #874604;
  --doc-customer-order-soft: #fff3e5;
  --doc-customer-order-border: #f0d1aa;
  --doc-work-order: #197247;
  --doc-work-order-dark: #125b39;
  --doc-work-order-soft: #eef8f3;
  --doc-work-order-border: #ccebd9;
  --doc-proforma: #93631b;
  --doc-proforma-dark: #744b11;
  --doc-proforma-soft: #fff7e8;
  --doc-proforma-border: #efdcb8;
  --doc-invoice: #6d4aa0;
  --doc-invoice-dark: #55347f;
  --doc-invoice-soft: #f3edff;
  --doc-invoice-border: #dfd2f4;
  --doc-delivery-note: #2b7777;
  --doc-delivery-note-dark: #1f6262;
  --doc-delivery-note-soft: #edf8f8;
  --doc-delivery-note-border: #cce8e8;
  --shadow-soft: 0 14px 36px rgba(31, 29, 27, 0.08);
  --sidebar-closed: 68px;
  --sidebar-open: 244px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.45;
}

a {
  color: inherit;
  text-decoration: none;
}

.app-sidebar {
  background: #fbfaf8;
  border-right: 1px solid var(--line);
  bottom: 0;
  box-shadow: 12px 0 30px rgba(31, 29, 27, 0.08);
  display: grid;
  gap: 14px;
  grid-template-rows: auto 1fr auto;
  left: 0;
  overflow: hidden;
  padding: 12px 10px;
  position: fixed;
  top: 0;
  transition: width 160ms ease;
  width: var(--sidebar-closed);
  z-index: 20;
}

.app-sidebar:hover,
.sidebar-pinned .app-sidebar {
  width: var(--sidebar-open);
}

.sidebar-top,
.sidebar-user {
  display: grid;
  gap: 10px;
}

.sidebar-top {
  grid-template-columns: minmax(0, 1fr) 40px;
}

.sidebar-brand,
.sidebar-link,
.sidebar-user-card {
  align-items: center;
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 40px minmax(0, 1fr);
  min-height: 40px;
  min-width: 0;
  padding: 0;
}

.sidebar-brand {
  color: var(--accent-dark);
  font-weight: 700;
}

.sidebar-brand-mark,
.sidebar-avatar {
  align-items: center;
  background: var(--accent-dark);
  color: #fff;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  height: 40px;
  justify-content: center;
  width: 40px;
}

.sidebar-avatar {
  background: #e8e3dc;
  color: var(--accent-dark);
}

.sidebar-pin {
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  height: 40px;
  opacity: 0;
  padding: 0;
  transition: opacity 120ms ease, color 120ms ease, background 120ms ease;
  width: 40px;
}

.app-sidebar:hover .sidebar-pin,
.sidebar-pinned .sidebar-pin {
  opacity: 1;
}

.sidebar-pin:hover,
.sidebar-pin[aria-pressed="true"] {
  background: #eee9e2;
  color: var(--accent-dark);
}

.sidebar-nav {
  align-content: start;
  align-self: start;
  display: grid;
  gap: 4px;
  grid-auto-rows: 40px;
}

.sidebar-link {
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  font-weight: 700;
  height: 40px;
  justify-content: stretch;
  overflow: hidden;
  padding-right: 12px;
  text-align: left;
}

.sidebar-link:hover,
.sidebar-link.is-active {
  background: #eee9e2;
  color: var(--accent-dark);
}

.sidebar-link.is-active {
  border-color: #dfd7ce;
}

.sidebar-link svg,
.sidebar-pin svg {
  fill: none;
  height: 21px;
  justify-self: center;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 21px;
}

.sidebar-label {
  opacity: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity 120ms ease;
  white-space: nowrap;
}

.app-sidebar:hover .sidebar-label,
.sidebar-pinned .sidebar-label {
  opacity: 1;
}

.sidebar-link:has(.sidebar-count-badge) {
  grid-template-columns: 40px minmax(0, 1fr) auto;
}

.sidebar-count-badge {
  align-items: center;
  background: var(--accent);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  height: 21px;
  justify-content: center;
  min-width: 21px;
  opacity: 0;
  padding: 0 6px;
  transition: opacity 120ms ease;
}

.app-sidebar:hover .sidebar-count-badge,
.sidebar-pinned .sidebar-count-badge {
  opacity: 1;
}

.sidebar-user {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.sidebar-user-name {
  color: var(--text);
  font-weight: 700;
}

.app-notifications {
  min-width: 0;
  position: relative;
}

.sidebar-notification-button {
  position: relative;
  width: 100%;
}

.notification-unread-badge {
  align-items: center;
  background: var(--accent);
  border: 2px solid #fbfaf8;
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  height: 20px;
  justify-content: center;
  left: 28px;
  min-width: 20px;
  padding: 0 5px;
  position: absolute;
  top: -3px;
}

.notification-unread-badge[hidden],
[data-notification-read-all][hidden] {
  display: none;
}

.notification-popover {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  bottom: 22px;
  box-shadow: 0 24px 60px rgba(31, 29, 27, 0.2);
  left: calc(var(--sidebar-closed) + 12px);
  max-height: min(620px, calc(100vh - 44px));
  overflow: hidden;
  position: fixed;
  width: min(390px, calc(100vw - var(--sidebar-closed) - 30px));
  z-index: 80;
}

.notification-popover-header {
  align-items: center;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 15px 16px;
}

.notification-popover-header div {
  display: grid;
  gap: 2px;
}

.notification-popover-header span {
  color: var(--muted);
  font-size: 12px;
}

.notification-list {
  display: grid;
  max-height: min(520px, calc(100vh - 125px));
  overflow-y: auto;
}

.notification-item {
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  color: var(--text);
  cursor: pointer;
  display: grid;
  gap: 5px;
  padding: 14px 16px;
  text-align: left;
  width: 100%;
}

.notification-item:hover,
.notification-item:focus-visible {
  background: #f8f5f1;
}

.notification-item.is-unread {
  background: #fff5f3;
  box-shadow: inset 4px 0 0 var(--accent);
}

.notification-item strong,
.notification-item span {
  line-height: 1.35;
}

.notification-item span {
  color: #4f4843;
  font-size: 13px;
}

.notification-item small {
  color: var(--muted);
  font-size: 11px;
}

.notification-empty {
  color: var(--muted);
  margin: 0;
  padding: 22px 16px;
  text-align: center;
}

.app-notification-toast {
  background: #fff;
  border: 1px solid var(--line);
  border-left: 5px solid var(--accent);
  border-radius: 10px;
  box-shadow: 0 20px 55px rgba(31, 29, 27, 0.22);
  color: var(--text);
  cursor: pointer;
  display: grid;
  gap: 4px;
  max-width: min(390px, calc(100vw - 32px));
  opacity: 0;
  padding: 14px 16px;
  position: fixed;
  right: 18px;
  text-align: left;
  top: 18px;
  transform: translateY(-10px);
  transition: opacity 160ms ease, transform 160ms ease;
  width: 390px;
  z-index: 100;
}

.app-notification-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.app-notification-toast span {
  color: #4f4843;
  font-size: 13px;
  line-height: 1.4;
}

.sidebar-logout-form {
  margin: 0;
}

.sidebar-logout {
  cursor: pointer;
  font: inherit;
  width: 100%;
}

button {
  align-items: center;
  background: var(--accent);
  border: 1px solid var(--accent);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  justify-content: center;
  padding: 8px 12px;
  text-align: center;
}

input,
select,
textarea {
  border: 1px solid var(--line);
  font: inherit;
  padding: 9px 10px;
  width: 100%;
}

select {
  background: #fff;
}

.page {
  margin: 0 auto;
  max-width: 1180px;
  padding: 28px 24px;
}

.app-clock-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-end;
  text-align: right;
  gap: 4px 16px;
  margin-bottom: 16px;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--muted);
}

.app-clock-bar[hidden] {
  display: none;
}

.app-clock-time {
  color: var(--text);
  font-size: 24px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.app-clock-date {
  font-size: 16px;
}

@media print {
  .app-clock-bar {
    display: none;
  }
}

.has-sidebar .page {
  margin-left: var(--sidebar-closed);
  max-width: none;
  padding-left: 28px;
  padding-right: 28px;
  transition: margin-left 160ms ease;
}

.app-version-footer {
  color: #8a8179;
  font-size: 11px;
  margin: 4px auto 18px;
  max-width: 1180px;
  padding: 0 24px;
  text-align: center;
}

.has-sidebar .app-version-footer {
  margin-left: var(--sidebar-closed);
  max-width: none;
  padding-left: 28px;
  padding-right: 28px;
  transition: margin-left 160ms ease;
}

.sidebar-pinned .page {
  margin-left: var(--sidebar-open);
}

.sidebar-pinned .app-version-footer {
  margin-left: var(--sidebar-open);
}

.page-title {
  margin-bottom: 18px;
}

.page-title-row {
  align-items: flex-end;
  display: flex;
  justify-content: space-between;
}

.detail-page-title {
  align-items: start;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(251, 250, 248, 0.92)),
    var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  gap: 18px;
  margin-bottom: 18px;
  padding: 18px;
}

.detail-page-title .workflow-links {
  margin-bottom: 6px;
}

.detail-page-title h1 {
  max-width: 920px;
}

.page-title h1,
.auth-panel h1,
.table-section h2,
.info-panel h2 {
  margin: 0;
}

.page-title h1 {
  color: #151312;
  font-size: 30px;
  font-weight: 760;
  line-height: 1.1;
}

.back-link {
  color: var(--muted);
  display: inline-block;
  margin-bottom: 6px;
}

.workflow-links {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
}

.auth-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  margin: 72px auto;
  max-width: 380px;
  padding: 24px;
}

.form-stack {
  display: grid;
  gap: 16px;
  margin-top: 20px;
}

.form-stack label {
  color: var(--muted);
  display: grid;
  gap: 6px;
}

.form-stack .checkbox-label {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: flex-start;
  justify-self: start;
  white-space: nowrap;
}

.form-stack .checkbox-label input[type="checkbox"] {
  appearance: none;
  background: #fff;
  border: 1.5px solid var(--accent);
  border-radius: 4px;
  cursor: pointer;
  flex: 0 0 auto;
  height: 16px;
  margin: 0;
  padding: 0;
  position: relative;
  transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
  width: 16px;
}

.form-stack .checkbox-label input[type="checkbox"]::before {
  background: #fff;
  clip-path: polygon(14% 44%, 0 60%, 38% 100%, 100% 18%, 84% 0, 36% 66%);
  content: "";
  height: 9px;
  left: 3px;
  position: absolute;
  top: 2px;
  transform: scale(0);
  transition: transform 120ms ease;
  width: 9px;
}

.form-stack .checkbox-label input[type="checkbox"]:checked {
  background: var(--accent);
  border-color: var(--accent);
}

.form-stack .checkbox-label input[type="checkbox"]:checked::before {
  transform: scale(1);
}

.form-stack .checkbox-label input[type="checkbox"]:focus-visible {
  box-shadow: 0 0 0 3px rgba(164, 19, 19, 0.2);
  outline: 0;
}

.wide-form {
  gap: 18px;
}

.job-workspace {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 320px;
  margin-top: 20px;
}

.job-workspace-main {
  margin-top: 0;
  min-width: 0;
}

.job-command-title {
  align-items: center;
  background:
    linear-gradient(135deg, rgba(164, 19, 19, 0.06), transparent 48%),
    var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  gap: 18px;
  justify-content: space-between;
  padding: 18px;
}

.job-command-title h1 {
  margin-bottom: 0;
}

.job-title-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.job-meta-chip {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #514942;
  display: inline-flex;
  font-size: 12px;
  font-weight: 750;
  gap: 5px;
  min-height: 28px;
  padding: 0 10px;
  white-space: nowrap;
}

.job-meta-chip-status {
  background: var(--accent-soft);
  border-color: rgba(164, 19, 19, 0.22);
  color: var(--accent-dark);
}

.job-command-flow {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 14px;
  padding: 12px;
}

.job-flow-step {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  color: var(--text);
  display: grid;
  gap: 2px;
  min-height: 62px;
  padding: 10px 10px 10px 14px;
  position: relative;
}

.job-flow-step::before {
  background: var(--line);
  border-radius: 7px 0 0 7px;
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  top: 0;
  width: 4px;
}

.job-flow-step:hover {
  border-color: rgba(164, 19, 19, 0.25);
  box-shadow: 0 10px 24px rgba(31, 29, 27, 0.08);
}

.job-flow-step.is-done::before {
  background: #2f7a62;
}

.job-flow-step.is-next {
  background: #fff8f6;
  border-color: rgba(164, 19, 19, 0.28);
}

.job-flow-step.is-next::before {
  background: var(--accent);
}

.job-flow-step-kicker {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
}

.job-flow-step strong {
  display: block;
  font-size: 13px;
  line-height: 1.15;
}

.job-flow-step small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-command-overview-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(280px, 0.82fr) minmax(360px, 1.18fr);
  margin-bottom: 18px;
}

.compact-section-header {
  margin-bottom: 10px;
}

.job-linked-doc-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.job-linked-doc-tile {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  display: grid;
  gap: 4px;
  min-height: 70px;
  padding: 10px;
}

.job-linked-doc-tile:hover {
  border-color: rgba(164, 19, 19, 0.25);
  box-shadow: 0 10px 24px rgba(31, 29, 27, 0.08);
}

.job-linked-doc-tile.is-ready {
  background: #fbfdfb;
  border-color: rgba(47, 122, 98, 0.22);
}

.job-linked-doc-tile span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.job-linked-doc-tile strong {
  color: var(--text);
  font-size: 14px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.job-side-column {
  display: grid;
  gap: 12px;
  position: sticky;
  top: 18px;
}

.context-side-column {
  position: sticky;
}

.context-sidebar-rail {
  display: none;
}

.context-sidebar-rail-button {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--accent-dark);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  justify-content: center;
  padding: 0;
}

.context-sidebar-rail-button svg {
  fill: none;
  flex: 0 0 auto;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 18px;
}

.context-sidebar-rail-button:hover,
.context-sidebar-pin[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.context-sidebar-pin span {
  display: none;
}

.material-manual-price-override {
  margin-top: 0.8rem;
  padding: 0.9rem;
  border: 1px solid #d99a2b;
  border-radius: 10px;
  background: #fff8e8;
}

.material-manual-price-override > p {
  margin: 0.25rem 0 0.75rem;
  color: #73510f;
}

.actual-cost-form {
  margin: 1rem 0;
  padding: 1rem;
  border-radius: 12px;
  background: var(--surface-muted, #f5f7f8);
}

/* Material catalog cleanup control center. */
.material-cleanup-metrics {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 1rem 0;
}

.material-cleanup-metrics .metric-card {
  background: var(--surface, #fff);
  border: 1px solid var(--line, #dfe3e8);
  border-radius: 12px;
  color: inherit;
  display: grid;
  gap: 0.4rem;
  min-width: 0;
  padding: 0.9rem 1rem;
  text-decoration: none;
}

.material-cleanup-metrics .metric-card span {
  color: var(--muted, #667085);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
}

.material-cleanup-metrics .metric-card strong {
  font-size: 1.65rem;
  line-height: 1;
}

.material-cleanup-metrics .metric-card.is-active {
  border-color: var(--accent, #155eef);
  box-shadow: 0 0 0 1px var(--accent, #155eef);
}

.cleanup-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1rem 0;
}

.cleanup-tabs .is-active {
  border-color: var(--accent, #155eef);
  color: var(--accent, #155eef);
}

.cleanup-canonical-preview {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.75rem;
  margin: 0.75rem 0;
  padding: 0.65rem 0.8rem;
  border-left: 3px solid var(--accent, #155eef);
  background: var(--surface-subtle, #f5f7fa);
}

.cleanup-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.55rem;
}

.cleanup-source-actions .button-secondary {
  min-height: 32px;
  padding: 0.35rem 0.6rem;
}

.cleanup-source-missing {
  align-self: center;
  white-space: nowrap;
}

.cleanup-source-suggestions {
  flex: 1 0 100%;
  min-width: min(22rem, 100%);
}

.cleanup-source-suggestions summary {
  color: var(--accent, #a41313);
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 800;
}

.cleanup-source-suggestions > p {
  line-height: 1.4;
  margin: 0.55rem 0;
}

.cleanup-source-suggestion {
  align-items: center;
  border-top: 1px solid var(--line, #dfe3e8);
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  padding: 0.55rem 0;
}

.cleanup-source-suggestion > div:first-child {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.cleanup-source-suggestion form,
.cleanup-ocr-actions form {
  margin: 0;
}

.cleanup-ocr-actions {
  align-items: center;
  flex-wrap: wrap;
}

.cleanup-newer-source-notice {
  align-items: center;
  background: #f1faf4;
  border-color: #b8ddc2;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}

.cleanup-newer-source-notice h3,
.cleanup-newer-source-notice p {
  margin: 0;
}

.cleanup-source-dialog {
  background: var(--surface, #fff);
  border: 1px solid var(--line, #dfe3e8);
  box-shadow: 0 24px 70px rgb(0 0 0 / 28%);
  height: min(88vh, 980px);
  max-height: calc(100vh - 32px);
  max-width: calc(100vw - 32px);
  padding: 0;
  width: min(1160px, calc(100vw - 32px));
}

.cleanup-source-dialog::backdrop {
  background: rgb(0 0 0 / 42%);
}

.cleanup-source-dialog[open] {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.cleanup-source-dialog-header {
  align-items: center;
  border-bottom: 1px solid var(--line, #dfe3e8);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 0.9rem 1rem;
}

.cleanup-source-dialog-header h2,
.cleanup-source-dialog-header p {
  margin: 0;
}

.cleanup-source-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
}

.cleanup-source-dialog-note {
  background: var(--surface-subtle, #f5f7fa);
  border-bottom: 1px solid var(--line, #dfe3e8);
  margin: 0;
  padding: 0.6rem 1rem;
}

.cleanup-source-dialog iframe {
  border: 0;
  display: block;
  height: 100%;
  min-height: 0;
  width: 100%;
}

.cleanup-case-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.cleanup-case-actions form,
.cleanup-price-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.65rem;
}

.cleanup-case-actions label {
  flex: 1 1 14rem;
}

.cleanup-price-actions input,
.cleanup-price-actions select {
  min-width: 11rem;
}

.cleanup-price-actions label small {
  color: var(--muted, #667085);
  display: block;
  font-size: 0.72rem;
  font-weight: 500;
  margin-top: 0.15rem;
}

.cleanup-price-action-hint {
  color: var(--muted, #667085);
  flex: 1 0 100%;
  font-size: 0.78rem;
  margin: 0;
}

@media (max-width: 720px) {
  .material-cleanup-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cleanup-case-actions {
    grid-template-columns: 1fr;
  }

  .cleanup-source-dialog {
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px);
    max-width: calc(100vw - 16px);
    width: calc(100vw - 16px);
  }

  .cleanup-source-dialog-header {
    align-items: stretch;
    flex-direction: column;
  }

  .cleanup-source-dialog-actions {
    justify-content: stretch;
  }

  .cleanup-source-dialog-actions > * {
    flex: 1 1 auto;
    text-align: center;
  }

  .cleanup-case-actions form,
  .cleanup-price-actions,
  .cleanup-source-suggestion,
  .cleanup-newer-source-notice {
    align-items: stretch;
    flex-direction: column;
  }

  .cleanup-case-actions label,
  .cleanup-price-actions input,
  .cleanup-price-actions select,
  .cleanup-price-actions button {
    width: 100%;
    min-width: 0;
  }
}

.external-calculation-action-dock {
  display: none;
}

.job-summary-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  display: grid;
  gap: 16px;
  padding: 18px;
}

.job-summary-panel h2 {
  font-size: 20px;
  margin: 0;
}

.job-context-panel h2 {
  margin: 0 0 0.85rem;
  font-size: 1.05rem;
}

.job-context-group + .job-context-group {
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--color-border, #e7ded8);
}

.job-context-group h3 {
  margin: 0 0 0.55rem;
  color: #7b1518;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.job-context-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0;
}

.job-context-row + .job-context-row {
  border-top: 1px solid #eee7e2;
}

.job-context-row > div {
  min-width: 0;
  display: grid;
  gap: 0.18rem;
}

.job-context-row strong,
.job-context-row span,
.job-context-row small {
  overflow-wrap: anywhere;
}

.job-context-row span {
  font-size: 0.88rem;
}

.job-context-row small {
  color: var(--color-muted, #766f6a);
  font-size: 0.74rem;
}

.job-context-link {
  flex: 0 0 auto;
  color: #a10f14;
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: none;
}

.job-context-link:hover,
.job-context-link:focus-visible {
  text-decoration: underline;
}

.summary-eyebrow {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
  margin: 0;
  text-transform: uppercase;
}

.sidebar-section-title {
  color: var(--accent);
  font-size: 18px;
  margin-bottom: 4px;
}

.summary-list {
  display: grid;
  gap: 9px 14px;
  grid-template-columns: 96px minmax(0, 1fr);
  margin: 0;
}

.summary-list dt {
  color: var(--muted);
}

.summary-list dd {
  margin: 0;
}

.inline-summary-list {
  grid-template-columns: repeat(3, auto minmax(0, 1fr));
}

.summary-total-box {
  background: var(--accent);
  color: #fff;
  display: grid;
  gap: 6px;
  padding: 16px;
}

.summary-total-box span {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.summary-total-box small {
  color: rgba(255, 255, 255, 0.84);
  font-size: 12px;
  font-weight: 700;
}

.summary-total-box strong {
  font-size: 26px;
}

.summary-actions {
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.job-workspace-bottom-actions {
  display: flex;
}

.job-save-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 14px 18px;
}

.form-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 14px;
}

.standalone-type-form {
  align-items: end;
  grid-template-columns: minmax(0, 1fr) auto;
}

.standalone-type-action {
  align-self: end;
}

.standalone-type-action button {
  min-height: 40px;
}

.standalone-edit-context {
  display: grid;
  gap: 4px;
}

.standalone-edit-context > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.standalone-edit-context > strong {
  font-size: 18px;
}

.standalone-edit-context > p {
  color: var(--muted);
  margin: 2px 0 0;
}

.client-lookup-wide {
  grid-column: 1 / -1;
}

.job-intake-grid {
  align-items: stretch;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 3fr) minmax(300px, 2fr);
}

.job-intake-grid > .info-panel {
  margin: 0;
}

.job-client-stack,
.job-date-stack {
  display: grid;
  gap: 12px;
}

.job-date-field {
  display: grid;
  gap: 6px;
}

.job-deadline-field {
  background: rgba(164, 19, 19, 0.06);
  border: 1px solid rgba(164, 19, 19, 0.22);
  border-left: 4px solid var(--accent);
  border-radius: 6px;
  padding: 10px 12px 12px;
}

.job-deadline-field > span {
  color: var(--accent);
  font-weight: 800;
}

.job-deadline-field input {
  border-color: rgba(164, 19, 19, 0.35);
}

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

.client-form {
  max-width: 1120px;
}

.client-role-options {
  gap: 8px;
  margin-top: 0;
}

.client-role-options .field-label {
  color: var(--muted);
}

.client-role-checkboxes {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
}

.client-directory-table {
  overflow-x: auto;
}

@media (max-width: 1050px) {
  .client-directory-secondary {
    display: none;
  }
}

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

.material-name-suggest-button {
  align-self: stretch;
  white-space: nowrap;
}

.full-row {
  grid-column: 1 / -1;
}

.job-basic-grid {
  display: grid;
  gap: 14px 16px;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.85fr);
}

.job-title-wide,
.job-notes-wide {
  grid-column: 1 / -1;
}

.job-contact-column,
.job-date-column {
  display: grid;
  gap: 12px;
}

.job-date-column {
  align-content: start;
  background: #fbfaf8;
  border: 1px solid var(--line);
  padding: 14px;
}

.date-emphasis {
  color: var(--accent-dark);
  font-weight: 700;
}

.date-emphasis input {
  color: var(--text);
  font-weight: 400;
}

.combobox {
  position: relative;
}

.combobox-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px;
}

.combobox-control input {
  border-right: 0;
}

.combobox-toggle {
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--text);
  padding: 0;
  position: relative;
}

.combobox-toggle::after {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid var(--text);
  content: "";
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -35%);
}

.combobox-list {
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: 0 12px 24px rgba(31, 29, 27, 0.16);
  display: grid;
  left: 0;
  max-height: 280px;
  overflow-y: auto;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 20;
}

.combobox-list[hidden] {
  display: none;
}

.combobox-list button {
  background: var(--surface);
  border: 0;
  color: var(--text);
  display: block;
  justify-content: flex-start;
  padding: 8px 10px;
  text-align: left;
}

.combobox-list .combobox-option-meta {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 400;
  margin-top: 2px;
}

.combobox-list button:hover,
.combobox-list button.is-active {
  background: #f0eeeb;
}

.combobox-list .client-combobox-option {
  align-items: baseline;
  column-gap: 10px;
  display: flex;
  min-width: 0;
}

.client-combobox-option .combobox-option-label {
  flex: 0 0 auto;
  font-weight: 700;
}

.client-combobox-option .combobox-option-meta {
  color: var(--muted);
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 400;
  gap: 4px 8px;
  min-width: 0;
}

.client-combobox-option .combobox-option-meta span + span::before {
  color: var(--line-strong);
  content: "·";
  margin-right: 8px;
}

.external-floating-combobox-list {
  bottom: auto;
  position: fixed;
  right: auto;
  top: auto;
  z-index: 1200;
}

.combobox-empty {
  color: var(--muted);
  padding: 9px 10px;
}

.date-quick-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.date-quick-field input {
  border-right: 0;
}

.date-today-button {
  min-width: 64px;
}

.request-block {
  border-top: 1px solid var(--line);
  padding: 16px 0 6px;
}

.request-block:first-child .request-remove {
  display: none;
}

.request-block-header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
}

.request-block h3 {
  margin: 0;
}

.request-config-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin-bottom: 14px;
}

.request-config-primary-grid {
  grid-template-columns: minmax(240px, 420px);
}

.request-template-field {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) 40px;
}

.template-add-button {
  align-items: center;
  display: flex;
  height: 39px;
  justify-content: center;
  padding: 0;
  width: 40px;
}

.template-add-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.request-type-fields {
  border: 1px solid var(--line);
  margin-top: 12px;
  padding: 14px;
}

.request-type-fields-header {
  border-bottom: 1px solid var(--line);
  margin-bottom: 14px;
  padding-bottom: 10px;
}

.request-type-fields-header h4 {
  font-size: 14px;
  margin: 0;
}

.request-type-fields-header span {
  color: var(--accent-dark);
}

.request-title-field {
  background: #fbf7f5;
  border: 1px solid var(--line);
  grid-column: 1 / -1;
  padding: 12px;
}

.request-title-field input {
  font-size: 18px;
  font-weight: 700;
}

.request-type-specific-panel {
  background: #fbf7f5;
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 14px;
}

.request-type-specific-panel[hidden] {
  display: none;
}

.request-type-specific-panel h5 {
  color: var(--accent-dark);
  font-size: 14px;
  margin: 0 0 12px;
}

.request-advanced-fields {
  border-top: 1px solid var(--line);
  margin-top: 16px;
  padding-top: 12px;
}

.request-advanced-fields > summary {
  align-items: center;
  color: var(--muted);
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: space-between;
  list-style: none;
  min-height: 34px;
}

.request-advanced-fields > summary::-webkit-details-marker {
  display: none;
}

.request-advanced-fields > summary::after {
  color: var(--accent-dark);
  content: "Prikaži";
  font-size: 12px;
  font-weight: 700;
}

.request-advanced-fields[open] > summary::after {
  content: "Sakrij";
}

.request-advanced-fields-body {
  display: grid;
  gap: 12px;
  padding-top: 10px;
}

.request-advanced-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.request-manual-advanced-panel {
  margin-top: 0;
}

.request-manual-advanced-panel .form-grid {
  margin-bottom: 0;
}

.request-print-fields {
  margin-bottom: 12px;
}

.request-field-help {
  color: var(--muted);
  display: block;
  font-size: 12px;
  line-height: 1.4;
  margin-top: 5px;
}

.request-material-options button,
.request-finishing-options button {
  align-items: center;
  display: grid;
  gap: 3px 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.request-material-options .combobox-option-label,
.request-finishing-options .combobox-option-label {
  font-weight: 700;
  min-width: 0;
}

.request-option-status {
  border: 1px solid var(--line);
  margin: 0;
  padding: 3px 6px;
  white-space: nowrap;
}

.request-option-status.is-ready {
  background: #edf7ef;
  border-color: #bdd9c3;
  color: #2f6b3d;
}

.request-option-status.is-review {
  background: #fff6e7;
  border-color: #e7c98f;
  color: #875b12;
}

.request-option-status.is-history {
  background: #f0eeeb;
  color: var(--muted);
}

.request-finishing-field {
  display: grid;
  gap: 6px;
}

.request-finishing-picker {
  position: relative;
}

.request-finishing-control {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  display: grid;
  gap: 6px;
  grid-template-columns: auto minmax(110px, 1fr) 38px;
  min-height: 42px;
  padding-left: 7px;
}

.request-finishing-control:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgb(164 19 19 / 10%);
}

.request-finishing-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.request-finishing-control > input {
  border: 0;
  min-width: 110px;
  padding-left: 2px;
}

.request-finishing-control > input:focus {
  outline: 0;
}

.request-finishing-control .combobox-toggle {
  align-self: stretch;
  border-bottom: 0;
  border-right: 0;
  border-top: 0;
}

.request-finishing-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-top: 6px;
}

.request-finishing-actions .request-field-help {
  margin: 0;
}

.request-finishing-actions button {
  flex: 0 0 auto;
}

.request-finishing-dialog {
  border: 0;
  box-shadow: 0 24px 70px rgb(31 29 27 / 24%);
  max-width: min(680px, calc(100vw - 32px));
  padding: 0;
  width: 100%;
}

.request-finishing-dialog::backdrop {
  background: rgb(31 29 27 / 44%);
}

.request-finishing-dialog form {
  margin: 0;
}

.request-finishing-dialog-header,
.request-finishing-dialog-footer {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 18px 20px;
}

.request-finishing-dialog-header {
  border-bottom: 1px solid var(--line);
}

.request-finishing-dialog-header h2,
.request-finishing-dialog-header p {
  margin: 0;
}

.request-finishing-dialog-header > div > p:last-child {
  color: var(--muted);
  margin-top: 5px;
}

.request-finishing-dialog-body {
  padding: 20px;
}

.request-finishing-dialog-footer {
  border-top: 1px solid var(--line);
  justify-content: flex-end;
}

.request-finishing-dialog-error {
  background: #fff0ee;
  border: 1px solid #e6b5ae;
  color: var(--accent-dark);
  margin: 0;
  padding: 10px 12px;
}

@media (max-width: 720px) {
  .request-material-options button,
  .request-finishing-options button {
    align-items: start;
    grid-template-columns: 1fr;
  }

  .request-option-status {
    justify-self: start;
  }

  .request-finishing-actions,
  .request-finishing-dialog-header {
    align-items: stretch;
    flex-direction: column;
  }

  .request-finishing-actions button,
  .request-finishing-dialog-header > button {
    width: 100%;
  }
}

.request-quantity-unit {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) minmax(92px, 0.33fr);
}

.form-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.sales-document-unsaved-message {
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.sales-document-unsaved-message:not([hidden]) {
  display: inline-flex;
}

.form-actions-fill {
  display: grid;
  grid-template-columns: 1fr;
}

.form-actions-fill > * {
  width: 100%;
}

.duplicate-search-form {
  align-items: end;
}

.duplicate-search-actions {
  align-self: end;
  justify-content: flex-end;
}

.section-heading-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.section-heading-row h2 {
  margin: 0;
}

.selected-table-row {
  background: #fbefec;
  box-shadow: inset 4px 0 0 var(--accent);
}

.calculation-link-summary-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.calculation-link-summary-grid div {
  background: #fbfaf8;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
  padding: 12px;
}

.calculation-link-summary-grid span,
.calculation-link-request-card small {
  color: var(--muted);
}

.calculation-link-request-list {
  display: grid;
  gap: 10px;
}

.calculation-link-request-card {
  align-items: flex-start;
  background: #fbfaf8;
  border: 1px solid var(--line);
  cursor: pointer;
  display: flex;
  gap: 10px;
  padding: 12px;
}

.calculation-link-request-card:has(input:checked) {
  border-color: var(--accent);
  box-shadow: inset 4px 0 0 var(--accent);
}

.calculation-link-request-card input {
  margin-top: 3px;
  width: auto;
}

.calculation-link-request-card span {
  display: grid;
  gap: 4px;
}

.offer-edit-items {
  display: grid;
  gap: 14px;
}

.offer-edit-item {
  background: #fbfaf8;
  border: 1px solid var(--line);
  padding: 16px;
}

.offer-edit-item h3 {
  color: var(--accent-dark);
  margin: 0;
}

.offer-service-summary-grid {
  grid-template-columns: 1fr;
}

.offer-service-subject-field input {
  color: #151312;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.2;
  padding: 12px 14px;
}

.offer-source-panel {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.offer-source-panel h2 {
  margin-bottom: 4px;
}

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

.offer-add-item-menu {
  position: relative;
}

.offer-add-item-menu > summary {
  cursor: pointer;
  list-style: none;
}

.offer-add-item-menu > summary::-webkit-details-marker {
  display: none;
}

.offer-add-item-menu-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: 0 18px 38px rgba(57, 45, 36, 0.16);
  display: grid;
  gap: 6px;
  min-width: 190px;
  padding: 8px;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
}

.offer-add-item-menu-panel button {
  background: #fff;
  border: 1px solid var(--line);
  color: var(--text);
  justify-content: flex-start;
  text-align: left;
}

.section-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.messages {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.message {
  background: #fff4f4;
  border: 1px solid #e8b8b8;
  padding: 10px 12px;
}

.stats-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 24px;
}

.stats-grid article {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 16px;
}

.stats-grid span {
  color: var(--muted);
  display: block;
  margin-bottom: 8px;
}

.stats-grid strong {
  font-size: 28px;
}

.table-section {
  background: var(--surface);
  border: 1px solid var(--line);
  max-width: 100%;
  min-width: 0;
  margin-bottom: 18px;
  padding: 18px;
}

.table-section > .table-scroll {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}

.business-list-section {
  border-color: var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  padding: 16px 16px 18px;
}

.table-section h2 {
  font-size: 18px;
  margin-bottom: 14px;
}

.section-header {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  margin-bottom: 14px;
}

.section-header h2 {
  margin-bottom: 0;
}

.section-hint {
  color: var(--muted);
  margin: 4px 0 0;
}

.section-header span {
  color: var(--muted);
}

.section-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 190px;
}

.table-actions form {
  margin: 0;
}

.table-actions button,
.table-actions a {
  min-height: 34px;
}

.material-price-table .material-price-cell {
  min-width: 170px;
}

.material-price-table .material-price-cell strong {
  display: block;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.material-price-source {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
  margin-top: 4px;
}

.sales-document-suggestions {
  border-top: 1px solid var(--line-soft);
  margin-top: 14px;
  padding-top: 12px;
}

.sales-document-note-workspace {
  display: grid;
  gap: 0;
  grid-template-columns: 1fr;
}

.sales-document-note-workspace.has-note-suggestions {
  grid-template-columns: minmax(260px, var(--sales-document-note-left-column, 58%)) 14px minmax(220px, 1fr);
}

.sales-document-note-text-column,
.sales-document-note-suggestions {
  min-width: 0;
}

.sales-document-note-text-column {
  align-content: start;
  display: grid;
  gap: 12px;
}

.sales-document-legal-note {
  display: block;
}

.sales-document-legal-note textarea {
  min-height: 96px;
}

.sales-document-additional-note textarea {
  min-height: 170px;
}

.sales-document-note-suggestions {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}

.sales-document-note-filter {
  display: block;
  margin-bottom: 10px;
}

.sales-document-note-column-resizer {
  align-self: stretch;
  background: transparent;
  border: 0;
  cursor: col-resize;
  display: none;
  min-height: 80px;
  min-width: 14px;
  padding: 0;
  position: relative;
  touch-action: none;
}

.sales-document-note-workspace.has-note-suggestions .sales-document-note-column-resizer {
  display: block;
}

.sales-document-note-column-resizer::before {
  background: var(--line-soft);
  border-radius: 999px;
  content: "";
  inset: 0 auto 0 50%;
  position: absolute;
  transform: translateX(-50%);
  transition: background 0.15s ease, box-shadow 0.15s ease, width 0.15s ease;
  width: 2px;
}

.sales-document-note-column-resizer:hover::before,
.sales-document-note-column-resizer:focus-visible::before,
body.is-resizing-sales-document-note-columns .sales-document-note-column-resizer::before {
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.08);
  width: 4px;
}

.sales-document-item-suggestions {
  border-top: 1px solid var(--line-soft);
  margin: 12px 0 0;
  padding: 12px 0 0;
}

.sales-document-items-workspace {
  align-items: start;
  display: grid;
  gap: 0;
  grid-template-columns: minmax(360px, var(--sales-document-left-column, 50%)) 16px minmax(360px, 1fr);
}

.sales-document-items-column {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.sales-document-price-panel,
.sales-document-items-panel,
.sales-document-summary-card {
  min-width: 0;
}

.sales-document-items-panel h2,
.sales-document-price-panel h2,
.sales-document-summary-card h2 {
  margin-top: 0;
}

.sales-document-due-field {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) 88px;
}

.sales-document-due-field select {
  min-width: 0;
}

.sales-document-client-select-native {
  height: 1px;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.sales-document-client-combobox {
  width: 100%;
}

.sales-document-summary-header {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.sales-document-summary-header p {
  color: var(--muted);
  font-size: 13px;
  margin: 2px 0 0;
  max-width: 260px;
  text-align: right;
}

.sales-document-summary-metrics {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 14px 0;
}

.sales-document-summary-metrics div {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: 10px;
}

.sales-document-summary-metrics span,
.sales-document-summary-products span {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.sales-document-summary-metrics strong {
  display: block;
  font-size: 17px;
  margin-top: 4px;
}

.sales-document-summary-card h3 {
  font-size: 14px;
  margin: 0 0 8px;
}

.sales-document-summary-products {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sales-document-summary-products li {
  border-top: 1px solid var(--line-soft);
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding-top: 7px;
}

.sales-document-summary-products strong {
  text-align: right;
}

.sales-document-column-resizer {
  align-self: stretch;
  background: transparent;
  border: 0;
  cursor: col-resize;
  min-height: 80px;
  min-width: 16px;
  padding: 0;
  position: relative;
  touch-action: none;
}

.sales-document-column-resizer::before {
  background: var(--line-soft);
  border-radius: 999px;
  content: "";
  inset: 0 auto 0 50%;
  position: absolute;
  transform: translateX(-50%);
  transition: background 0.15s ease, box-shadow 0.15s ease, width 0.15s ease;
  width: 2px;
}

.sales-document-column-resizer:hover::before,
.sales-document-column-resizer:focus-visible::before,
body.is-resizing-sales-document-columns .sales-document-column-resizer::before {
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.08);
  width: 4px;
}

.sales-document-items-table-wrap {
  overflow-x: auto;
}

.sales-document-items-table {
  table-layout: fixed;
  min-width: 1140px;
}

.sales-document-items-table col[data-sales-document-item-column="line"] {
  width: var(--sales-document-item-line-width, 48px);
}

.sales-document-items-table col[data-sales-document-item-column="product"] {
  width: var(--sales-document-item-product-width, 220px);
}

.sales-document-items-table col[data-sales-document-item-column="extra"] {
  width: var(--sales-document-item-extra-width, 190px);
}

.sales-document-items-table col[data-sales-document-item-column="kpd"] {
  width: var(--sales-document-item-kpd-width, 172px);
}

.sales-document-items-table col[data-sales-document-item-column="unit"] {
  width: var(--sales-document-item-unit-width, 78px);
}

.sales-document-items-table col[data-sales-document-item-column="quantity"] {
  width: var(--sales-document-item-quantity-width, 110px);
}

.sales-document-items-table col[data-sales-document-item-column="unit_price"] {
  width: var(--sales-document-item-unit-price-width, 116px);
}

.sales-document-items-table col[data-sales-document-item-column="vat"] {
  width: var(--sales-document-item-vat-width, 86px);
}

.sales-document-items-table col[data-sales-document-item-column="actions"] {
  width: var(--sales-document-item-actions-width, 94px);
}

.sales-document-items-table th {
  position: relative;
}

.sales-document-items-table input {
  width: 100%;
}

.sales-document-einvoice-panel {
  border-top: 1px solid var(--line-soft);
  margin-top: 16px;
  padding-top: 14px;
}

.sales-document-einvoice-panel h2,
.sales-document-einvoice-detail h2,
.sales-document-fiscalization-detail h2 {
  margin: 0;
}

.sales-document-einvoice-reason {
  margin: 8px 0 10px;
}

.sales-document-einvoice-facts {
  margin-bottom: 8px;
}

.sales-document-fiscalization-panel {
  margin-top: 12px;
}

details.studio-detail-panel summary {
  cursor: pointer;
  font-weight: 800;
}

.e-invoice-badge--danger {
  background: #fff4f4;
  border-color: #d9a5a5;
}

.e-invoice-badge--warning {
  background: #fff8e8;
  border-color: #e4c176;
  color: #6f4b00;
}

.e-invoice-badge--success {
  background: #eef8f0;
  border-color: #9bc9a8;
  color: #245b33;
}

.e-invoice-badge--muted {
  background: var(--surface-soft);
  color: var(--muted);
}

.sales-document-item-header {
  display: block;
  overflow: hidden;
  padding-right: 6px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-document-item-field-resizer {
  background: transparent;
  border: 0;
  bottom: 0;
  cursor: col-resize;
  min-width: 10px;
  padding: 0;
  position: absolute;
  right: -5px;
  top: 0;
  touch-action: none;
  width: 10px;
  z-index: 2;
}

.sales-document-item-field-resizer::before {
  background: transparent;
  border-radius: 999px;
  bottom: 6px;
  content: "";
  left: 50%;
  position: absolute;
  top: 6px;
  transform: translateX(-50%);
  transition: background 0.15s ease, box-shadow 0.15s ease, width 0.15s ease;
  width: 2px;
}

.sales-document-item-field-resizer:hover::before,
.sales-document-item-field-resizer:focus-visible::before,
body.is-resizing-sales-document-item-field .sales-document-item-field-resizer::before {
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.08);
  width: 4px;
}

.sales-document-suggestions h3 {
  color: var(--text);
  font-size: 14px;
  margin: 0 0 8px;
}

.sales-document-suggestions-header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 8px;
}

.sales-document-suggestions-header h3 {
  margin: 0;
}

.sales-document-price-header h2 {
  font-size: 18px;
  margin-bottom: 0;
}

.sales-document-scope {
  align-items: center;
  display: flex;
  gap: 10px;
}

.sales-document-suggestion-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sales-document-suggestion-button {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  max-width: 420px;
  min-height: 32px;
  overflow: hidden;
  padding: 7px 10px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-document-suggestion-button:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.sales-document-note-suggestions .sales-document-suggestion-list {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr);
  max-height: 190px;
  overflow-y: auto;
  padding-right: 4px;
  width: 100%;
}

.sales-document-note-suggestions .sales-document-suggestion-button {
  display: block;
  line-height: 1.35;
  max-width: none;
  min-height: 44px;
  overflow: auto;
  resize: vertical;
  text-overflow: clip;
  white-space: pre-wrap;
  width: 100%;
}

.sales-document-note-preview {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.sales-document-note-preview textarea {
  background: var(--surface-soft);
  min-height: 110px;
  resize: vertical;
}

.sales-document-product-combobox {
  min-width: 220px;
}

.sales-document-kpd-combobox {
  min-width: 150px;
}

.sales-document-kpd-suggestion {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 4px 6px;
  line-height: 1.3;
  margin-top: 5px;
}

.sales-document-kpd-suggestion[hidden] {
  display: none;
}

.sales-document-kpd-suggestion-action {
  background: transparent;
  border: 0;
  color: var(--accent);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  padding: 0;
}

.sales-document-kpd-suggestion-action:hover,
.sales-document-kpd-suggestion-action:focus-visible {
  color: var(--accent-dark);
  text-decoration: underline;
}

.sales-document-price-table {
  border-collapse: collapse;
  font-size: 13px;
  width: 100%;
}

.sales-document-price-table th,
.sales-document-price-table td {
  border-bottom: 1px solid var(--line-soft);
  padding: 7px 8px;
  text-align: left;
  vertical-align: top;
}

.sales-document-price-table tbody tr {
  cursor: pointer;
}

.sales-document-price-table tbody tr:hover {
  background: var(--surface-soft);
}

@media (max-width: 1100px) {
  .sales-document-items-workspace {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .sales-document-note-workspace.has-note-suggestions {
    gap: 12px;
    grid-template-columns: 1fr;
  }

  .sales-document-column-resizer {
    display: none;
  }

  .sales-document-note-column-resizer {
    display: none !important;
  }
}

@media (max-width: 760px) {
  .sales-document-summary-header {
    display: block;
  }

  .sales-document-summary-header p {
    max-width: none;
    text-align: left;
  }

  .sales-document-summary-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.request-view-switch {
  display: inline-flex;
}

.request-view-switch button {
  background: var(--surface);
  border-color: var(--line);
  color: var(--accent-dark);
  min-width: 78px;
}

.request-view-switch button + button {
  border-left: 0;
}

.request-view-switch button.is-active,
.request-view-switch button[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.filter-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  margin-bottom: 18px;
  padding: 18px;
}

.list-filter-panel {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(251, 250, 248, 0.96)),
    var(--surface);
  border-color: var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  padding: 16px;
}

.filter-form {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.filter-form--with-advanced {
  align-items: stretch;
  display: grid;
  gap: 12px;
}

.filter-primary-row {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(280px, 1.45fr) repeat(4, minmax(150px, 1fr)) auto;
}

.filter-form label {
  color: var(--muted);
  display: grid;
  flex: 0 0 190px;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  text-transform: uppercase;
}

.filter-form label:first-child {
  flex: 1 1 360px;
}

.filter-form button,
.filter-form .button-secondary {
  min-height: 40px;
}

.filter-action-group {
  align-items: end;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.filter-options-toggle {
  flex: 0 0 40px;
  padding: 0;
  width: 40px;
}

.filter-options-toggle svg {
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 18px;
}

.filter-options-toggle[aria-expanded="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.filter-advanced-row {
  align-items: center;
  border-top: 1px solid var(--line-soft);
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
  padding-top: 12px;
}

.filter-advanced-row[hidden] {
  display: none;
}

.filter-advanced-title {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.filter-advanced-row .checkbox-inline {
  flex: 0 0 auto;
}

.button-primary,
.button-secondary {
  align-items: center;
  background: var(--accent);
  border: 1px solid var(--accent);
  color: #fff;
  display: inline-flex;
  justify-content: center;
  padding: 8px 12px;
  text-align: center;
}

.business-primary-action {
  box-shadow: 0 10px 20px rgba(164, 19, 19, 0.18);
  font-weight: 850;
  min-height: 42px;
  padding-inline: 16px;
}

.button-disabled {
  align-items: center;
  background: #f1e6e4;
  border: 1px solid var(--line);
  color: var(--muted);
  display: inline-flex;
  justify-content: center;
  padding: 8px 12px;
  text-align: center;
}

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

button:disabled,
.button-secondary:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.app-confirmation-overlay {
  align-items: center;
  animation: confirmation-overlay-in 140ms ease-out;
  background: rgb(0 0 0 / 24%);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 24px;
  position: fixed;
  z-index: 1000;
}

.app-confirmation-overlay.is-closing {
  animation: confirmation-overlay-out 140ms ease-in forwards;
}

.app-confirmation-dialog {
  animation: confirmation-dialog-in 160ms ease-out;
  background: var(--surface);
  border: 1px solid #b9aaaa;
  box-shadow: 0 18px 44px rgb(0 0 0 / 20%);
  max-width: 620px;
  width: 100%;
}

.app-confirmation-overlay.is-closing .app-confirmation-dialog {
  animation: confirmation-dialog-out 140ms ease-in forwards;
}

.app-confirmation-header {
  border-bottom: 1px solid var(--line);
  padding: 18px 22px;
}

.app-confirmation-header h2 {
  margin: 0;
}

.app-confirmation-body {
  padding: 22px;
}

.app-confirmation-body p {
  margin-top: 0;
}

.app-confirmation-note {
  color: var(--muted);
  margin-bottom: 0;
}

.app-confirmation-footer {
  align-items: center;
  border-top: 1px solid var(--line);
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding: 16px 22px;
}

.app-confirmation-ghost {
  background: #fff;
  border-color: var(--line);
  color: var(--text);
}

@keyframes confirmation-overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes confirmation-overlay-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes confirmation-dialog-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes confirmation-dialog-out {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(6px) scale(0.99);
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-confirmation-overlay,
  .app-confirmation-overlay.is-closing,
  .app-confirmation-dialog,
  .app-confirmation-overlay.is-closing .app-confirmation-dialog {
    animation: none;
  }
}

@media (max-width: 640px) {
  .app-confirmation-footer {
    align-items: stretch;
    flex-direction: column-reverse;
  }
}

table {
  border-collapse: collapse;
  width: 100%;
}

.business-list-table {
  border-collapse: separate;
  border-spacing: 0 5px;
  font-size: 13.5px;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 9px 8px;
  text-align: left;
  vertical-align: top;
}

th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.business-list-table th {
  border-bottom: 0;
  color: #81776d;
  font-size: 11px;
  padding: 4px 10px 7px;
}

.business-list-table td {
  background: #fff;
  border-bottom: 1px solid var(--line-soft);
  border-top: 1px solid var(--line-soft);
  padding: 11px 10px;
  vertical-align: middle;
}

.business-list-table tr td:first-child {
  border-left: 1px solid var(--line-soft);
  border-radius: 7px 0 0 7px;
}

.business-list-table tr td:last-child {
  border-radius: 0 7px 7px 0;
  border-right: 1px solid var(--line-soft);
}

.business-list-table tbody tr {
  transition: transform 120ms ease, box-shadow 120ms ease;
}

.business-list-table tbody tr:hover td {
  background: var(--surface-soft);
  border-color: #e2d8d1;
}

.business-list-table .number {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.document-surface,
.document-row,
.document-chip {
  --document-accent: var(--accent);
  --document-accent-dark: var(--accent-dark);
  --document-border: rgba(164, 19, 19, 0.28);
  --document-soft: var(--accent-soft);
}

.document-surface--job,
.document-row--job,
.document-chip--job {
  --document-accent: var(--doc-job);
  --document-accent-dark: var(--doc-job-dark);
  --document-border: var(--doc-job-border);
  --document-soft: var(--doc-job-soft);
}

.document-surface--calculation,
.document-surface--calculations,
.document-row--calculation,
.document-chip--calculation {
  --document-accent: var(--doc-calculation);
  --document-accent-dark: var(--doc-calculation-dark);
  --document-border: var(--doc-calculation-border);
  --document-soft: var(--doc-calculation-soft);
}

.document-surface--offer,
.document-surface--offers,
.document-row--offer,
.document-chip--offer {
  --document-accent: var(--doc-offer);
  --document-accent-dark: var(--doc-offer-dark);
  --document-border: var(--doc-offer-border);
  --document-soft: var(--doc-offer-soft);
}

.document-surface--customer-order,
.document-surface--customer-orders,
.document-row--customer-order,
.document-chip--customer-order {
  --document-accent: var(--doc-customer-order);
  --document-accent-dark: var(--doc-customer-order-dark);
  --document-border: var(--doc-customer-order-border);
  --document-soft: var(--doc-customer-order-soft);
}

.document-surface--work-order,
.document-surface--work-orders,
.document-row--work-order,
.document-chip--work-order {
  --document-accent: var(--doc-work-order);
  --document-accent-dark: var(--doc-work-order-dark);
  --document-border: var(--doc-work-order-border);
  --document-soft: var(--doc-work-order-soft);
}

.document-surface--proforma,
.document-surface--proformas,
.document-row--proforma,
.document-chip--proforma {
  --document-accent: var(--doc-proforma);
  --document-accent-dark: var(--doc-proforma-dark);
  --document-border: var(--doc-proforma-border);
  --document-soft: var(--doc-proforma-soft);
}

.document-surface--invoice,
.document-surface--invoices,
.document-row--invoice,
.document-chip--invoice {
  --document-accent: var(--doc-invoice);
  --document-accent-dark: var(--doc-invoice-dark);
  --document-border: var(--doc-invoice-border);
  --document-soft: var(--doc-invoice-soft);
}

.document-surface--delivery-note,
.document-surface--delivery-notes,
.document-row--delivery-note,
.document-chip--delivery-note {
  --document-accent: var(--doc-delivery-note);
  --document-accent-dark: var(--doc-delivery-note-dark);
  --document-border: var(--doc-delivery-note-border);
  --document-soft: var(--doc-delivery-note-soft);
}

.business-list-table .document-row > td:first-child,
.studio-detail-table .document-row > td:first-child {
  box-shadow: inset 4px 0 0 var(--document-accent);
}

.business-list-table .document-row > td:first-child {
  padding-left: 14px;
}

.studio-detail-table .document-row > td:first-child {
  padding-left: 16px;
}

.business-list-table .document-row:hover td,
.studio-detail-table .document-row:hover td {
  background: var(--document-soft);
  border-color: var(--document-border);
}

.document-row .job-icon-action {
  color: var(--document-accent-dark);
}

.document-row .job-icon-action:hover,
.document-row .job-icon-action:focus-visible {
  background: var(--document-soft);
  border-color: var(--document-border);
  color: var(--document-accent-dark);
}

.document-chip {
  align-items: center;
  color: var(--document-accent-dark);
  display: inline-flex;
  gap: 8px;
  font-weight: 850;
}

.document-chip-dot {
  background: var(--document-accent);
  border-radius: 50%;
  box-shadow: 0 0 0 4px var(--document-soft);
  display: inline-flex;
  height: 10px;
  width: 10px;
}

.business-list-actions-column {
  text-align: right;
  width: 134px;
}

.business-list-row-actions {
  text-align: right;
  white-space: nowrap;
}

.business-list-row-actions > a {
  display: inline-flex;
  margin-right: 6px;
  vertical-align: middle;
}

.business-list-row-actions form {
  align-items: center;
  display: inline-flex;
  margin: 0;
  vertical-align: middle;
}

.business-list-edit-action,
.business-list-duplicate-action,
.business-list-delete-action {
  color: var(--accent-dark);
  height: 32px;
  min-width: 32px;
  width: 32px;
}

.number {
  text-align: right;
}

.clickable-row {
  cursor: pointer;
}

.clickable-row:hover {
  background: transparent;
}

.clickable-row:focus {
  outline: 2px solid rgba(164, 19, 19, 0.28);
  outline-offset: -2px;
}

.table-link {
  color: var(--accent-dark);
  font-weight: 700;
}

.business-list-table .table-link {
  color: #5d140f;
}

.business-list-table .table-link:hover {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.business-list-table .document-row .table-link,
.studio-detail-table .document-row .table-link {
  color: var(--document-accent-dark);
}

.business-list-table .document-row .table-link:hover,
.studio-detail-table .document-row .table-link:hover {
  color: var(--document-accent);
}

.table-link-button {
  appearance: none;
  background: transparent;
  border: 0;
  cursor: pointer;
  display: inline;
  font: inherit;
  padding: 0;
}

.accounting-material-candidates {
  background: #fff8f4;
  border: 1px solid #ead6cc;
  border-radius: 6px;
  margin-top: 8px;
  max-width: 980px;
  padding: 8px 10px;
}

.accounting-material-candidates--compact {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  max-width: none;
  padding: 5px 8px;
}

.accounting-material-candidates--compact span {
  color: #6f1f16;
  font-size: 12px;
  font-weight: 800;
}

.accounting-material-candidates-title {
  color: #6f1f16;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.accounting-material-candidate {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  line-height: 1.35;
}

.accounting-material-candidate strong {
  color: var(--text);
}

.accounting-material-candidate span {
  color: var(--muted);
}

.accounting-candidate-workspace {
  align-items: start;
}

.accounting-candidate-card {
  display: grid;
  gap: 18px;
}

.accounting-candidate-header {
  align-items: start;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.accounting-candidate-header h2 {
  margin-bottom: 4px;
}

.status-badge-success {
  background: #eef8f0;
  border-color: #bdddc5;
  color: #28743a;
}

.accounting-candidate-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

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

.accounting-candidate-correction-form {
  display: grid;
  gap: 12px;
}

.accounting-candidate-correction {
  background: #fbfaf8;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px;
}

.accounting-candidate-subsection {
  border-top: 1px solid var(--border);
  display: grid;
  gap: 12px;
  padding-top: 14px;
}

.accounting-candidate-subsection h3 {
  font-size: 16px;
  margin: 0;
}

.accounting-candidate-sheet-conversion {
  background: #fbfaf8;
  border: 1px solid var(--border);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 12px;
}

.accounting-candidate-sheet-conversion div {
  display: grid;
  gap: 4px;
}

.accounting-candidate-sheet-conversion span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.accounting-candidate-sheet-conversion strong {
  font-size: 16px;
}

.accounting-candidate-sheet-conversion p {
  grid-column: 1 / -1;
  margin: 0;
}

.accounting-candidate-raw {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
}

.accounting-candidate-raw summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 800;
}

.accounting-candidate-raw pre {
  background: #f8fafc;
  border-radius: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  margin: 10px 0 0;
  overflow: auto;
  padding: 10px;
  white-space: pre-wrap;
}

.accounting-candidate-skip-form {
  border-top: 1px solid var(--border);
  padding-top: 12px;
}

.accounting-candidate-reviewed {
  align-items: center;
  border-top: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 14px;
}

.accounting-archive-toggle {
  align-self: end;
  min-height: 38px;
}

.accounting-archive-table {
  table-layout: fixed;
}

.accounting-archive-table th:first-child { width: 16%; }
.accounting-archive-table th:nth-child(3) { width: 13%; }
.accounting-archive-table th:last-child { width: 23%; }

.document-archive-table { table-layout: fixed; }
.document-archive-table th:first-child { width: 18%; }
.document-archive-table th:nth-child(3) { width: 16%; }
.document-archive-table th:last-child { width: 26%; }

.accounting-archive-file {
  overflow-wrap: anywhere;
}

.accounting-archive-file-details {
  margin-top: 6px;
  font-size: 12px;
}

.accounting-archive-file-details > summary {
  width: fit-content;
  cursor: pointer;
  color: var(--muted);
}

.accounting-archive-file-details > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.accounting-archive-file-details dl {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 6px 12px;
  margin: 10px 0 0;
}

.accounting-archive-file-details dt { color: var(--muted); }
.accounting-archive-file-details dd { margin: 0; }

@media (min-width: 761px) and (max-width: 1200px) {
  .accounting-archive-filters .filter-primary-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .accounting-archive-file-details dl { grid-template-columns: minmax(0, 1fr); }
}

.accounting-archive-period-group td {
  background: #f8fafc;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.business-list-table tbody tr.accounting-archive-period-group:hover td {
  background: #f8fafc;
}

.accounting-archive-period-group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-weight: 700;
  color: var(--ink);
}

.accounting-archive-period-group-title small {
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
}

.accounting-archive-duplicate-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  margin-left: 8px;
  padding: 2px 7px;
  border: 1px solid #d6dbe5;
  border-radius: 999px;
  background: #f7f8fb;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.delivery-note-invoice-dialog {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 22px 60px rgb(0 0 0 / 24%);
  color: var(--text);
  max-height: min(88vh, 920px);
  max-width: 1080px;
  padding: 0;
  width: min(1080px, calc(100vw - 32px));
}

.delivery-note-invoice-dialog::backdrop {
  background: rgb(0 0 0 / 32%);
}

.delivery-note-invoice-dialog-header,
.delivery-note-invoice-dialog-footer {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 18px 22px;
}

.delivery-note-invoice-dialog-header {
  border-bottom: 1px solid var(--line);
}

.delivery-note-invoice-dialog-header h2,
.delivery-note-invoice-dialog-header p {
  margin: 0;
}

.delivery-note-invoice-dialog-header > div {
  display: grid;
  gap: 4px;
}

.delivery-note-invoice-dialog-body {
  display: grid;
  gap: 16px;
  max-height: calc(88vh - 176px);
  overflow: auto;
  padding: 20px 22px;
}

.delivery-note-invoice-preview {
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  min-height: 170px;
  padding: 14px;
}

.delivery-note-invoice-preview-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 14px;
}

.delivery-note-invoice-preview-summary article {
  background: var(--surface-soft);
  border-radius: 7px;
  display: grid;
  gap: 4px;
  padding: 10px;
}

.delivery-note-invoice-preview-summary span {
  color: var(--muted);
  font-size: 11px;
}

.delivery-note-invoice-dialog-footer {
  border-top: 1px solid var(--line);
}

.delivery-note-invoice-dialog-footer small {
  color: var(--muted);
}

@media (max-width: 760px) {
  .delivery-note-invoice-dialog-header,
  .delivery-note-invoice-dialog-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .delivery-note-invoice-preview-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.incoming-documents-upload {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(251, 250, 248, 0.96)),
    var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  margin-bottom: 16px;
  padding: 16px;
}

.incoming-documents-upload form {
  align-items: stretch;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.incoming-upload-zone {
  align-items: center;
  border: 1px dashed #d8c6c1;
  border-radius: 8px;
  color: var(--ink);
  cursor: pointer;
  display: flex;
  gap: 14px;
  min-height: 82px;
  padding: 14px 16px;
  text-transform: none;
  transition: background 120ms ease, border-color 120ms ease;
}

.incoming-upload-zone.is-drag-over {
  background: #fff7f5;
  border-color: var(--accent);
}

.incoming-upload-zone strong {
  display: block;
  font-size: 18px;
}

.incoming-upload-zone small {
  color: var(--muted);
  display: block;
  font-size: 13px;
  margin-top: 4px;
}

.incoming-upload-zone input {
  display: none;
}

.incoming-upload-icon {
  align-items: center;
  background: #fff4f4;
  border: 1px solid #e6c9c9;
  border-radius: 8px;
  color: var(--accent);
  display: inline-flex;
  flex: 0 0 44px;
  height: 44px;
  justify-content: center;
  width: 44px;
}

.incoming-upload-icon svg {
  fill: none;
  height: 24px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 24px;
}

.incoming-upload-actions {
  align-items: stretch;
  display: flex;
  gap: 8px;
}

.incoming-upload-reset[hidden] {
  display: none;
}

.customer-order-document-field {
  display: grid;
  gap: 7px;
  grid-column: 1 / -1;
}

.customer-order-edit-context {
  background: var(--doc-customer-order-soft);
  border: 1px solid var(--doc-customer-order-border);
  border-left: 4px solid var(--doc-customer-order);
  border-radius: 10px;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 18px;
  padding: 12px 14px;
}

.customer-order-edit-context div,
.customer-order-current-document span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.customer-order-edit-context small,
.customer-order-current-document small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.customer-order-edit-context strong,
.customer-order-current-document strong {
  overflow-wrap: anywhere;
}

.form-context-warning {
  background: #fff8e7;
  border: 1px solid #ecd394;
  border-radius: 8px;
  color: #79540b;
  margin: 0 0 18px;
  padding: 10px 12px;
}

.customer-order-current-document {
  align-items: center;
  background: #fff;
  border: 1px solid var(--document-border);
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 10px 12px;
}

.customer-order-number-hint {
  color: var(--doc-customer-order);
  display: block;
  font-size: 12px;
  margin-top: 5px;
}

.customer-order-number-hint[hidden] {
  display: none;
}

.customer-order-document-label {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
}

.customer-order-upload-zone {
  background: var(--document-soft);
  border-color: var(--document-border);
  min-height: 104px;
}

.customer-order-upload-zone:hover,
.customer-order-upload-zone:focus-within,
.customer-order-upload-zone.is-drag-over {
  background: var(--document-soft);
  border-color: var(--document-accent);
}

.customer-order-upload-zone.has-file {
  border-style: solid;
}

.customer-order-upload-icon {
  background: var(--document-soft);
  border-color: var(--document-border);
  color: var(--document-accent-dark);
}

.customer-order-upload-footer {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.customer-order-upload-footer > small {
  color: var(--muted);
}

.customer-order-upload-footer > small.is-loading {
  color: var(--doc-customer-order);
  font-weight: 800;
}

.customer-order-upload-footer > small.is-success {
  color: #176a3a;
  font-weight: 700;
}

.customer-order-upload-footer > small.is-error {
  color: var(--danger);
  font-weight: 700;
}

.customer-order-link-documents {
  background: var(--document-soft);
  border: 1px solid var(--document-border);
  border-left: 4px solid var(--document-accent);
  border-radius: 10px;
  grid-column: 1 / -1;
  padding: 12px 14px;
}

.customer-order-link-documents .checkbox-row {
  align-items: flex-start;
  color: var(--document-accent-dark);
  font-weight: 700;
}

.customer-order-link-documents input {
  margin-top: 3px;
}

.customer-order-review {
  border-top: 4px solid var(--doc-customer-order);
}

.customer-order-review__header,
.customer-order-review__summary,
.customer-order-review__footer {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.customer-order-review__header form,
.customer-order-review__table form,
.customer-order-review__footer form {
  margin: 0;
}

.customer-order-review__summary {
  justify-content: flex-start;
  margin: 18px 0 12px;
  flex-wrap: wrap;
}

.customer-order-review__table-wrap {
  overflow-x: auto;
}

.customer-order-review__table th[scope="row"] {
  min-width: 150px;
}

.customer-order-review__table td:last-child {
  text-align: right;
  white-space: nowrap;
}

.customer-order-review .button-small {
  min-height: 34px;
  padding: 7px 10px;
}

.review-row--match {
  background: #f2fbf5;
}

.review-row--mismatch {
  background: var(--doc-customer-order-soft);
}

.review-row--missing,
.review-row--neutral {
  background: #f6f5f3;
}

.review-state {
  border: 1px solid #d8d4cf;
  border-radius: 999px;
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 4px 9px;
  white-space: nowrap;
}

.review-state--match,
.review-state--confirmed {
  background: #e9f7ee;
  border-color: #b9dfc7;
  color: #176a3a;
}

.review-state--mismatch {
  background: var(--doc-customer-order-soft);
  border-color: var(--doc-customer-order-border);
  color: var(--doc-customer-order-dark);
}

.review-state--missing,
.review-state--neutral {
  background: #efeeec;
  border-color: #d8d4cf;
  color: #6c6761;
}

.customer-order-review__items {
  border-top: 1px solid var(--doc-customer-order-border);
  margin-top: 18px;
  padding-top: 18px;
}

.customer-order-review__item {
  border: 1px solid var(--doc-customer-order-border);
  border-radius: 10px;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 10px;
  padding: 14px;
}

.customer-order-review__item > div {
  display: grid;
  gap: 6px;
}

.customer-order-review__item small {
  color: var(--text-muted);
}

.customer-order-review__empty {
  background: #f6f5f3;
  border: 1px dashed #d8d4cf;
  border-radius: 10px;
  color: var(--text-muted);
  margin-top: 16px;
  padding: 18px;
}

.customer-order-review__footer {
  border-top: 1px solid var(--doc-customer-order-border);
  justify-content: flex-end;
  margin-top: 18px;
  padding-top: 18px;
}

.review-confirmation {
  color: #176a3a;
  font-weight: 700;
}

@media (max-width: 760px) {
  .customer-order-review__header,
  .customer-order-review__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .customer-order-review__item {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .customer-order-edit-context {
    grid-template-columns: 1fr;
  }

  .customer-order-upload-zone,
  .customer-order-upload-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .customer-order-upload-zone {
    display: flex;
  }
}

.incoming-documents-filter .filter-form {
  align-items: end;
}

.incoming-view-switch {
  align-self: end;
}

.incoming-view-switch a {
  gap: 6px;
}

.incoming-view-switch span {
  color: inherit;
  font-size: 12px;
  opacity: 0.75;
}

.incoming-documents-table {
  table-layout: auto;
}

.incoming-documents-table th:nth-child(1) {
  width: 31%;
}

.incoming-documents-table th:nth-child(5) {
  width: 34%;
}

.incoming-document-row--child td:first-child {
  padding-left: 26px;
}

.incoming-document-title {
  align-items: flex-start;
  display: flex;
  gap: 10px;
}

.incoming-child-marker {
  border-bottom: 1px solid #d8c6c1;
  border-left: 1px solid #d8c6c1;
  flex: 0 0 18px;
  height: 18px;
  margin-top: 2px;
}

.incoming-document-error {
  color: var(--accent-dark);
  font-size: 13px;
  font-weight: 700;
  margin-top: 4px;
}

.incoming-duplicate-notice {
  align-items: center;
  background: #fff7e8;
  border: 1px solid #e4bf7a;
  border-radius: 8px;
  color: #75440f;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 4px 10px;
  margin-top: 7px;
  padding: 7px 9px;
}

.incoming-duplicate-notice .table-link {
  color: #75440f;
  font-weight: 800;
}

.incoming-status {
  display: inline-flex;
  margin: 0;
}

.incoming-status--zavrseno {
  background: #eef8ef;
  border-color: #b8d7bd;
  color: #276738;
}

.incoming-status--treba_ocr,
.incoming-status--greska {
  background: #fff3ea;
  border-color: #e3bd95;
  color: #8f4612;
}

.incoming-confirm-form {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(150px, 1.2fr) minmax(140px, 1fr) 84px 94px auto;
  margin: 8px 0 0;
}

.incoming-confirm-form label {
  color: var(--muted);
  display: grid;
  font-size: 11px;
  font-weight: 800;
  gap: 4px;
  text-transform: uppercase;
}

.incoming-confirm-form input,
.incoming-confirm-form select {
  min-height: 34px;
  padding: 6px 8px;
}

.incoming-confirm-form button {
  min-height: 34px;
  white-space: nowrap;
}

.incoming-document-action-links {
  align-items: center;
  display: flex;
  white-space: nowrap;
}

.incoming-supplier-quote-action {
  display: inline-flex;
  margin-top: 10px;
  min-height: 40px;
  padding-inline: 16px;
}

.incoming-alternate-archive {
  border-top: 1px solid var(--line);
  margin-top: 12px;
  padding-top: 8px;
}

.incoming-alternate-archive summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.danger-text {
  color: var(--danger, #a30f18) !important;
}

.incoming-secondary-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0 10px;
  margin-top: 8px;
}

.incoming-secondary-actions form {
  margin: 0;
}

.badge {
  background: var(--surface-strong);
  border: 1px solid #e3d8d2;
  border-radius: 999px;
  color: var(--accent-dark);
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  margin: 0 4px 4px 0;
  padding: 3px 8px;
  text-transform: uppercase;
}

.offers-table {
  table-layout: auto;
}

.offer-details-control,
.invoice-details-control {
  width: 34px;
}

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

.row-actions-column form {
  align-items: center;
  display: inline-flex;
  margin: 0;
}

.offer-details-toggle {
  background: #fff;
  border: 1px solid var(--line);
  color: var(--accent);
  height: 28px;
  padding: 0;
  width: 28px;
}

.offer-details-toggle::before {
  content: "›";
  display: block;
  font-size: 18px;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform 120ms ease;
}

.offer-details-toggle[aria-expanded="true"]::before {
  transform: rotate(90deg);
}

.offer-details-row td,
.invoice-details-row td {
  background: #fbfaf8;
  padding: 0;
}

.offer-details-panel,
.invoice-details-panel {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  padding: 14px 18px 18px 42px;
}

.offer-details-meta,
.offer-details-item,
.invoice-details-item {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.offer-details-meta span {
  color: var(--muted);
}

.offer-details-items,
.invoice-details-items {
  display: grid;
  gap: 10px;
}

.offer-details-item,
.invoice-details-item {
  border: 1px solid var(--line);
  background: #fff;
  padding: 12px;
}

.offer-details-item dl,
.invoice-details-item dl {
  display: grid;
  gap: 5px 12px;
  grid-template-columns: max-content minmax(0, 1fr);
  margin: 0;
  min-width: 360px;
}

.offer-details-item dt,
.invoice-details-item dt {
  color: var(--muted);
}

.offer-details-item dd,
.invoice-details-item dd {
  margin: 0;
}

.offer-type-pill {
  border: 1px solid #e1c5c0;
  color: var(--accent);
  display: inline-block;
  font-size: 12px;
  margin: 0 0 5px;
  padding: 2px 6px;
}

.status-badge {
  background: #fff4f4;
  border-color: #d9a5a5;
  color: var(--accent-dark);
  font-size: 14px;
  font-weight: 700;
  padding: 4px 8px;
}

.pagination {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: flex-end;
  margin-top: 16px;
}

.pagination a {
  color: var(--accent-dark);
  font-weight: 700;
}

.pagination span {
  color: var(--muted);
}

.has-infinite-scroll .infinite-pagination-fallback {
  display: none;
}

.infinite-scroll-status {
  color: var(--muted);
  font-size: 13px;
  min-height: 22px;
  padding-top: 14px;
  text-align: center;
}

.detail-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin-bottom: 18px;
}

.job-detail-top {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 260px;
  margin-bottom: 18px;
}

.job-detail-actions {
  align-content: start;
  display: grid;
  gap: 14px;
}

.detail-action-buttons {
  display: grid;
  gap: 8px;
}

.detail-action-buttons form {
  margin: 0;
}

.detail-action-buttons .button-secondary,
.sidebar-action-button {
  min-height: 38px;
  width: 100%;
}

.status-badge.status-success {
  background: #eef8f0;
  border-color: #bdddc5;
  color: #28743a;
}

.status-badge.status-warning {
  background: #fff8e6;
  border-color: #e7ca7d;
  color: #7a5600;
}

.status-badge.status-working {
  background: #f3f4f5;
  border-color: #cfd3d6;
  color: #4f565c;
}

.status-badge.status-danger {
  background: #fff0f0;
  border-color: #e2a2a2;
  color: #9a1b1b;
}

.calculation-reliability {
  align-items: flex-start;
  background: var(--surface);
  border: 1px solid var(--line);
  border-left: 5px solid var(--line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
}

.calculation-reliability.is-success { border-left-color: #28743a; }
.calculation-reliability.is-warning { border-left-color: #b47b00; }
.calculation-reliability.is-danger { border-left-color: #9a1b1b; }

.calculation-reliability > div {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.calculation-reliability details ul {
  margin-bottom: 0;
}

.detail-action-buttons .job-action-button {
  background: var(--document-soft);
  border-color: var(--document-border);
  box-shadow: inset 4px 0 0 var(--document-accent);
  color: var(--document-accent-dark);
}

.detail-action-buttons .job-action-button:hover {
  background: var(--document-soft);
  border-color: var(--document-accent);
  color: var(--document-accent-dark);
}

.detail-action-buttons .job-action-button:disabled {
  background: #f5f3f1;
  border-color: #ded9d4;
  box-shadow: inset 4px 0 0 #c9c3bd;
  color: #99918b;
  opacity: 1;
}

.job-process-groups {
  display: grid;
  gap: 12px;
}

.job-process-group {
  --group-bg: #faf7f4;
  --group-border: rgba(120, 96, 82, 0.18);
  --group-accent: var(--accent-dark);
  background: var(--group-bg);
  border: 1px solid var(--group-border);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  padding: 8px;
}

.job-process-group-header {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.job-process-group h3 {
  color: var(--group-accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  margin: 0;
  text-transform: uppercase;
}

.job-process-group--job {
  --group-bg: var(--doc-job-soft);
  --group-border: var(--doc-job-border);
  --group-accent: var(--doc-job);
}

.job-process-group--calculations {
  --group-bg: var(--doc-calculation-soft);
  --group-border: var(--doc-calculation-border);
  --group-accent: var(--doc-calculation);
}

.job-process-group--offers {
  --group-bg: var(--doc-offer-soft);
  --group-border: var(--doc-offer-border);
  --group-accent: var(--doc-offer);
}

.job-process-group--work-orders {
  --group-bg: var(--doc-work-order-soft);
  --group-border: var(--doc-work-order-border);
  --group-accent: var(--doc-work-order);
}

.job-process-group--proformas {
  --group-bg: var(--doc-proforma-soft);
  --group-border: var(--doc-proforma-border);
  --group-accent: var(--doc-proforma);
}

.job-process-group--invoices {
  --group-bg: var(--doc-invoice-soft);
  --group-border: var(--doc-invoice-border);
  --group-accent: var(--doc-invoice);
}

.job-process-group--delivery-notes {
  --group-bg: var(--doc-delivery-note-soft);
  --group-border: var(--doc-delivery-note-border);
  --group-accent: var(--doc-delivery-note);
}

.job-process-group-actions,
.job-process-links {
  display: grid;
  gap: 6px;
}

.job-process-group-actions form {
  margin: 0;
}

.job-process-action-button {
  min-height: 32px;
  padding: 6px 10px;
}

.job-process-group .job-process-action-button:not(:disabled) {
  background: #fff;
  border-color: var(--group-border);
  color: var(--group-accent);
}

.job-process-group .job-process-action-button:not(:disabled):hover,
.job-process-group .job-process-action-button:not(:disabled):focus-visible {
  background: var(--group-accent);
  border-color: var(--group-accent);
  color: #fff;
}

.job-process-row {
  align-items: stretch;
  background: rgba(255, 255, 255, 0.68);
  border: 1px solid var(--group-border);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(0, 1fr) auto;
  overflow: hidden;
}

.job-process-link {
  align-items: flex-start;
  color: var(--text);
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-weight: 800;
  padding: 10px 12px;
  text-align: left;
  text-decoration: none;
}

.job-process-link:hover {
  background: rgba(164, 19, 19, .04);
}

.job-process-link small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.job-process-row-actions {
  align-items: center;
  display: flex;
  gap: 4px;
  padding-right: 6px;
}

.job-process-row-actions form {
  margin: 0;
}

.job-process-row-icon {
  align-items: center;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--accent-dark);
  cursor: pointer;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  padding: 0;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
  width: 30px;
}

.job-process-row-icon:hover {
  background: rgba(164, 19, 19, .08);
  border-color: rgba(164, 19, 19, .35);
  transform: translateY(-1px);
}

.job-process-row-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

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

.sidebar-button-grid > *,
.sidebar-button-grid form button {
  width: 100%;
}

.sidebar-button-grid form {
  display: flex;
}

.info-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 18px;
}

.studio-detail-panel,
.studio-detail-section,
.studio-total-panel {
  background: var(--surface);
  border-color: var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
}

.studio-detail-panel {
  padding: 18px;
}

.studio-detail-grid {
  gap: 14px;
}

.job-invoice-source-panel {
  grid-column: 1 / -1;
}

.sales-document-header-workspace {
  gap: 0;
  grid-template-columns: minmax(320px, var(--sales-document-header-left-column, 50%)) 16px minmax(320px, 1fr);
}

.sales-document-header-column-resizer {
  align-self: stretch;
  background: transparent;
  border: 0;
  cursor: col-resize;
  min-height: 120px;
  min-width: 16px;
  padding: 0;
  position: relative;
  touch-action: none;
}

.sales-document-header-column-resizer::before {
  background: var(--line-soft);
  border-radius: 999px;
  content: "";
  inset: 0 auto 0 50%;
  position: absolute;
  transform: translateX(-50%);
  transition: background 0.15s ease, box-shadow 0.15s ease, width 0.15s ease;
  width: 2px;
}

.sales-document-header-column-resizer:hover::before,
.sales-document-header-column-resizer:focus-visible::before,
body.is-resizing-sales-document-header-columns .sales-document-header-column-resizer::before {
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.08);
  width: 4px;
}

.info-panel h2 {
  font-size: 18px;
  margin-bottom: 14px;
}

.studio-detail-panel h2,
.studio-detail-section h2 {
  color: #151312;
  font-size: 19px;
  letter-spacing: 0;
}

.definition-list {
  display: grid;
  gap: 8px 18px;
  grid-template-columns: 120px minmax(0, 1fr);
  margin: 0;
}

.definition-list dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.definition-list dd {
  margin: 0;
}

.inline-detail-form {
  display: grid;
  gap: 12px;
}

.inline-detail-form input,
.inline-detail-form textarea {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--text);
  font: inherit;
  padding: 7px 8px;
  width: 100%;
}

.inline-detail-form textarea {
  min-height: 84px;
  resize: vertical;
}

.payment-status-inline-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}

.payment-status-inline-form input {
  min-height: 38px;
  width: 150px;
}

.compact-form-actions {
  justify-content: flex-end;
}

.delivery-note-followup-actions {
  justify-content: flex-end;
  margin-top: -4px;
}

.offer-text-edit-form {
  white-space: normal;
}

.offer-text-edit-form label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  text-transform: uppercase;
}

.offer-version-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.offer-version-tab {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  display: grid;
  gap: 2px;
  min-width: 150px;
  padding: 10px 12px;
  text-decoration: none;
}

.offer-version-tab span {
  font-weight: 800;
}

.offer-version-tab small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.offer-version-tab.is-active {
  background: #fff6f5;
  border-color: rgba(164, 19, 19, .32);
  box-shadow: inset 3px 0 0 var(--accent-dark);
}

.offer-command-row {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}

.offer-command-row .offer-version-tabs {
  margin-bottom: 0;
}

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

.offer-panel-heading,
.offer-material-header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.offer-workflow-panel {
  display: grid;
  gap: 22px;
  grid-template-columns: minmax(340px, 0.72fr) minmax(720px, 1.28fr);
}

.offer-command-meta {
  align-items: start;
  gap: 22px;
  grid-template-columns: 150px 145px minmax(150px, 1fr);
  min-width: 0;
  padding-top: 2px;
}

.job-process-group--customer-orders {
  --group-bg: var(--doc-customer-order-soft);
  --group-border: var(--doc-customer-order-border);
  --group-accent: var(--doc-customer-order);
}

.offer-command-meta > div {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.offer-command-meta dd {
  font-weight: 780;
  overflow-wrap: anywhere;
}

.offer-command-date-source {
  color: var(--muted);
  display: block;
  font-size: 11px;
  line-height: 1.2;
}

.offer-command-history {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.offer-command-history small {
  color: var(--muted);
}

.offer-command-controls {
  align-items: stretch;
  display: grid;
  min-width: 0;
}

.offer-command-controls.has-next-step {
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) 268px;
}

.offer-command-actions {
  align-content: space-between;
  display: grid;
  gap: 8px;
  min-width: 0;
}

.offer-command-primary-actions,
.offer-command-secondary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.offer-command-primary-actions > *,
.offer-command-secondary-actions > * {
  margin: 0;
}

.offer-command-primary-actions .button-primary,
.offer-command-primary-actions .button-secondary,
.offer-command-secondary-actions .button-secondary,
.offer-command-secondary-actions .button-danger {
  font-size: 13px;
  min-height: 38px;
}

.offer-command-document-action {
  background: var(--document-soft);
  border-color: var(--document-border);
  color: var(--document-accent-dark);
}

.offer-command-document-action:hover,
.offer-command-document-action:focus-visible {
  background: var(--document-soft);
  border-color: var(--document-accent);
  color: var(--document-accent-dark);
}

.offer-command-document-action.is-solid,
.offer-command-document-action.is-solid:hover,
.offer-command-document-action.is-solid:focus-visible {
  background: var(--document-accent);
  border-color: var(--document-accent);
  color: #fff;
}

.offer-command-neutral-action {
  background: #fff;
  border-color: var(--line);
  color: var(--text);
}

.offer-command-neutral-action:hover,
.offer-command-neutral-action:focus-visible {
  background: var(--surface-soft);
  border-color: #c9c2bb;
  color: var(--text);
}

.offer-command-delete-action {
  background: #fff;
  border-color: #e3b9b7;
  color: var(--accent-dark);
}

.offer-command-delete-action:hover,
.offer-command-delete-action:focus-visible {
  background: var(--accent-soft);
  border-color: rgba(164, 19, 19, 0.45);
  color: var(--accent-dark);
}

.offer-next-step {
  align-content: center;
  background: #f3fbf6;
  border: 1px solid #ccebd9;
  border-radius: 8px;
  display: grid;
  gap: 7px;
  min-height: 84px;
  padding: 10px 12px;
}

.offer-next-step span {
  color: #347454;
  display: block;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.offer-next-step strong {
  display: block;
  font-size: 13px;
  line-height: 1.2;
  margin-top: 3px;
}

.offer-next-step form {
  margin: 0;
}

.offer-next-step .button-secondary {
  min-height: 38px;
  width: 100%;
}

.offer-next-step .is-accepted {
  background: var(--doc-work-order);
  border-color: var(--doc-work-order);
  color: #fff;
}

.offer-status-history {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 6px;
  grid-column: 1 / -1;
  padding-top: 10px;
}

.offer-status-history ol {
  display: grid;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.offer-status-history li {
  align-items: center;
  color: var(--text);
  display: flex;
  font-size: 13px;
  gap: 8px;
  justify-content: space-between;
}

.offer-status-history small {
  color: var(--muted);
}

@media (max-width: 1250px) {
  .offer-workflow-panel {
    grid-template-columns: 1fr;
  }

  .offer-command-meta,
  .offer-command-actions,
  .offer-status-history {
    grid-column: 1;
  }

  .offer-command-meta {
    grid-template-columns: 170px 150px minmax(170px, 1fr);
  }

  .offer-command-primary-actions,
  .offer-command-secondary-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 900px) {
  .offer-command-controls.has-next-step {
    grid-template-columns: 1fr;
  }

  .offer-next-step {
    align-items: center;
    grid-template-columns: minmax(0, 1fr) 220px;
  }
}

@media (max-width: 680px) {
  .offer-command-meta {
    gap: 15px;
    grid-template-columns: 1fr 1fr;
  }

  .offer-command-meta > div:last-child {
    grid-column: 1 / -1;
  }

  .offer-command-primary-actions,
  .offer-command-secondary-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .offer-command-primary-actions > *,
  .offer-command-secondary-actions > *,
  .offer-command-primary-actions a,
  .offer-command-primary-actions button,
  .offer-command-secondary-actions a,
  .offer-command-secondary-actions button {
    justify-content: flex-start;
    width: 100%;
  }

  .offer-next-step {
    grid-template-columns: 1fr;
  }
}

.offer-material-readiness {
  background: #fffaf0;
  border-color: #efdcb8;
  display: grid;
  gap: 10px;
}

.offer-material-readiness.is-active {
  background: #f3fbf6;
  border-color: #ccebd9;
}

.offer-material-header h2 {
  margin-bottom: 0;
}

.offer-material-header strong {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--accent-dark);
  padding: 8px 12px;
}

.offer-material-table {
  border-collapse: collapse;
  font-size: 13px;
  width: 100%;
}

.offer-material-table th,
.offer-material-table td {
  border-bottom: 1px solid rgba(120, 96, 82, .14);
  padding: 8px 6px;
  text-align: left;
}

.offer-material-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.service-offer-display-panel {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.service-offer-display-panel h2 {
  margin: 0;
}

.offer-display-mode-control {
  flex: 0 0 auto;
}

.offer-service-detail-editor {
  background: #fbf8f4;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding: 12px;
}

.offer-service-detail-editor h4 {
  color: var(--accent-dark);
  font-size: 13px;
  margin: 0;
  text-transform: uppercase;
}

.offer-service-detail-table th:first-child,
.offer-service-detail-table td:first-child {
  width: 92px;
}

.offer-service-visible-cell {
  vertical-align: middle;
}

.offer-service-detail-table input[type="text"] {
  min-width: 0;
  width: 100%;
}

.offer-service-detail-table td.number input {
  text-align: right;
}

.offer-service-add-detail {
  justify-self: flex-start;
}

.offer-service-item-summary {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 8px;
  margin-top: 4px;
  padding-top: 10px;
}

.offer-service-item-summary div {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.offer-service-item-summary span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.offer-service-item-summary strong {
  color: var(--accent-dark);
  font-size: 16px;
  text-align: right;
}

.checkbox-inline {
  align-items: center;
  display: inline-flex;
  font-weight: 700;
  gap: 7px;
  margin: 0;
}

.checkbox-inline input {
  accent-color: var(--accent);
}

.offer-service-group-row td {
  background: #fff7f4;
  color: var(--accent-dark);
  font-size: 14px;
}

.offer-service-detail-row td {
  background: #fff;
}

.offer-service-detail-row td:nth-child(2) {
  padding-left: 18px;
}

@media (max-width: 800px) {
  .service-offer-display-panel {
    align-items: flex-start;
    flex-direction: column;
  }
}

.studio-detail-table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13.5px;
}

.studio-detail-table th {
  background: var(--surface-soft);
  border-bottom: 1px solid var(--line-soft);
  color: #81776d;
  font-size: 11px;
  font-weight: 800;
  padding: 8px 10px;
}

.studio-detail-table td {
  border-bottom: 1px solid var(--line-soft);
  padding: 10px;
}

.studio-detail-table tbody tr:hover td {
  background: var(--surface-soft);
}

.work-order-production-panel {
  margin-top: 18px;
  overflow-x: auto;
}

.work-order-production-panel h3 {
  font-size: 16px;
  margin: 0 0 14px;
}

.work-order-production-panel h4 {
  color: var(--brand);
  font-size: 13px;
  margin: 18px 0 8px;
  text-transform: uppercase;
}

.work-order-production-panel input,
.work-order-production-panel textarea {
  min-width: 90px;
}

.work-order-note-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.work-order-note-grid label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  text-transform: uppercase;
}

.compact-list {
  margin-bottom: 18px;
}

.plain-list {
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.plain-list li {
  display: grid;
  gap: 2px;
}

.plain-list span,
.muted {
  color: var(--muted);
}

.plain-list strong {
  color: var(--text);
}

.inline-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.job-calculation-list {
  gap: 12px;
}

.job-calculation-list-item {
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 52px;
}

.job-calculation-copy {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.job-calculation-actions {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.job-calculation-action {
  min-width: 40px;
  padding: 0;
  text-align: center;
}

.job-icon-action {
  height: 40px;
  width: 40px;
}

.job-icon-action svg {
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 18px;
}

.job-document-list {
  gap: 12px;
}

.job-document-list-item {
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 52px;
}

.job-document-copy {
  display: grid;
  gap: 3px;
}

.job-document-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.job-document-actions form {
  margin: 0;
}

.job-document-action {
  min-width: 118px;
  padding: 12px 16px;
  text-align: center;
}

.job-calculation-action.job-icon-action,
.job-document-action.job-icon-action {
  min-width: 40px;
  padding: 0;
}

.job-document-placeholder-actions {
  justify-content: flex-start;
  margin-top: 10px;
}

.document-actions {
  display: flex;
  gap: 8px;
}

.document-actions form {
  margin: 0;
}

.document-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.document-detail-workspace {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns:
    minmax(0, var(--document-detail-main-width, 1fr))
    10px
    minmax(460px, var(--document-detail-preview-width, 48vw));
}

.document-detail-workspace--with-documents {
  grid-template-columns:
    minmax(420px, var(--document-detail-main-width, .95fr))
    10px
    minmax(420px, var(--document-detail-preview-width, 1.1fr))
    300px;
}

.document-detail-main {
  min-width: 0;
}

.document-detail-resizer {
  align-self: stretch;
  background: transparent;
  border: 0;
  cursor: col-resize;
  display: flex;
  justify-content: center;
  min-height: 320px;
  padding: 0;
  position: relative;
  touch-action: none;
  width: 10px;
}

.document-detail-resizer::before {
  background: color-mix(in srgb, var(--line) 72%, transparent);
  border-radius: 999px;
  content: "";
  inset: 0 auto;
  margin: 0 auto;
  position: absolute;
  width: 2px;
}

.document-detail-resizer span {
  background:
    linear-gradient(
      180deg,
      transparent 0,
      transparent 4px,
      color-mix(in srgb, var(--muted) 64%, transparent) 4px,
      color-mix(in srgb, var(--muted) 64%, transparent) 8px,
      transparent 8px,
      transparent 12px
    );
  border-radius: 999px;
  height: 44px;
  margin-top: 180px;
  position: sticky;
  top: 45vh;
  width: 4px;
  z-index: 1;
}

.document-detail-resizer:hover::before,
.document-detail-resizer:focus-visible::before,
body.is-resizing-document-detail .document-detail-resizer::before {
  background: color-mix(in srgb, var(--accent) 72%, transparent);
}

.document-detail-resizer:hover span,
.document-detail-resizer:focus-visible span,
body.is-resizing-document-detail .document-detail-resizer span {
  background:
    linear-gradient(
      180deg,
      transparent 0,
      transparent 4px,
      var(--accent) 4px,
      var(--accent) 8px,
      transparent 8px,
      transparent 12px
    );
}

.document-detail-resizer:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 42%, transparent);
  outline-offset: 3px;
}

body.is-resizing-document-detail {
  cursor: col-resize;
  user-select: none;
}

.offer-detail-main {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.offer-detail-main .offer-client-stack {
  order: 1;
}

.offer-detail-main .offer-text-panel-collapsible {
  order: 2;
}

.offer-detail-main .studio-detail-section {
  order: 3;
}

.offer-detail-main .offer-material-readiness {
  order: 5;
}

.offer-items-table tfoot {
  border-top: 2px solid var(--line);
}

.offer-items-table tfoot th,
.offer-items-table tfoot td {
  background: var(--surface-soft);
  border-bottom: 0;
  padding-bottom: 8px;
  padding-top: 8px;
}

.offer-items-table tfoot th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-align: right;
  text-transform: uppercase;
}

.offer-items-table tfoot td {
  font-variant-numeric: tabular-nums;
}

.offer-items-table .offer-items-grand-total th,
.offer-items-table .offer-items-grand-total td {
  border-top: 1px solid var(--line-soft);
  color: var(--accent-dark);
  font-size: 16px;
  padding-bottom: 12px;
  padding-top: 11px;
}

.document-preview-stack {
  align-content: start;
  display: grid;
  gap: 16px;
  min-width: 0;
}

.offer-text-panel-under-preview {
  display: none;
}

.offer-text-panel-collapsible {
  margin: 0;
}

.offer-text-panel-collapsible > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 850;
  justify-content: space-between;
  list-style: none;
}

.offer-text-panel-collapsible > summary::-webkit-details-marker {
  display: none;
}

.offer-text-panel-collapsible > summary::after {
  color: var(--accent-dark);
  content: "+";
  font-size: 18px;
  line-height: 1;
}

.offer-text-panel-collapsible[open] > summary {
  margin-bottom: 12px;
}

.offer-text-panel-collapsible[open] > summary::after {
  content: "-";
}

.document-preview-panel {
  display: grid;
  gap: 12px;
  overflow: visible;
  position: static;
}

.document-preview-header {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.document-preview-title {
  min-width: 170px;
}

.document-preview-header h2 {
  margin: 0;
}

.document-preview-toolbar,
.segmented-control {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.document-preview-toolbar-stack {
  flex: 1 1 650px;
  display: grid;
  gap: 10px;
  min-width: 0;
}

.document-preview-toolbar {
  justify-content: flex-end;
  min-width: 0;
}

.document-preview-toolbar--main {
  align-items: center;
}

.document-preview-toolbar--view {
  justify-content: flex-end;
  padding-top: 2px;
}

.document-preview-toolbar-group {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  position: relative;
}

.document-preview-toolbar-group + .document-preview-toolbar-group {
  margin-left: 5px;
  padding-left: 13px;
}

.document-preview-toolbar-group + .document-preview-toolbar-group::before {
  background: var(--line);
  bottom: 7px;
  content: "";
  left: 0;
  position: absolute;
  top: 7px;
  width: 1px;
}

.document-preview-output-action {
  display: inline-flex;
  flex: 0 0 auto;
  position: relative;
}

.document-preview-output-action [data-preview-output] {
  min-width: 132px;
}

.document-preview-output-action .document-preview-desktop-status {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  bottom: 0;
  box-sizing: border-box;
  color: var(--muted);
  display: flex;
  font-size: 12px;
  font-weight: 700;
  justify-content: center;
  left: 0;
  overflow: hidden;
  padding: 0 8px;
  pointer-events: none;
  position: absolute;
  right: 0;
  text-overflow: ellipsis;
  top: 0;
  white-space: nowrap;
  z-index: 1;
}

.document-preview-output-action .document-preview-desktop-status[hidden] {
  display: none;
}

[data-desktop-pdf-fallback][hidden] {
  display: none !important;
}

.document-preview-desktop-status[data-tone="ok"] {
  color: var(--success);
}

.document-preview-desktop-status[data-tone="error"] {
  color: var(--accent);
}

.segmented-control {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  gap: 0;
  overflow: hidden;
}

.segmented-control button {
  background: transparent;
  border: 0;
  color: var(--muted);
  font-size: 14px;
  min-height: 38px;
  padding: 7px 10px;
}

.segmented-control button + button {
  border-left: 1px solid var(--line-soft);
}

.segmented-control button.is-active {
  background: var(--accent);
  color: #fff;
}

.segmented-control label {
  cursor: pointer;
  display: inline-flex;
  margin: 0;
}

.segmented-control label + label {
  border-left: 1px solid var(--line-soft);
}

.segmented-control label input {
  clip: rect(0 0 0 0);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.segmented-control label span {
  color: var(--muted);
  display: inline-flex;
  font-weight: 800;
  min-height: 34px;
  padding: 8px 12px;
}

.segmented-control label input:checked + span {
  background: var(--accent);
  color: #fff;
}

.document-preview-zoom button {
  min-height: 38px;
}

.document-preview-toolbar .button-primary,
.document-preview-toolbar .button-secondary,
.document-preview-toolbar .segmented-control button {
  font-size: 14px;
  min-height: 38px;
  padding: 7px 11px;
}

.document-preview-zoom {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  gap: 0;
  overflow: hidden;
}

.document-preview-zoom .button-secondary {
  border: 0;
  border-left: 1px solid var(--line-soft);
  border-radius: 0;
  min-width: 40px;
}

.document-preview-zoom .button-secondary:first-child {
  border-left: 0;
}

.document-preview-zoom [data-preview-zoom-value] {
  min-width: 58px;
}

@media (max-width: 1100px) {
  .document-preview-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .document-preview-toolbar-stack {
    width: 100%;
  }

  .document-preview-toolbar--main {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .document-preview-toolbar-group + .document-preview-toolbar-group {
    margin-left: 0;
    padding-left: 0;
  }

  .document-preview-toolbar-group + .document-preview-toolbar-group::before {
    display: none;
  }

  .document-preview-toolbar-group {
    background: var(--surface-soft);
    border-radius: 8px;
    padding: 3px;
  }

  .document-preview-toolbar-group--output {
    flex-wrap: wrap;
  }

  .document-preview-toolbar--view {
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 3px;
  }

  .document-preview-zoom {
    flex: 0 0 auto;
  }
}

.document-preview-frame-shell {
  background: #e9e6e1;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  height: var(--document-preview-height, 820px);
  min-height: max(120px, min(420px, calc(100vh - 260px)));
  overflow: hidden;
  position: relative;
}

.document-preview-resize-handle {
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  border: 1px solid color-mix(in srgb, var(--muted) 28%, transparent);
  border-radius: 7px 0 7px 0;
  bottom: 2px;
  cursor: ns-resize;
  height: 30px;
  padding: 0;
  position: absolute;
  right: 2px;
  touch-action: none;
  user-select: none;
  width: 30px;
  z-index: 3;
}

.document-preview-resize-handle span {
  background: repeating-linear-gradient(
    135deg,
    transparent 0 3px,
    color-mix(in srgb, var(--muted) 66%, transparent) 3px 5px
  );
  bottom: 5px;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
  height: 16px;
  position: absolute;
  right: 5px;
  width: 16px;
}

.document-preview-resize-handle:hover span,
.document-preview-resize-handle:focus-visible span,
body.is-resizing-document-preview .document-preview-resize-handle span {
  background: repeating-linear-gradient(135deg, transparent 0 3px, var(--accent) 3px 5px);
}

.document-preview-resize-handle:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 42%, transparent);
  outline-offset: 2px;
}

.document-preview-frame {
  border: 0;
  display: block;
  height: 100%;
  min-height: 0;
  width: 100%;
}

.document-preview-panel:fullscreen,
.document-preview-panel.is-preview-fullscreen {
  background: var(--bg);
  max-height: none;
  overflow: auto;
  padding: 18px;
}

.document-preview-panel.is-preview-fullscreen {
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1000;
}

.document-preview-panel:fullscreen .document-preview-frame,
.document-preview-panel.is-preview-fullscreen .document-preview-frame {
  height: calc(100vh - 150px);
  min-height: 0;
}

.document-preview-panel:fullscreen .document-preview-frame-shell,
.document-preview-panel.is-preview-fullscreen .document-preview-frame-shell {
  min-height: 0;
}

body.is-document-preview-fullscreen {
  overflow: hidden;
}

.print-document-body {
  background: #e9e6e1;
  color: #111;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.28;
}

.print-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin: 18px auto 0;
  width: min(1180px, calc(100vw - 32px));
}

.print-toolbar .is-active {
  border-color: var(--accent);
  color: var(--accent-dark);
  font-weight: 700;
}

.print-zoom-controls {
  align-items: center;
  display: flex;
  gap: 6px;
}

.print-zoom-controls button {
  min-width: 34px;
  padding-left: 10px;
  padding-right: 10px;
}

.print-zoom-controls [data-zoom-value] {
  color: var(--muted);
  display: inline-block;
  font-weight: 700;
  min-width: 44px;
  text-align: center;
}

.print-viewer {
  align-items: flex-start;
  display: flex;
  justify-content: center;
  margin: 0 auto;
  overflow: auto;
}

.print-is-embedded .print-viewer {
  justify-content: center;
}

.print-is-embedded .print-sheet {
  margin: 14px auto;
}

.print-editor-preview {
  background: #fff;
  margin: 0;
  overflow: hidden;
}

.print-editor-preview .print-viewer {
  display: block;
  margin: 0;
  overflow: hidden;
}

.print-editor-preview .print-sheet {
  box-shadow: none;
  margin: 0;
}

.print-viewer:fullscreen {
  background: #e9e6e1;
  padding: 24px;
}

.print-document-body.is-print-fullscreen {
  overflow: hidden;
}

.print-document-body.is-print-fullscreen .print-toolbar {
  background: #e9e6e1;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  left: 0;
  margin: 0;
  padding: 10px 16px;
  position: fixed;
  right: 0;
  top: 0;
  width: auto;
  z-index: 20;
}

.print-document-body.is-print-fullscreen .print-viewer {
  background: #e9e6e1;
  bottom: 0;
  left: 0;
  padding: 24px;
  position: fixed;
  right: 0;
  top: 56px;
  z-index: 19;
}

.print-sheet {
  background: #fff;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
  display: flex;
  flex-direction: column;
  margin: 24px auto;
  min-height: 1120px;
  padding: 38px 28px 22px;
  position: relative;
  width: 794px;
}

.print-sheet > *:not(.print-reference-underlay) {
  position: relative;
  z-index: 1;
}

.print-has-template-layout .print-sheet {
  display: block;
  height: 297mm;
  min-height: 297mm;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 210mm;
}

.print-has-template-layout .print-sheet > .offer-print-top,
.print-has-template-layout .print-sheet > .offer-print-closing {
  display: block;
  margin: 0;
  padding: 0;
  position: static;
}

.print-has-template-layout [data-template-block] {
  box-sizing: border-box;
  margin: 0;
  z-index: 1;
}

.print-has-template-layout .print-letterhead {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 0;
  padding: 0;
}

.print-has-template-layout .print-window-address,
.print-has-template-layout .print-document-meta,
.print-has-template-layout .sales-document-print-sheet .print-window-address,
.print-has-template-layout .sales-document-meta,
.print-has-template-layout .delivery-note-meta {
  transform: none;
}

.print-has-template-layout .offer-print-items,
.print-has-template-layout .print-free-text,
.print-has-template-layout .offer-print-note,
.print-has-template-layout .offer-print-signature,
.print-has-template-layout .sales-document-barcode,
.print-has-template-layout .print-footer {
  margin: 0;
}

.print-has-template-layout .print-free-text {
  padding: 0;
}

.print-has-template-layout .print-footer {
  min-height: 0;
  padding: 0;
}

.print-has-template-layout .work-order-production-header {
  display: block;
  margin: 0;
  padding: 0;
  position: static;
}

.print-has-template-layout .work-order-production-meta,
.print-has-template-layout .work-order-production-title,
.print-has-template-layout .work-order-production-basics,
.print-has-template-layout .work-order-production-section,
.print-has-template-layout .work-order-production-note,
.print-has-template-layout .work-order-production-bottom {
  margin: 0;
}

.print-has-template-layout .work-order-logo-slot,
.print-has-template-layout .work-order-number-box {
  min-height: 0;
}

.print-has-template-layout .work-order-logo-slot {
  padding: 0;
}

.print-reference-underlay {
  height: 100%;
  inset: 0;
  object-fit: contain;
  opacity: 0.34;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 0;
}

.print-letterhead {
  align-items: center;
  display: flex;
  justify-content: center;
  justify-items: center;
  margin-bottom: 46px;
  min-height: 104px;
}

.print-logo {
  display: block;
  height: auto;
  width: 178px;
}

.print-letterhead-placeholder {
  min-height: 104px;
  width: 178px;
}

.offer-print-top {
  display: grid;
  gap: 56px;
  grid-template-columns: minmax(0, 1fr) 336px;
  margin-bottom: 54px;
  padding: 0 16px;
}

.print-client-box,
.print-document-meta {
  display: grid;
  gap: 4px;
}

.print-client-box strong {
  font-style: italic;
}

.print-window-address {
  transform: translateX(28px);
}

.print-document-meta {
  transform: translateX(18px);
}

.print-document-meta h1 {
  font-size: 25px;
  font-style: italic;
  font-weight: 500;
  margin: 0 0 8px;
}

.print-document-meta dl,
.offer-print-total dl {
  display: grid;
  gap: 2px 8px;
  grid-template-columns: max-content minmax(0, 1fr);
  margin: 0;
}

.print-document-meta dd,
.offer-print-total dd {
  margin: 0;
}

.print-free-text {
  margin: 24px 0;
  padding: 0 6px;
  white-space: pre-line;
}

.offer-print-sheet > .print-free-text {
  margin: 20px 0 14px;
}

.print-free-text p {
  margin: 0 0 3px;
}

.print-free-text p:last-child {
  margin-bottom: 0;
}

.offer-print-items {
  margin-top: 4px;
}

.offer-print-table {
  border-collapse: collapse;
  font-size: 11px;
  width: 100%;
}

.offer-print-table th {
  border-bottom: 1px solid #222;
  border-top: 1px solid #222;
  font-size: 10px;
  line-height: 1.1;
  padding: 4px 6px 3px;
  text-align: center;
  vertical-align: bottom;
}

.offer-print-table th:nth-child(2) {
  text-align: left;
}

.offer-print-table th:nth-child(1),
.offer-print-table td:nth-child(1) {
  width: 62px;
}

.offer-print-table th:nth-child(1) span {
  white-space: nowrap;
}

.offer-print-table th span,
.offer-print-table th small {
  display: block;
}

.offer-print-table th small {
  color: #000;
  font-size: 8px;
  font-weight: 400;
  margin-top: 3px;
}

.offer-print-table td {
  border-bottom: 0.25px solid #b3b3b3;
  font-size: 13px;
  padding: 5px 6px;
  text-align: center;
  vertical-align: top;
}

.offer-print-table td:nth-child(2) {
  text-align: left;
  width: 48%;
}

.offer-print-table td:nth-child(3),
.offer-print-table td:nth-child(4),
.offer-print-table td:nth-child(5),
.offer-print-table td:nth-child(6) {
  white-space: nowrap;
}

.offer-print-table td:nth-child(5),
.offer-print-table td:nth-child(6) {
  text-align: right;
}

.offer-print-table .offer-print-group-row td {
  background: #fff;
  border-bottom: 0.25px solid #b3b3b3;
  font-size: 13px;
  padding-top: 7px;
}

.offer-print-table .offer-print-detail-row td {
  border-bottom: 0.25px solid #b3b3b3;
  font-size: 11px;
}

.offer-print-table .offer-print-detail-row td:nth-child(2) {
  padding-left: 18px;
}

.offer-print-table .offer-print-detail-row.is-remainder td {
  color: #333;
}

.offer-print-item-spec {
  color: #333;
  display: block;
  font-size: 12px;
  line-height: 1.25;
  margin-top: 3px;
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offer-print-item-spec span + span::before {
  content: " | ";
}

.offer-print-item-description {
  font-weight: 400;
  margin-top: 1px;
}

.offer-print-spec-list {
  color: #111;
  display: grid;
  font-size: 10px;
  gap: 1px 10px;
  grid-template-columns: 48px minmax(0, 1fr);
  line-height: 1.25;
  margin: 4px 0 0;
}

.offer-print-spec-list dt,
.offer-print-spec-list dd {
  margin: 0;
}

.offer-print-total {
  align-items: flex-start;
  display: flex;
  justify-content: flex-end;
}

.offer-print-total dl {
  align-items: center;
  column-gap: 18px;
  min-width: 330px;
  row-gap: 1mm;
}

.offer-print-total dt {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  font-style: italic;
  font-weight: 700;
  justify-content: center;
  line-height: 1.05;
  text-align: right;
  text-transform: uppercase;
}

.print-total-label-translation {
  display: block;
  font-size: 9.5px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.05;
  margin-top: 1px;
  text-transform: none;
}

.offer-print-total dd {
  font-size: 13.5px;
  line-height: 1.05;
  text-align: right;
}

.offer-print-total dt:last-of-type {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.offer-print-total dd:last-of-type {
  align-items: center;
  border: 2px solid #222;
  display: flex;
  font-size: 16px;
  justify-content: flex-end;
  line-height: 1;
  min-height: 26px;
  padding: 3px 10px;
}

.offer-print-closing {
  align-items: start;
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1fr) 330px;
  margin: 12px 0 20px;
}

.offer-print-note {
  font-size: 8pt;
  line-height: 1.08;
  margin: 8px 0 0;
  white-space: normal;
}

.offer-print-note p {
  margin: 0;
  white-space: pre-line;
}

.offer-print-note .print-note-primary {
  font-size: 8pt;
  line-height: 1.08;
}

.offer-print-note .print-note-translation {
  font-size: 7pt;
  line-height: 1.02;
  margin-top: 0;
}

.offer-print-note .print-note-tax {
  font-size: 8pt;
  line-height: 1.04;
  margin-top: 8px;
}

.offer-print-note .print-note-bank-account {
  font-weight: 800;
}

.offer-print-signature {
  font-size: 12px;
  font-style: italic;
  line-height: 1.25;
  margin-top: 58px;
  text-align: center;
  white-space: pre-line;
}

.sales-document-signature [data-signature-anchor-content] {
  display: inline-block;
}

.delivery-note-signatures {
  align-items: flex-start;
  display: flex;
  font-style: normal;
  gap: 24mm;
  justify-content: space-between;
  text-align: left;
  white-space: normal;
  width: 100%;
}

.print-has-template-layout .delivery-note-signatures {
  left: 22mm !important;
  margin: 0;
  min-height: 24mm !important;
  width: 166mm !important;
}

.delivery-note-signature {
  align-items: center;
  color: #000;
  display: flex;
  flex: 0 1 64mm;
  flex-direction: column;
  font-size: 11px;
  line-height: 1.25;
  min-width: 54mm;
}

.delivery-note-signature-line {
  border-top: 1px solid #333;
  display: block;
  margin-bottom: 5px;
  width: 100%;
}

.delivery-note-signature strong {
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.print-window-address.sales-document-address {
  display: block;
  font-size: 14px;
  line-height: 1.04;
  transform: translate(30px, 6px);
}

.print-window-address.sales-document-address strong {
  display: block;
  font-weight: 800;
  margin-bottom: 12px;
}

.print-window-address.sales-document-address span {
  display: block;
  margin: 0;
}

.sales-document-oib {
  font-size: 13.4px;
  font-weight: 800;
  padding-top: 9px;
}

.sales-document-attention {
  padding-top: 2px;
}

.offer-print-address .sales-document-oib {
  font-size: inherit;
  font-weight: 400;
  padding-top: 0;
}

.offer-print-address .sales-document-attention {
  padding-top: 9px;
}

.sales-document-meta {
  font-size: 14px;
  transform: translate(0, -4px);
}

.sales-document-heading {
  display: grid;
  gap: 2px 8px;
  grid-template-columns: 188px minmax(0, 1fr);
  margin-bottom: 7px;
}

.sales-document-kind {
  font-size: 14px;
  font-style: italic;
  font-weight: 800;
}

.sales-document-place {
  font-size: 11px;
  justify-self: start;
  line-height: 1.2;
}

.sales-document-heading h1 {
  font-size: 25px;
  line-height: 1.08;
  margin: 0;
  white-space: nowrap;
}

.print-sales-document-storno .sales-document-heading h1 {
  font-size: 21px;
}

.sales-document-heading small {
  display: block;
  font-size: 9.5px;
  font-style: italic;
  line-height: 1.05;
}

.sales-document-number {
  align-self: start;
  font-size: 25px;
  font-weight: 600;
  line-height: 1.1;
}

.sales-document-meta dl {
  gap: 2px 12px;
  grid-template-columns: 188px minmax(0, 1fr);
}

.sales-document-meta dt,
.sales-document-meta dd {
  line-height: 1.05;
}

.sales-document-meta dd {
  white-space: nowrap;
}

.sales-document-meta dt small {
  display: block;
  font-size: 9px;
  font-style: italic;
  font-weight: 400;
}

.sales-document-barcode {
  display: flex;
  justify-content: flex-end;
  margin: 8px 10px 0 0;
}

.sales-document-barcode img {
  display: block;
  height: auto;
  max-height: 70px;
  max-width: 250px;
}

.delivery-note-meta {
  transform: translate(8px, 0);
}

.delivery-note-print-table td:nth-child(3),
.delivery-note-print-table td:nth-child(4),
.delivery-note-print-table td:nth-child(5),
.delivery-note-print-table td:nth-child(6) {
  text-align: center;
  white-space: nowrap;
}

.work-order-production-body .print-toolbar .is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.work-order-production-viewer {
  display: grid;
  gap: 18px;
}

.work-order-production-sheet {
  color: #000;
  display: block;
  font-size: 11px;
  line-height: 1.22;
  min-height: 297mm;
  padding: 18mm 14mm 14mm;
}

.work-order-production-page {
  break-after: page;
  page-break-after: always;
}

.work-order-production-page:last-child {
  break-after: auto;
  page-break-after: auto;
}

.work-order-production-header {
  align-items: start;
  display: grid;
  grid-template-columns: 70mm 1fr;
  margin-bottom: 10mm;
}

.work-order-logo-slot {
  align-items: center;
  display: flex;
  height: 18mm;
  justify-content: flex-start;
  width: 65.25mm;
}

.work-order-logo-slot img {
  display: block;
  filter: grayscale(1) contrast(1000%);
  max-height: 18mm;
  max-width: 65.25mm;
  object-fit: contain;
}

.work-order-number-box {
  justify-self: end;
  min-width: 72mm;
  padding-top: 2mm;
  text-align: left;
}

.work-order-number-box h1 {
  font-size: 25px;
  font-style: italic;
  font-weight: 600;
  line-height: 1.08;
  margin: 0;
}

.work-order-number-box p {
  font-size: 9px;
  margin: 2mm 0 0;
}

.work-order-production-meta {
  display: grid;
  gap: 12mm;
  grid-template-columns: 1fr 72mm;
  margin-bottom: 9mm;
}

.work-order-production-meta p,
.work-order-production-title p,
.work-order-production-note p {
  margin: 0 0 2mm;
}

.work-order-production-title {
  border-bottom: 1px solid #000;
  margin-bottom: 5mm;
  padding-bottom: 2mm;
}

.work-order-production-title h2 {
  font-size: 18px;
  line-height: 1.08;
  margin: 0 0 1mm;
}

.work-order-production-basics {
  display: grid;
  gap: 2mm 10mm;
  grid-template-columns: 1.25fr 1fr 1fr;
  margin-bottom: 7mm;
}

.work-order-production-section {
  break-inside: avoid;
  margin-bottom: 7mm;
}

.work-order-production-section h3,
.work-order-production-note h3 {
  font-size: 13px;
  margin: 0 0 2mm;
}

.work-order-production-table {
  border-collapse: collapse;
  width: 100%;
}

.work-order-production-table th,
.work-order-production-table td {
  border-bottom: 1px solid #000;
  font-size: 10.5px;
  padding: 2mm 2mm 1.6mm;
  text-align: left;
  vertical-align: top;
}

.work-order-production-table th {
  font-weight: 700;
}

.work-order-production-note {
  break-inside: avoid;
  min-height: 34mm;
}

.work-order-production-bottom {
  align-items: end;
  display: grid;
  gap: 8mm 12mm;
  grid-template-columns: 1.45fr 0.85fr 0.85fr;
  margin-top: auto;
  padding-top: 10mm;
}

.work-order-production-bottom div {
  border-bottom: 1px solid #000;
  min-height: 9mm;
  padding-bottom: 1mm;
}

.work-order-production-sheet svg,
.work-order-production-sheet svg * {
  color: #000;
  fill: #000;
  stroke: #000;
}

.work-order-bottom-wide {
  grid-column: span 2;
}

.print-footer {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: 1.05fr 1fr 1.46fr 1.18fr;
  margin-top: auto;
  min-height: 54px;
  padding: 14px 2px 0;
  font-size: 9.5px;
  line-height: 1.12;
  color: #422216;
}

.print-footer section {
  display: grid;
  gap: 6px;
  grid-template-columns: 8px minmax(0, 1fr);
}

.print-footer p {
  margin: 0;
  white-space: nowrap;
}

.print-footer-marker {
  background: transparent;
  border: 4px solid var(--accent);
  box-sizing: border-box;
  display: inline-block;
  height: 8px;
  margin-top: 1px;
  width: 8px;
}

.print-footer-placeholder {
  visibility: hidden;
}

.print-page-numbering {
  box-sizing: border-box;
  color: #625b57;
  font-size: 8pt;
  left: 7.4mm;
  line-height: 1.05;
  pointer-events: none;
  position: absolute;
  text-align: center;
  top: 260mm;
  width: 195.2mm;
  z-index: 2;
}

.print-page-numbering small {
  display: block;
  font-size: 6.5pt;
  margin-top: 0.6mm;
}

.print-supports-pagination .offer-print-table thead {
  display: table-header-group;
}

.print-supports-pagination .offer-print-table tr,
.print-supports-pagination .offer-print-closing,
.print-supports-pagination .sales-document-barcode,
.print-supports-pagination .offer-print-signature,
.print-supports-pagination .print-footer {
  break-inside: avoid;
  page-break-inside: avoid;
}

.print-multipage-document .print-viewer {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.print-multipage-document .print-sheet {
  flex: 0 0 auto;
  min-height: 297mm;
}

.print-multipage-document.print-has-template-layout .print-sheet {
  height: 297mm;
  overflow: hidden;
}

.print-multipage-document .offer-print-items {
  overflow: hidden;
}

.print-multipage-document .offer-print-table {
  margin: 0;
}

.offer-profile-monthly-hours .offer-print-table td {
  line-height: 1.18;
  padding: 3px 6px;
}

.offer-profile-monthly-hours .offer-print-table td:nth-child(2) {
  width: 54%;
}

.offer-profile-monthly-hours .offer-print-table td strong {
  font-weight: 500;
}

.print-pdf-render {
  background: #fff;
  margin: 0;
  padding: 0;
}

.print-pdf-render .print-viewer {
  display: block;
  margin: 0;
  overflow: visible;
}

.print-pdf-render .print-sheet {
  box-shadow: none;
  box-sizing: border-box;
  height: 297mm;
  margin: 0 !important;
  min-height: 297mm;
  overflow: hidden;
  page-break-after: always;
  width: 210mm;
}

.print-pdf-render .print-sheet:last-child {
  page-break-after: auto;
}

.print-pdf-render.print-has-template-layout .print-sheet {
  padding: 0;
}

.print-pdf-render:not(.print-has-template-layout) .print-sheet {
  padding: 10mm 7.4mm 5.8mm;
}

@media print {
  @page {
    margin: 0;
    size: A4;
  }

  html,
  body {
    margin: 0;
    padding: 0;
    width: 210mm;
  }

  .print-document-body {
    background: #fff;
    margin: 0;
    padding: 0;
  }

  .print-toolbar {
    display: none;
  }

  .print-viewer {
    display: block;
    margin: 0;
    overflow: visible;
  }

  .print-reference-underlay {
    display: none;
  }

  .print-sheet {
    box-sizing: border-box;
    box-shadow: none;
    margin: 0 !important;
    min-height: 296.5mm;
    padding: 10mm 7.4mm 5.8mm;
    width: 210mm;
    zoom: 1 !important;
  }

  .print-supports-pagination:not(.print-multipage-document) .print-sheet {
    display: block;
    height: auto;
    min-height: 296.5mm;
    padding-bottom: 18mm;
  }

  .print-supports-pagination:not(.print-multipage-document) .print-footer {
    margin-top: 12mm;
  }

  .print-supports-pagination.print-has-template-layout:not(.print-multipage-document) .print-sheet {
    display: block;
    height: 297mm;
    min-height: 297mm;
    overflow: hidden;
    padding: 0;
  }

  .print-supports-pagination.print-has-template-layout:not(.print-multipage-document) .print-footer {
    margin-top: 0;
  }

  .print-multipage-document .print-viewer {
    display: block;
  }

  .print-multipage-document .print-sheet {
    break-after: page;
    height: 297mm;
    min-height: 297mm;
    overflow: hidden;
    page-break-after: always;
  }

  .print-multipage-document .print-sheet:last-child {
    break-after: auto;
    page-break-after: auto;
  }

  .print-document-body:not(.print-has-template-layout) .work-order-production-sheet {
    color: #000;
    min-height: 297mm;
    padding: 18mm 14mm 14mm;
  }
}

@media (max-width: 1280px) {
  .document-detail-workspace {
    grid-template-columns: 1fr;
  }

  .document-detail-resizer {
    display: none;
  }

  .document-detail-process-side {
    position: static;
  }

  .document-preview-panel {
    max-height: none;
    position: static;
  }

  .document-preview-frame-shell {
    min-height: 620px;
  }
}

.totals-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  margin-left: auto;
  max-width: 360px;
  padding: 18px;
}

.studio-total-panel {
  margin-top: 18px;
}

.studio-total-panel .definition-list {
  grid-template-columns: minmax(0, 1fr) auto;
}

.studio-total-panel .definition-list dd {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.studio-total-panel .definition-list dt:last-of-type,
.studio-total-panel .definition-list dd:last-of-type {
  border-top: 1px solid var(--line-soft);
  color: var(--accent-dark);
  font-size: 16px;
  padding-top: 10px;
}

.text-panel {
  margin-bottom: 18px;
  white-space: pre-line;
}

.nested-detail-grid {
  margin-top: 18px;
}

.request-item-cards {
  display: grid;
  gap: 12px;
}

.request-view {
  display: grid;
  gap: 12px;
}

.request-view[hidden] {
  display: none;
}

.request-type-group {
  border: 1px solid var(--line);
}

.request-type-group-header {
  align-items: center;
  background: #faf9f6;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding: 13px 14px;
}

.request-type-group-header h3 {
  color: var(--accent);
  font-size: 17px;
  margin: 0;
}

.request-type-group-header span {
  border: 1px solid var(--line);
  color: var(--text);
  font-size: 12px;
  padding: 3px 7px;
}

.request-type-group-items {
  display: grid;
}

.request-group-item {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.42fr);
  padding: 14px;
}

.request-group-item:last-child {
  border-bottom: 0;
}

.request-group-copy h3 {
  font-size: 16px;
  margin: 0 0 6px;
}

.request-group-copy p {
  margin: 0;
}

.request-group-details {
  align-content: start;
  display: grid;
  gap: 7px;
}

.request-group-details div {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(82px, 0.6fr) minmax(0, 1fr);
}

.request-group-details span {
  color: var(--text);
}

.request-group-details strong {
  text-align: right;
}

.request-item-card {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
  padding: 14px 0;
}

.request-item-card:first-child {
  border-top: 0;
  padding-top: 0;
}

.request-card-main {
  display: grid;
  gap: 12px;
  grid-template-columns: 32px minmax(0, 1fr);
}

.request-card-number {
  align-items: center;
  border: 1px solid var(--line);
  color: var(--muted);
  display: flex;
  font-weight: 700;
  height: 28px;
  justify-content: center;
}

.request-card-meta {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 4px;
}

.request-card-main h3 {
  font-size: 16px;
  margin: 0 0 4px;
}

.request-card-main p {
  margin: 4px 0 0;
}

.request-card-details {
  display: grid;
  gap: 7px;
}

.request-card-details div {
  display: grid;
  gap: 8px;
  grid-template-columns: 76px minmax(0, 1fr);
}

.request-card-details span {
  color: var(--muted);
}

.request-workflow-card {
  border: 1px solid var(--line);
  display: grid;
  gap: 12px;
  padding: 14px;
}

.request-view-workflow {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.request-workflow-header {
  align-content: start;
  display: grid;
  gap: 8px;
}

.request-workflow-header h3 {
  font-size: 16px;
  margin: 0 0 6px;
}

.request-workflow-meta {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}

.request-workflow-meta span {
  white-space: normal;
}

.request-workflow-steps {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.request-workflow-steps li {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 18px minmax(0, 1fr);
}

.workflow-dot {
  border: 1px solid var(--line);
  height: 10px;
  margin-left: 4px;
  width: 10px;
}

.request-workflow-steps .is-done .workflow-dot {
  background: var(--accent);
  border-color: var(--accent);
}

.request-next-action {
  border-top: 1px solid var(--line);
  color: var(--accent-dark);
  font-weight: 700;
  padding-top: 10px;
}

.request-scan-wrapper {
  overflow-x: visible;
}

.request-scan-table {
  table-layout: auto;
  width: 100%;
}

.request-scan-table td strong,
.request-scan-table td .muted {
  display: block;
}

.request-scan-details {
  display: grid;
  gap: 5px;
  margin: 0;
}

.request-scan-details div {
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(58px, 0.55fr) minmax(0, 1fr);
}

.request-scan-details dt {
  color: var(--muted);
}

.request-scan-details dd {
  margin: 0;
}

.calculation-request-groups {
  display: grid;
  gap: 14px;
}

.calculation-request-group {
  border: 1px solid var(--line);
}

.calculation-request-group-header {
  align-items: center;
  background: #faf9f6;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding: 13px 14px;
}

.calculation-request-group-header h3 {
  color: var(--accent);
  font-size: 17px;
  margin: 0;
}

.calculation-request-group-header span {
  border: 1px solid var(--line);
  font-size: 12px;
  padding: 3px 7px;
}

.calculation-request-group-items {
  display: grid;
}

.calculation-request-item {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 14px;
}

.calculation-request-item:last-child {
  border-bottom: 0;
}

.calculation-request-item.is-missing {
  background: #fffaf8;
  box-shadow: inset 4px 0 0 var(--accent);
}

.calculation-request-item.is-covered {
  background: #fbfdfb;
  box-shadow: inset 4px 0 0 #2f8f62;
}

.calculation-request-title {
  align-items: baseline;
  display: flex;
  gap: 8px;
}

.calculation-request-title span {
  color: var(--muted);
  font-weight: 700;
}

.calculation-request-title h3 {
  font-size: 16px;
  margin: 0;
}

.calculation-request-primary p {
  margin: 6px 0 0;
}

.calculation-request-status {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.calculation-request-status a {
  color: var(--accent-dark);
  font-weight: 800;
}

.calculation-request-missing {
  color: var(--accent-dark);
  display: inline-block;
  font-size: 12px;
  font-weight: 800;
  margin-top: 10px;
  text-transform: uppercase;
}

.calculation-request-material,
.calculation-request-other {
  align-content: start;
  display: grid;
  gap: 8px;
}

.calculation-request-material h4,
.calculation-request-other h4 {
  color: var(--muted);
  font-size: 12px;
  margin: 0 0 2px;
  text-transform: uppercase;
}

.calculation-request-material div,
.calculation-request-other div {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(64px, 0.65fr) minmax(0, 1fr);
}

.calculation-request-material span,
.calculation-request-other span {
  color: var(--muted);
}

.calculation-request-material strong,
.calculation-request-other strong {
  text-align: left;
}

.calculation-request-other .button-secondary {
  margin-top: 6px;
  width: 100%;
}

.calculation-editor {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 340px;
}

.calculation-editor-main {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.calculation-project-summary {
  background: var(--surface);
  border: 1px solid var(--line);
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 16px 18px;
}

.calculation-project-summary div {
  display: grid;
  gap: 4px;
}

.calculation-project-summary span,
.calculation-basic-grid label,
.calculation-preview-cards span,
.calculation-total-box span {
  color: var(--muted);
}

.calculation-project-summary span {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.calculation-project-summary strong {
  font-size: 16px;
}

.service-type-panel {
  display: grid;
  gap: 14px;
}

.service-type-details {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.service-type-details div {
  background: #fbf5f4;
  border: 1px solid var(--line);
  padding: 10px 12px;
}

.service-type-details dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 4px;
}

.service-type-details dd {
  margin: 0;
}

.calculation-tabs {
  background: var(--surface);
  border: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  overflow: hidden;
  width: 100%;
}

.calculation-tabs a {
  align-items: center;
  border-bottom: 4px solid transparent;
  border-right: 1px solid var(--line-soft);
  color: var(--muted);
  display: flex;
  font-size: 15px;
  font-weight: 700;
  justify-content: center;
  min-height: 58px;
  min-width: 0;
  padding: 16px 14px 13px;
  position: relative;
  text-align: center;
  transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.calculation-tabs a:last-child {
  border-right: 0;
}

.calculation-tabs a:hover,
.calculation-tabs a.is-active {
  background: #fbf5f4;
  color: var(--accent);
}

.calculation-tabs a.is-active {
  border-bottom-color: var(--accent);
  box-shadow: inset 0 4px 0 var(--accent);
  color: var(--accent-dark);
  font-weight: 800;
}

.calculation-tabs a:focus-visible {
  outline: 3px solid rgba(180, 21, 19, 0.3);
  outline-offset: -3px;
  z-index: 1;
}

.calculation-tab-panel {
  display: grid;
  gap: 18px;
}

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

.calculation-field-wide {
  grid-column: 1 / -1;
}

.calculation-structure-panel {
  align-items: end;
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 14px 18px;
  grid-template-columns: minmax(260px, 1fr) auto;
  padding: 16px;
}

.calculation-structure-panel label {
  margin: 0;
}

.calculation-structure-panel .section-hint {
  margin: 8px 0 0;
}

.calculation-structure-panel > .button-secondary {
  align-self: start;
  margin-top: 26px;
}

.calculation-preview-cards,
.calculation-cost-panels,
.calculation-cutting-preview,
.calculation-material-panels {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.calculation-preview-cards article,
.placeholder-panel,
.imposition-placeholder,
.calculation-note-panel {
  background: #fbf5f4;
  border: 1px solid var(--line);
  padding: 16px;
}

.calculation-preview-cards article {
  display: grid;
  gap: 6px;
}

.calculation-preview-cards strong {
  color: var(--accent);
  font-size: 28px;
}

.calculation-preview-cards .is-strong {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.calculation-preview-cards .is-strong span,
.calculation-preview-cards .is-strong strong {
  color: #fff;
}

.component-switcher {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 14px;
  padding: 16px;
}

.component-switcher-header {
  align-items: end;
  display: flex;
  gap: 18px;
  justify-content: space-between;
}

.component-switcher-header span {
  color: var(--accent-dark);
  display: block;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.component-switcher-header strong {
  display: block;
  font-size: 22px;
  margin-top: 4px;
}

.component-switcher-header p {
  color: var(--muted);
  margin: 0;
  max-width: 520px;
  text-align: right;
}

.component-switcher-list {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.component-switcher-card {
  background: #fbf5f4;
  border: 1px solid var(--line);
  color: inherit;
  display: grid;
  gap: 4px;
  padding: 12px;
  text-decoration: none;
}

.component-switcher-card:hover,
.component-switcher-card.is-active {
  border-color: var(--button-red);
}

.component-switcher-card.is-active {
  background: #fff0ee;
  box-shadow: inset 4px 0 0 var(--button-red);
}

.component-switcher-card span {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.component-switcher-card strong {
  font-size: 16px;
}

.component-switcher-card small {
  color: var(--muted);
}

.calculation-component-form,
.calculation-component-list,
.calculation-component-card {
  display: grid;
  gap: 16px;
}

.calculation-component-card {
  background: #fff;
  border: 1px solid var(--line);
}

.calculation-component-card.is-active {
  border-color: var(--button-red);
  box-shadow: inset 4px 0 0 var(--button-red);
}

.calculation-component-card-header {
  align-items: center;
  background: #fbf5f4;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 14px 16px;
}

.calculation-component-card-header span {
  color: var(--accent-dark);
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.calculation-component-card-header strong {
  display: block;
  font-size: 18px;
  margin-top: 4px;
}

.component-active-badge {
  background: #fff;
  border: 1px solid var(--button-red);
  color: var(--button-red);
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  justify-content: center;
  padding: 6px 10px;
  text-transform: uppercase;
}

.component-field-grid {
  display: grid;
  gap: 14px 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 16px;
}

.calculation-table-wrap {
  border: 1px solid var(--line);
  overflow-x: auto;
}

.calculation-material-card-list {
  display: grid;
  gap: 14px;
}

.calculation-material-picker-main {
  display: grid;
  gap: 6px;
}

.calculation-material-card {
  border: 1px solid var(--line);
  display: grid;
}

.calculation-material-card.is-primary {
  border: 2px solid #cf817b;
  box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.05), inset 5px 0 0 var(--accent);
}

.calculation-material-card-header {
  align-items: center;
  background: #fbf5f4;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 12px 14px;
}

.calculation-material-card-header h3 {
  color: var(--text);
  font-size: 19px;
  margin: 0;
}

.calculation-material-card-header p {
  color: var(--muted);
  margin: 2px 0 0;
}

.material-card-state {
  display: grid;
  gap: 2px;
  justify-items: end;
  text-align: right;
}

.material-card-state strong {
  color: var(--text);
  font-size: 13px;
}

.material-card-state span {
  color: var(--muted);
  font-size: 12px;
}

.material-card-badge {
  border: 1px solid var(--line);
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
  padding: 4px 8px;
}

.calculation-material-card-body {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(220px, 1.05fr) minmax(300px, 1.6fr) minmax(160px, 0.75fr);
  padding: 14px;
}

.calculation-material-source-section {
  display: grid;
  gap: 12px;
  padding: 14px 16px 16px 20px;
}

.material-step-heading {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.material-step-heading > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.material-step-heading h3,
.material-step-heading h4,
.material-step-heading p {
  margin: 0;
}

.material-step-heading h3,
.material-step-heading h4 {
  color: var(--text);
}

.material-step-heading p {
  color: var(--muted);
  font-size: 13px;
}

.material-step-number {
  align-items: center;
  background: #fff0ef;
  border-radius: 999px;
  color: var(--accent);
  display: inline-flex;
  flex: 0 0 28px;
  font-size: 13px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
}

.calculation-material-source-section > .material-step-heading > a {
  color: var(--accent-dark);
  font-size: 13px;
  font-weight: 800;
  margin-left: auto;
  text-decoration: none;
}

.material-source-grid {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(240px, 0.85fr) minmax(460px, 1.8fr);
}

.material-choice-panel,
.material-supplier-panel {
  align-content: start;
  border: 1px solid var(--line);
  display: grid;
}

.material-choice-panel {
  background: #fbfaf8;
  gap: 10px;
  padding: 12px;
}

.material-choice-panel > p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
  margin: 2px 0 0;
}

.material-identity-chips {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 24px;
}

.material-identity-chips span {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 700;
  height: 24px;
  padding: 0 9px;
}

.material-supplier-panel {
  overflow: hidden;
}

.material-supplier-panel > h5 {
  background: #fbfaf8;
  border-bottom: 1px solid var(--line);
  color: var(--accent-dark);
  font-size: 12px;
  margin: 0;
  padding: 9px 11px;
  text-transform: uppercase;
}

.calculation-material-processing-scope {
  border: 2px solid #cf817b;
  box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.05), inset 5px 0 0 var(--accent);
  display: grid;
  gap: 16px;
  overflow: hidden;
}

.calculation-material-processing-header {
  align-items: center;
  background: #fff4f3;
  border-bottom: 1px solid #e6b9b5;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 15px 16px 15px 20px;
}

.calculation-material-processing-header > div {
  display: grid;
  gap: 5px;
}

.calculation-material-processing-header > .material-step-heading {
  align-items: center;
  display: flex;
  gap: 12px;
}

.calculation-material-processing-header h3,
.calculation-material-processing-header p,
.calculation-material-manual-workspace h3,
.calculation-material-manual-workspace p,
.calculation-material-additional h3 {
  margin: 0;
}

.calculation-material-processing-header p,
.calculation-material-manual-workspace p {
  color: var(--muted);
}

.calculation-material-processing-header label {
  min-width: 220px;
}

.material-processing-header-actions {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.material-processing-header-actions label {
  min-width: 190px;
}

.material-finished-piece-profile {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
  min-width: 220px;
  padding: 9px 12px;
}

.material-finished-piece-profile span {
  color: var(--muted);
  font-size: 12px;
}

.finished-piece-calculation-note {
  background: #f1faf5;
  border: 1px solid #9ed5b5;
  border-left: 4px solid #17824c;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.finished-piece-calculation-note p {
  margin: 0;
}

.calculation-material-processing-scope .calculation-cutting-preview {
  align-items: start;
  grid-template-columns: minmax(290px, 0.72fr) minmax(480px, 1.55fr);
}

.calculation-material-processing-scope .calculation-cutting-setup {
  align-self: start;
}

.material-result-section {
  background: #fffaf0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 14px 16px 16px;
}

.material-result-section .material-procurement-panel {
  border: 0;
}

@media (max-width: 1180px) {
  .material-source-grid,
  .calculation-material-processing-scope .calculation-cutting-preview,
  .material-card-inline-result {
    grid-template-columns: 1fr;
  }

  .supplier-price-card {
    grid-template-columns: auto repeat(2, minmax(0, 1fr)) 76px;
    grid-template-rows: repeat(2, minmax(0, auto));
    min-height: 96px;
  }

  .supplier-price-card > .supplier-radio-dot {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .supplier-price-card > .supplier-price-detail:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .supplier-price-card > .supplier-price-detail:nth-of-type(3) {
    grid-column: 3;
    grid-row: 1;
  }

  .supplier-price-card > .supplier-price-detail:nth-of-type(4) {
    grid-column: 2;
    grid-row: 2;
  }

  .supplier-price-card > .supplier-price-detail:nth-of-type(5) {
    grid-column: 3;
    grid-row: 2;
  }

  .supplier-price-tag-slot {
    align-self: center;
    grid-column: 4;
    grid-row: 1 / span 2;
  }

}

@media (max-width: 760px) {
  .calculation-material-source-section > .material-step-heading,
  .calculation-material-processing-header,
  .material-manual-entry {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .calculation-material-source-section > .material-step-heading {
    flex-wrap: wrap;
  }

  .calculation-material-source-section > .material-step-heading > a {
    margin-left: 40px;
  }

  .material-card-state {
    justify-items: start;
    text-align: left;
  }

  .supplier-price-card {
    align-items: start;
    gap: 8px;
    grid-template-columns: auto minmax(0, 1fr) 76px;
    min-height: 0;
    padding: 12px;
  }

  .supplier-price-detail {
    grid-column: 2;
    grid-row: auto;
  }

  .supplier-price-card > .supplier-price-detail:nth-of-type(2),
  .supplier-price-card > .supplier-price-detail:nth-of-type(3),
  .supplier-price-card > .supplier-price-detail:nth-of-type(4),
  .supplier-price-card > .supplier-price-detail:nth-of-type(5) {
    grid-column: 2;
    grid-row: auto;
  }

  .supplier-price-tag-slot {
    grid-column: 3;
    grid-row: 1 / span 4;
  }

  .material-processing-header-actions,
  .material-processing-header-actions label {
    min-width: 0;
    width: 100%;
  }

  .calculation-material-processing-scope .calculation-cutting-controls,
  .manual-layout-panel,
  .calculation-material-processing-scope .grouped-layout-panel {
    grid-template-columns: 1fr;
  }

}

.calculation-material-processing-scope > .calculation-cutting-preview,
.calculation-material-processing-scope > .calculation-cutting-results,
.calculation-material-processing-scope > .calculation-tab-total {
  margin-left: 16px;
  margin-right: 16px;
}

.calculation-material-processing-scope > .calculation-tab-total {
  margin-bottom: 16px;
}

.calculation-material-manual-workspace {
  display: grid;
  gap: 16px;
  padding: 0 16px 16px 20px;
}

.material-cost-mode-row {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(180px, 0.65fr) minmax(240px, 1.35fr);
}

.calculation-material-additional {
  border: 1px solid var(--line);
}

.calculation-material-additional > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  list-style: none;
  padding: 14px 16px;
}

.calculation-material-additional > summary::-webkit-details-marker {
  display: none;
}

.calculation-material-additional > summary > span:first-child {
  display: grid;
  gap: 3px;
}

.calculation-material-additional > summary small {
  color: var(--muted);
}

.calculation-material-additional-body {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1.25fr) minmax(220px, 0.75fr);
  padding: 16px;
}

.external-line-list {
  display: grid;
  gap: 14px;
}

.external-line-card {
  overflow: hidden;
}

.external-line-card-header {
  align-items: center;
}

.external-line-header-title {
  align-items: flex-start;
  display: flex;
  gap: 12px;
}

.external-line-number {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--accent-dark);
  display: inline-flex;
  font-weight: 700;
  height: 30px;
  justify-content: center;
  min-width: 30px;
}

.external-line-header-summary {
  align-items: center;
  display: flex;
  gap: 10px;
}

.external-line-header-summary span {
  color: var(--muted);
  font-size: 12px;
}

.external-line-header-summary strong {
  color: var(--accent-dark);
  min-width: 96px;
  text-align: right;
}

.external-line-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(260px, 1.35fr) minmax(220px, 0.85fr);
  padding: 14px;
}

.external-line-grid label {
  color: var(--muted);
  display: grid;
  gap: 6px;
}

.external-line-main,
.external-line-pricing {
  align-content: start;
  display: grid;
  gap: 12px;
}

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

.external-line-main .full-row {
  grid-column: 1 / -1;
}

.external-line-pricing {
  background: #fbf5f4;
  border: 1px solid var(--line);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 12px;
}

.external-line-preview {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 10px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 12px;
}

.external-line-preview div {
  display: grid;
  gap: 4px;
}

.external-line-preview span {
  color: var(--muted);
  font-size: 12px;
}

.external-line-preview strong {
  color: var(--accent-dark);
}

.external-line-remove {
  min-height: 34px;
  padding: 7px 12px;
}

.external-table-scroll {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}

.external-calculation-form .job-workspace-main {
  min-width: 0;
}

.external-calculation-form .job-workspace-main > * {
  min-width: 0;
}

.external-calculation-table {
  border-collapse: collapse;
  min-width: 1230px;
  table-layout: fixed;
  width: 100%;
}

.external-col-product {
  width: 210px;
}

.external-col-supplier {
  width: 225px;
}

.external-col-quantity {
  width: 110px;
}

.external-col-unit {
  width: 90px;
}

.external-col-supplier-unit-price,
.external-col-supplier-total,
.external-col-margin,
.external-col-sale-unit,
.external-col-sale-total,
.external-col-profit {
  width: 120px;
}

.external-calculation-table th,
.external-calculation-table td {
  border-bottom: 1px solid var(--line);
  padding: 8px;
  text-align: left;
  vertical-align: top;
}

.external-calculation-table thead th {
  background: #fbf5f4;
  color: var(--accent-dark);
  font-size: 12px;
  text-transform: uppercase;
}

.external-calculation-table tfoot th {
  background: #fbf5f4;
  color: var(--accent-dark);
  font-size: 14px;
}

.external-calculation-table input,
.external-calculation-table select {
  min-width: 0;
  width: 100%;
}

.external-calculation-table strong {
  color: var(--accent-dark);
  display: block;
  padding-top: 9px;
  white-space: nowrap;
}

.supplier-quote-items-table input {
  min-width: 7rem;
}

.supplier-quote-items-table td:first-child input {
  min-width: 18rem;
}

.supplier-quote-extra-row {
  display: none;
}

.supplier-quote-create-toggle {
  align-items: center;
  background: #fbf5f4;
  border: 1px solid #ead9d5;
  border-radius: 10px;
  display: flex !important;
  gap: 10px;
  padding: 12px 14px;
}

.calculation-material-card.is-primary .calculation-material-card-header {
  background: #fff4f3;
  border-bottom-color: #e6b9b5;
  padding-left: 20px;
}

.calculation-material-card-title {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.material-scope-label {
  background: var(--accent);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.035em;
  padding: 7px 11px;
  text-transform: uppercase;
}

.supplier-quote-create-toggle input {
  flex: 0 0 auto;
  margin: 0;
  width: auto;
}

.supplier-quote-new-job {
  background: #fffaf8;
  border: 1px solid #e6d4cf;
  border-radius: 12px;
  margin-top: 14px;
  padding: 16px;
}

.supplier-quote-new-job-header {
  display: grid;
  gap: 3px;
  margin-bottom: 14px;
}

.supplier-quote-new-job-header span {
  color: var(--muted);
  font-size: 13px;
}

.supplier-quote-review-title .workflow-links {
  align-items: center;
  display: flex;
  gap: 7px;
}

.supplier-quote-review-title .page-title-actions {
  align-items: center;
}

.supplier-quote-process {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 9px;
}

.supplier-quote-process-step {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-left: 4px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 3px;
  min-height: 62px;
  padding: 9px 11px;
}

.supplier-quote-process-step span,
.supplier-quote-section-eyebrow,
.supplier-quote-sidebar-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.01em;
  margin: 0;
  text-transform: uppercase;
}

.supplier-quote-process-step strong {
  font-size: 13px;
}

.supplier-quote-process-step.is-complete {
  background: var(--doc-work-order-soft);
  border-color: #c9e5d6;
  border-left-color: var(--success);
}

.supplier-quote-process-step.is-job {
  border-left-color: var(--doc-job);
}

.supplier-quote-process-step.is-job.is-current {
  background: var(--doc-job-soft);
  border-color: var(--doc-job-border);
  border-left-color: var(--doc-job);
  color: var(--doc-job-dark);
}

.supplier-quote-process-step.is-calculation {
  border-left-color: var(--doc-calculation);
}

.supplier-quote-process-step.is-offer {
  border-left-color: var(--doc-offer);
}

.supplier-quote-review-layout {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) 330px;
  min-width: 0;
}

.supplier-quote-review-main,
.supplier-quote-review-sidebar {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.supplier-quote-review-main > .info-panel,
.supplier-quote-review-sidebar > .info-panel {
  min-width: 0;
}

.supplier-quote-job-panel--primary {
  border-color: var(--doc-job-border);
  border-left: 5px solid var(--doc-job);
  box-shadow: 0 10px 28px rgba(91, 73, 52, 0.09);
}

.supplier-quote-job-panel--primary .section-hint strong,
.supplier-quote-section-eyebrow {
  color: var(--doc-job-dark);
}

.supplier-quote-job-mode {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 13px;
}

.supplier-quote-job-mode button {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  display: grid;
  gap: 2px;
  min-height: 62px;
  padding: 10px 12px;
  text-align: left;
}

.supplier-quote-job-mode button span {
  color: var(--muted);
  font-size: 12px;
}

.supplier-quote-job-mode button:hover,
.supplier-quote-job-mode button:focus-visible,
.supplier-quote-job-mode button.is-active {
  background: var(--doc-job-soft);
  border-color: var(--doc-job);
  color: var(--doc-job-dark);
}

.supplier-quote-job-mode button strong {
  color: inherit;
}

.supplier-quote-new-job {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin-top: 0;
  padding: 0;
}

.supplier-quote-job-explanation {
  background: var(--doc-job-soft);
  border: 1px solid var(--doc-job-border);
  border-radius: 8px;
  color: var(--doc-job-dark);
  display: grid;
  font-size: 12px;
  gap: 2px;
  margin-top: 12px;
  padding: 9px 11px;
}

.supplier-quote-data-panel {
  border-left: 4px solid var(--doc-calculation);
}

.supplier-quote-data-panel .supplier-quote-section-eyebrow {
  color: var(--doc-calculation-dark);
}

.supplier-quote-meta-grid {
  align-items: end;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.supplier-quote-note-field {
  grid-column: span 2;
}

.supplier-quote-table-scroll {
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  margin-top: 14px;
}

.supplier-quote-items-table {
  min-width: 800px;
}

.supplier-quote-more-rows {
  margin-top: 10px;
}

.supplier-quote-source-totals {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-left: auto;
  margin-top: 14px;
  max-width: 560px;
}

.supplier-quote-review-actions {
  border-top: 1px solid var(--line-soft);
  margin-top: 15px;
  padding-top: 14px;
}

.supplier-quote-review-actions p {
  color: var(--muted);
  font-size: 12px;
  margin: 0 auto 0 0;
}

.supplier-quote-job-copy {
  color: var(--doc-job-dark);
}

.supplier-quote-calculation-copy {
  color: var(--doc-calculation-dark);
}

.supplier-quote-party-panel {
  border-left: 4px solid #85807a;
}

.supplier-quote-supplier-summary {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-top: 10px;
}

.supplier-quote-supplier-summary h2 {
  font-size: 16px;
}

.supplier-quote-supplier-summary p {
  color: var(--muted);
  font-size: 12px;
  margin: 3px 0;
}

.supplier-quote-supplier-state {
  color: var(--success);
  font-size: 11px;
  font-weight: 850;
}

.supplier-quote-supplier-details {
  border-top: 1px solid var(--line-soft);
  margin-top: 13px;
  padding-top: 13px;
}

.supplier-quote-supplier-details .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.supplier-quote-create-toggle {
  border-radius: 8px;
  font-size: 12px;
  padding: 10px;
}

.supplier-quote-source-panel dl {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: 8px 0 0;
}

.supplier-quote-source-panel dt,
.supplier-quote-source-panel dd {
  border-bottom: 1px solid var(--line-soft);
  margin: 0;
  padding: 8px 0;
}

.supplier-quote-source-panel dt {
  color: var(--muted);
}

.supplier-quote-source-panel dd {
  font-weight: 800;
  text-align: right;
}

.supplier-quote-source-panel dt:last-of-type,
.supplier-quote-source-panel dd:last-of-type {
  border-bottom: 0;
}

.supplier-quote-color-key {
  display: grid;
  gap: 9px;
}

.supplier-quote-color-key > div:not(.supplier-quote-sidebar-label) {
  align-items: center;
  display: flex;
  font-size: 12px;
  font-weight: 750;
  gap: 9px;
}

.supplier-quote-color-key .document-chip-dot {
  box-shadow: none;
}

.supplier-quote-dot--job {
  background: var(--doc-job);
}

.supplier-quote-dot--calculation {
  background: var(--doc-calculation);
}

.supplier-quote-dot--offer {
  background: var(--doc-offer);
}

@media (max-width: 1180px) {
  .supplier-quote-review-layout {
    grid-template-columns: minmax(0, 1fr) 290px;
  }

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

@media (max-width: 900px) {
  .supplier-quote-review-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .supplier-quote-review-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .supplier-quote-party-panel {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .supplier-quote-process,
  .supplier-quote-job-mode,
  .supplier-quote-meta-grid,
  .supplier-quote-source-totals,
  .supplier-quote-review-sidebar {
    grid-template-columns: minmax(0, 1fr);
  }

  .supplier-quote-note-field,
  .supplier-quote-party-panel {
    grid-column: auto;
  }

  .supplier-quote-review-actions {
    align-items: stretch;
  }

  .supplier-quote-review-actions p {
    margin-bottom: 4px;
  }

  .supplier-quote-review-actions > * {
    width: 100%;
  }
}

.service-calculation-editor .external-calculation-table {
  min-width: 1100px;
}

.standalone-service-calculation-editor .external-calculation-table {
  min-width: 1080px;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(2) {
  width: 18%;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(3) {
  width: 22%;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(4) {
  width: 96px;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(5) {
  width: 88px;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(6),
.standalone-service-calculation-editor .external-calculation-table th:nth-child(7) {
  width: 108px;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(8) {
  width: 132px;
}

.standalone-service-calculation-editor .external-calculation-table th:nth-child(9) {
  width: 104px;
}

.service-calculation-editor .external-calculation-table .service-line-product-column {
  width: 185px;
}

.service-calculation-editor .external-calculation-table .service-line-description-column {
  width: 245px;
}

.service-calculation-editor .external-calculation-table th:nth-child(4) {
  width: 92px;
}

.service-calculation-editor .external-calculation-table th:nth-child(5) {
  width: 82px;
}

.service-calculation-editor .external-calculation-table th:nth-child(6),
.service-calculation-editor .external-calculation-table th:nth-child(7) {
  width: 100px;
}

.service-calculation-editor .external-calculation-table th:nth-child(8) {
  width: 110px;
}

.service-calculation-editor .external-calculation-table th:nth-child(9) {
  width: 92px;
}

.external-calculation-table .service-line-remove-column {
  text-align: center;
  width: 52px;
}

.external-calculation-table .service-line-drag-column {
  text-align: center;
  width: 44px;
}

.external-calculation-table .service-calculation-live-value {
  vertical-align: middle;
}

.service-calculation-editor .external-calculation-table .service-calculation-live-value {
  padding-top: 17px;
  vertical-align: top;
}

.service-financial-input-cell,
.service-financial-result-cell {
  min-width: 118px;
  vertical-align: top;
}

.service-financial-input-cell {
  display: grid;
  gap: 4px;
}

.service-financial-input-label {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  line-height: 1.15;
}

.service-financial-input-cell > small,
.service-financial-result-cell > small {
  color: var(--muted);
  display: block;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.25;
  margin-top: 4px;
  white-space: nowrap;
}

.service-financial-result-cell > strong {
  display: block;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.service-financial-result-cell.is-profit > strong,
.service-financial-result-cell.is-profit > small,
.external-calculation-table tfoot .is-profit {
  color: #236345;
}

.service-line-drag-handle {
  cursor: grab;
  height: 34px;
  margin-inline: auto;
  padding: 0;
  touch-action: none;
  width: 34px;
}

.service-line-drag-handle:active {
  cursor: grabbing;
}

.service-line-product-stack {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.service-line-description-stack {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.service-calculation-editor .service-line-description-stack {
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
}

.service-line-description-primary {
  align-items: center;
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
}

.service-execution-toggle {
  align-items: center;
  display: flex;
  gap: 5px;
}

.service-execution-choice {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  padding: 0;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  width: 30px;
}

.service-execution-choice:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
}

.service-execution-choice.is-active,
.service-execution-choice[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

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

.service-execution-choice svg {
  fill: none;
  height: 16px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 16px;
}

.service-line-execution-label,
.service-line-supplier-field,
.service-line-supplier-fields label {
  display: grid;
  gap: 4px;
}

.service-line-execution-label > span,
.service-line-supplier-field > span,
.service-line-supplier-fields label > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.service-line-execution-label select,
.service-line-supplier-fields input,
.service-line-supplier-fields select {
  font-size: 12px;
  min-height: 34px;
}

.service-line-supplier-fields {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 7px;
  padding: 8px;
}

.service-calculation-editor .service-line-supplier-fields {
  align-items: end;
  grid-template-columns: minmax(230px, 1.25fr) minmax(165px, 0.8fr) minmax(230px, 1.15fr);
  margin-top: 34px;
  width: 680px;
}

.service-line-supplier-fields[hidden] {
  display: none;
}

.external-calculation-table tr.is-service-row-dragging {
  opacity: 0.55;
}

.service-line-remove-button {
  height: 34px;
  margin-inline: auto;
  padding: 0;
  width: 34px;
}

.service-line-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 12px;
}

.service-add-line-button {
  flex: 0 0 auto;
  white-space: nowrap;
}

.service-total-margin {
  align-items: end;
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px 14px;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
  margin-top: 12px;
  padding: 12px;
}

.service-total-margin label {
  display: grid;
  gap: 6px;
}

.service-total-margin span {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.service-total-margin p {
  color: var(--muted);
  font-size: 13px;
  margin: 0 0 6px;
}

.service-advanced-settings {
  background: #fbf5f4;
  border: 1px solid var(--line);
  margin-top: 12px;
}

.service-advanced-settings > summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  padding: 11px 12px;
}

.service-advanced-settings .service-total-margin {
  border: 0;
  border-top: 1px solid var(--line);
  margin-top: 0;
}

@media (max-width: 600px) {
  .service-total-margin {
    grid-template-columns: minmax(0, 1fr);
  }

  .service-calculation-editor #service-work-lines > .section-header {
    align-items: stretch;
    flex-direction: column;
  }

  .service-calculation-editor .service-add-line-button {
    align-self: flex-end;
  }

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

.external-cell-stack {
  display: grid;
  gap: 6px;
}

.external-product-cell,
.external-supplier-cell {
  min-width: 0;
}

.external-note-input {
  font-size: 13px;
}

.external-note-row td {
  background: #fbf5f4;
  padding-top: 0;
}

.external-note-content {
  align-items: center;
  display: flex;
  gap: 10px;
}

.external-note-content .external-note-input {
  flex: 1 1 auto;
}

.external-note-content .external-structured-specification {
  flex: 1 1 auto;
  min-width: 0;
}

.external-note-content .external-line-remove {
  flex: 0 0 auto;
}

.external-number-input {
  text-align: right;
}

.external-unit-input {
  min-width: 70px;
}

.external-summary-grid {
  align-items: start;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 12px;
}

.external-summary-grid section {
  align-self: start;
  background: #fbf5f4;
  border: 1px solid var(--line);
  padding: 10px 12px;
}

.external-summary-grid h3 {
  color: var(--accent-dark);
  font-size: 15px;
  margin: 0 0 8px;
}

.external-summary-grid .summary-list {
  gap: 5px 10px;
  grid-template-columns: minmax(92px, 1fr) auto;
}

.external-summary-grid .summary-list dd {
  text-align: right;
  white-space: nowrap;
}

.external-profit-panel {
  display: grid;
  gap: 5px 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.external-profit-panel h3,
.external-profit-breakdown {
  grid-column: 1 / -1;
}

.external-profit-panel strong {
  color: var(--accent);
  font-size: 23px;
}

.external-profit-panel > span {
  color: var(--muted);
  font-weight: 700;
  text-align: right;
}

.external-profit-breakdown {
  grid-template-columns: minmax(108px, 1fr) auto minmax(108px, 1fr) auto !important;
  margin-top: 2px;
}

.external-profit-breakdown dd {
  font-weight: 700;
}

.external-sanity-list {
  display: grid;
  gap: 8px;
}

.external-sanity-list article {
  align-items: center;
  border: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(120px, 0.7fr));
  padding: 10px 12px;
}

.external-sanity-list article div {
  display: grid;
  gap: 2px;
}

.external-sanity-list span {
  color: var(--muted);
  font-size: 12px;
}

.external-sanity-list strong {
  color: var(--text);
}

.pricing-recommendation-panel {
  display: grid;
  gap: 18px;
}

.pricing-confidence {
  align-self: start;
  background: #fff8e8;
  border: 1px solid #ead9ad;
  border-radius: 999px;
  color: #785700;
  font-size: 12px;
  font-weight: 800;
  padding: 7px 10px;
  text-transform: uppercase;
}

.pricing-confidence.is-visoka {
  background: #eef8f0;
  border-color: #b9d9bf;
  color: #285f34;
}

.pricing-product-context,
.pricing-signal-grid,
.pricing-alternative-grid {
  display: grid;
  gap: 12px;
}

.pricing-product-context {
  background: #fbf5f4;
  border: 1px solid var(--line);
  grid-template-columns: minmax(180px, 0.7fr) minmax(240px, 1.3fr) minmax(130px, 0.5fr);
  padding: 12px 14px;
}

.pricing-product-context div,
.pricing-signal-grid article {
  display: grid;
  gap: 4px;
}

.pricing-product-context span,
.pricing-signal-grid span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

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

.pricing-signal-grid article {
  border: 1px solid var(--line);
  padding: 13px;
}

.pricing-signal-grid small {
  color: var(--muted);
  line-height: 1.45;
}

.pricing-alternative-card {
  border: 1px solid var(--line);
  display: grid;
  gap: 12px;
  padding: 16px;
}

.pricing-alternative-card.is-recommended {
  background: #fffaf8;
  border-color: #d69c91;
  box-shadow: inset 0 3px 0 var(--accent);
}

.pricing-alternative-card.is-selected {
  outline: 3px solid rgba(177, 17, 22, 0.15);
}

.pricing-alternative-heading {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.pricing-alternative-heading span {
  font-weight: 800;
}

.pricing-alternative-heading b {
  background: var(--accent);
  border-radius: 999px;
  color: #fff;
  font-size: 11px;
  padding: 5px 8px;
  text-transform: uppercase;
}

.pricing-alternative-price {
  color: var(--accent-dark);
  font-size: 28px;
}

.pricing-alternative-card dl {
  display: grid;
  gap: 6px 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: 0;
}

.pricing-alternative-card dt,
.pricing-alternative-card dd {
  margin: 0;
}

.pricing-alternative-card dt,
.pricing-alternative-card p {
  color: var(--muted);
  font-size: 13px;
}

.pricing-alternative-card dd {
  font-weight: 800;
  text-align: right;
}

.pricing-alternative-card p {
  line-height: 1.45;
  margin: 0;
}

.pricing-alternative-card button {
  align-self: end;
  width: 100%;
}

body.is-resizing-document-preview .document-preview-frame {
  pointer-events: none;
}

.pricing-apply-status {
  background: #eef8f0;
  border: 1px solid #b9d9bf;
  color: #285f34;
  font-size: 13px;
  font-weight: 800;
  margin: 0;
  padding: 11px 13px;
}

.pricing-history-heading {
  align-items: end;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.pricing-history-heading h3,
.pricing-history-heading p {
  margin: 0;
}

.pricing-history-heading p,
.pricing-history-heading > span {
  color: var(--muted);
  font-size: 13px;
}

.pricing-calculation-history-heading {
  border-top: 1px solid var(--line-soft);
  margin-top: 18px;
  padding-top: 16px;
}

.pricing-history-list article {
  grid-template-columns: minmax(210px, 1.2fr) minmax(180px, 1fr) minmax(100px, 0.5fr) minmax(110px, 0.5fr) minmax(130px, 0.6fr);
}

.pricing-history-list article.is-strongest {
  background: #eef8f0;
  border-color: #b9d9bf;
}

.external-supplier-profit-panel {
  border: 1px solid var(--line);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.2fr);
  margin-top: 16px;
  padding: 14px;
}

.external-supplier-profit-panel h3 {
  color: var(--accent-dark);
  font-size: 15px;
  margin: 0 0 6px;
}

.external-supplier-profit-panel p {
  color: var(--muted);
  margin: 0;
}

.external-supplier-profit-list {
  display: grid;
  gap: 8px;
}

.external-supplier-profit-list article {
  align-items: center;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(140px, 1fr) minmax(240px, 1.4fr) minmax(90px, 0.6fr);
  padding: 9px 10px;
}

.external-supplier-profit-list article.is-best {
  background: #fff8f7;
  border-color: var(--accent);
}

.external-supplier-profit-list span {
  color: var(--muted);
  font-size: 12px;
}

.external-supplier-profit-list b {
  color: var(--accent-dark);
  text-align: right;
}

.workflow-option-action {
  margin-top: auto;
  width: 100%;
}

.material-card-column {
  align-content: start;
  display: grid;
  gap: 10px;
}

.material-card-column h4 {
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.material-card-meta {
  display: grid;
  gap: 6px;
}

.material-card-meta div {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 2px;
  padding-bottom: 6px;
}

.material-card-meta span,
.material-card-summary span {
  color: var(--muted);
  font-size: 12px;
}

.supplier-price-card-list {
  display: grid;
}

.supplier-price-card {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 10px 14px;
  grid-template-columns: auto minmax(135px, 1.2fr) minmax(110px, 0.9fr) minmax(120px, 0.95fr) minmax(120px, 0.9fr) 76px;
  min-height: 68px;
  padding: 8px 11px;
}

.supplier-price-card.is-selected {
  background: #eef5ff;
  box-shadow: inset 4px 0 0 #2563eb;
}

.supplier-price-card input {
  position: absolute;
  transform: scale(0);
}

.supplier-radio-dot {
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  height: 14px;
  width: 14px;
}

.supplier-price-card.is-selected .supplier-radio-dot {
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: inset 0 0 0 3px #fff;
}

.supplier-price-detail {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.supplier-price-detail small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.supplier-price-detail strong {
  font-size: 13px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.supplier-price-card em {
  background: #fff0ef;
  border: 1px solid #efc5c2;
  border-radius: 999px;
  color: var(--accent-dark);
  display: inline-flex;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  justify-content: center;
  padding: 4px 6px;
  text-transform: uppercase;
  width: 100%;
}

.supplier-price-card em.is-muted {
  background: #f6f3ef;
  border-color: var(--line);
  color: var(--muted);
}

.supplier-price-tag-slot {
  align-items: center;
  display: flex;
  min-height: 24px;
  width: 76px;
}

.material-supplier-empty {
  display: grid;
  gap: 3px;
  padding: 18px;
}

.material-supplier-empty span {
  color: var(--muted);
  font-size: 13px;
}

.material-card-inline-result {
  align-items: end;
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(160px, 0.7fr));
  padding: 12px;
}

.material-card-inline-result > div {
  display: grid;
  gap: 3px;
}

.material-card-inline-result > div span {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
}

.material-card-inline-result > div strong {
  color: var(--accent-dark);
  font-size: 16px;
}

.material-card-inline-result .material-card-quantity {
  align-items: stretch;
  display: grid;
  gap: 6px;
}

.material-card-inline-result .material-card-quantity > span {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.material-card-summary {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  padding: 12px;
}

.material-card-summary strong {
  color: var(--accent-dark);
  font-size: 18px;
}

.material-card-quantity {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.material-card-quantity input {
  min-width: 0;
}

.material-card-quantity strong {
  font-size: 14px;
}

.material-card-summary small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.material-card-summary .button-primary {
  margin-top: 8px;
  width: 100%;
}

.material-procurement-mini {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 4px;
  margin-top: 4px;
  padding-top: 10px;
}

.material-procurement-mini strong {
  color: var(--accent-dark);
}

.material-card-total {
  align-items: center;
  background: #fbf5f4;
  border: 1px solid var(--line);
  color: var(--accent-dark);
  display: flex;
  gap: 16px;
  justify-content: flex-end;
  padding: 12px 14px;
}

.calculation-material-reference {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.calculation-material-reference article {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
  padding: 12px;
}

.calculation-material-reference span {
  color: var(--muted);
  font-size: 12px;
}

.calculation-cutting-material-reference {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.calculation-material-table th {
  background: #fbf5f4;
  color: var(--accent-dark);
  font-size: 12px;
  text-transform: uppercase;
}

.calculation-material-table tfoot td {
  background: #fbf5f4;
  color: var(--accent-dark);
  font-weight: 700;
}

.calculation-cutting-setup {
  align-content: start;
  display: grid;
  gap: 12px;
}

.calculation-cutting-setup h3 {
  margin: 0;
}

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

.calculation-cutting-controls {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 14px;
}

.calculation-material-processing-scope .calculation-cutting-controls {
  align-content: start;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.manual-layout-panel {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-top: 12px;
}

.manual-layout-panel[hidden] {
  display: none;
}

.existing-die-panel {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  grid-column: 1 / -1;
  padding: 12px;
}

.existing-die-panel[hidden] {
  display: none;
}

.existing-die-panel small {
  color: var(--muted);
  line-height: 1.45;
}

.calculation-cutting-controls .button-primary {
  align-self: end;
  min-height: 42px;
}

.grouped-layout-panel {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: 12px;
}

.grouped-layout-panel[hidden] {
  display: none;
}

.calculation-material-processing-scope .grouped-layout-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.calculation-material-processing-scope .grouped-layout-axis-guide {
  display: none;
}

.grouped-layout-axis-guide {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  grid-row: span 3;
  padding: 10px;
}

.grouped-layout-axis-guide strong {
  color: var(--accent-dark);
  font-size: 13px;
}

.grouped-layout-axis-canvas {
  border: 1px dashed #c98d8d;
  min-height: 188px;
  position: relative;
}

.grouped-layout-group-box {
  align-items: center;
  background: rgba(164, 19, 19, 0.08);
  border: 1px solid var(--accent);
  color: var(--accent-dark);
  display: flex;
  font-size: 12px;
  font-weight: 700;
  height: 46px;
  justify-content: center;
  left: 18px;
  position: absolute;
  top: 18px;
  width: 70px;
}

.grouped-layout-axis-x,
.grouped-layout-axis-y {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  position: absolute;
}

.grouped-layout-axis-x {
  border-top: 2px solid var(--accent);
  left: 18px;
  padding-top: 4px;
  right: 14px;
  top: 78px;
}

.grouped-layout-axis-y {
  border-left: 2px solid var(--accent);
  bottom: 12px;
  left: 104px;
  padding-left: 5px;
  top: 18px;
  writing-mode: vertical-rl;
}

.inline-machine-select {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.machine-mini-summary {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.machine-mini-summary div {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
  padding: 10px;
}

.machine-mini-summary span {
  color: var(--muted);
  font-size: 12px;
}

.machine-mini-summary strong {
  text-align: left;
}

.calculation-advanced-settings {
  background: #fff;
  border: 1px solid var(--line);
  grid-column: 1 / -1;
}

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

.calculation-advanced-settings > summary {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: 3px;
  grid-template-columns: minmax(0, 1fr) auto;
  list-style: none;
  padding: 11px 12px;
}

.calculation-advanced-settings > summary::-webkit-details-marker {
  display: none;
}

.calculation-advanced-settings > summary::after {
  color: var(--accent-dark);
  content: "+";
  font-size: 18px;
  font-weight: 800;
  grid-column: 2;
  grid-row: 1 / span 2;
}

.calculation-advanced-settings[open] > summary::after {
  content: "−";
}

.calculation-advanced-settings > summary span {
  color: var(--accent-dark);
  font-size: 13px;
  font-weight: 800;
}

.calculation-advanced-settings > summary small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
}

.calculation-advanced-settings[open] > summary {
  border-bottom: 1px solid var(--line-soft);
}

.machine-technical-details .machine-mini-summary,
.press-sheet-advanced-grid,
.grouped-layout-fields {
  padding: 12px;
}

.press-sheet-advanced-grid {
  display: grid;
  gap: 12px;
}

.press-sheet-advanced-grid .press-sheet-reserve-fields:first-child {
  border-top: 0;
  padding-top: 0;
}

.grouped-layout-fields {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grouped-layout-fields .grouped-layout-axis-guide {
  grid-row: span 3;
}

.press-sheet-selection {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 12px;
  padding: 14px;
}

.press-sheet-selection-heading {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.press-sheet-selection-heading div {
  display: grid;
  gap: 3px;
}

.press-sheet-selection-heading small,
.press-sheet-stock-fields small,
.press-sheet-reserve-fields small {
  color: var(--muted);
}

.press-sheet-selection-heading > span {
  background: #eef4ff;
  border: 1px solid #93b4f4;
  color: #194b9b;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 8px;
  white-space: nowrap;
}

.press-sheet-standard-fields,
.press-sheet-dimension-fields,
.press-sheet-stock-fields,
.press-sheet-reserve-fields {
  display: grid;
  gap: 10px;
}

.press-sheet-dimension-fields,
.press-sheet-reserve-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.press-sheet-reserve-fields {
  border-top: 1px solid var(--line-soft);
  padding-top: 12px;
}

.press-sheet-reserve-fields small,
.press-sheet-stock-fields small {
  grid-column: 1 / -1;
}

.press-sheet-selection [hidden] {
  display: none;
}

.calculation-note-panel {
  display: grid;
  gap: 12px;
}

.calculation-note-panel h3 {
  margin: 0;
}

.checkbox-row {
  align-items: center;
  display: flex;
  gap: 8px;
}

.checkbox-row input {
  width: auto;
}

.toggle-control {
  align-items: center;
  color: var(--text);
  display: flex;
  font-weight: 500;
  gap: 12px;
  justify-content: space-between;
  min-height: 42px;
}

.toggle-switch {
  display: inline-flex;
  flex: 0 0 auto;
  height: 26px;
  position: relative;
  width: 48px;
}

.toggle-switch input {
  height: 1px;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.toggle-slider {
  background: #d9cfcc;
  border: 1px solid var(--line);
  cursor: pointer;
  inset: 0;
  position: absolute;
  transition: background 0.16s ease, border-color 0.16s ease;
}

.toggle-slider::before {
  background: #fff;
  content: "";
  height: 20px;
  left: 2px;
  position: absolute;
  top: 2px;
  transition: transform 0.16s ease;
  width: 20px;
}

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

.toggle-switch input:checked + .toggle-slider::before {
  transform: translateX(22px);
}

.toggle-switch input:focus-visible + .toggle-slider {
  outline: 2px solid #222;
  outline-offset: 2px;
}

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

.settings-card {
  background: var(--surface);
  border: 1px solid var(--line);
  display: grid;
  gap: 18px;
  padding: 20px;
}

.settings-card h2 {
  margin-top: 0;
}

.settings-card p {
  color: var(--muted);
  margin-bottom: 0;
}

.settings-card-footer {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
}

.settings-card-footer .button-secondary {
  white-space: nowrap;
}

.document-text-settings {
  display: grid;
  gap: 18px;
}

.document-text-setting-list {
  display: grid;
  gap: 14px;
}

.document-text-setting-card {
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.document-text-setting-card label {
  display: grid;
  gap: 8px;
}

.document-text-setting-card label > span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.document-text-setting-card textarea {
  min-height: 112px;
  resize: vertical;
}

.document-text-setting-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.button-secondary.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.document-template-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.document-template-editor {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns: 280px minmax(0, 1fr);
}

.document-template-sidebar {
  display: grid;
  gap: 16px;
  position: sticky;
  top: 18px;
}

.document-template-block-list {
  display: grid;
  gap: 8px;
}

.document-template-page-tabs {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.document-template-page-tabs button {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  color: #221d1a;
  cursor: pointer;
  font-weight: 800;
  padding: 8px 6px;
}

.document-template-page-tabs button.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.document-template-grid-toggle {
  justify-self: start;
}

.document-template-grid-toggle[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.document-template-block-list.is-hidden,
.document-template-canvas-shell.is-hidden {
  display: none;
}

.document-template-block-list button {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  color: #221d1a;
  cursor: pointer;
  font-weight: 700;
  padding: 9px 10px;
  text-align: left;
}

.document-template-block-list button:hover,
.document-template-block-list button.is-active {
  border-color: var(--accent);
  color: var(--accent);
}

.document-template-block-list button[data-template-flow-block="true"]::after {
  color: var(--muted);
  content: "flow";
  float: right;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.template-block-inspector {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 8px 12px;
  grid-template-columns: 70px 1fr;
  margin: 0;
  padding-top: 14px;
}

.template-block-inspector dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.template-block-inspector dd {
  margin: 0;
}

.template-block-inspector input {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 4px;
  font: inherit;
  padding: 6px 7px;
  width: 66px;
}

.template-number-field {
  align-items: stretch;
  display: flex;
  gap: 4px;
}

.template-number-field-unit {
  align-self: center;
  color: var(--muted);
  font-size: 12px;
}

.template-number-stepper {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
}

.template-number-stepper button {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 3px;
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  font-size: 8px;
  height: 15px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 18px;
}

.template-number-stepper button:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.template-flow-hint {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 6px;
  color: #7c2d12;
  font-size: 12px;
  line-height: 1.4;
  margin: -6px 0 0;
  padding: 8px 10px;
}

.document-template-canvas-panel {
  overflow: auto;
}

.document-template-canvas-shell {
  background:
    linear-gradient(90deg, rgb(0 0 0 / 4%) 1px, transparent 1px),
    linear-gradient(0deg, rgb(0 0 0 / 4%) 1px, transparent 1px),
    #e9e4de;
  background-size: 24px 24px;
  display: flex;
  justify-content: center;
  min-height: 720px;
  padding: 28px;
}

.document-template-canvas {
  aspect-ratio: 210 / 297;
  background: #fff;
  box-shadow: 0 18px 50px rgb(0 0 0 / 16%);
  position: relative;
  width: min(100%, 794px);
}

.document-template-canvas.is-grid-visible::before {
  background-image:
    linear-gradient(rgb(164 19 19 / 18%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(164 19 19 / 18%) 1px, transparent 1px),
    linear-gradient(rgb(17 17 17 / 9%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(17 17 17 / 9%) 1px, transparent 1px);
  background-size:
    calc(100% / 21) calc(100% / 29.7),
    calc(100% / 21) calc(100% / 29.7),
    calc(100% / 210) calc(100% / 297),
    calc(100% / 210) calc(100% / 297);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

.document-template-live-preview {
  border: 0;
  height: 100%;
  inset: 0;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 0;
}

.document-template-live-empty {
  align-items: center;
  color: var(--muted);
  display: flex;
  height: 100%;
  justify-content: center;
  position: absolute;
  width: 100%;
}

.document-template-block {
  align-items: start;
  background: rgb(164 19 19 / 4%);
  border: 1px solid rgb(164 19 19 / 72%);
  border-radius: 5px;
  box-sizing: border-box;
  color: #2b201f;
  cursor: grab;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  justify-content: space-between;
  line-height: 1.2;
  min-height: 22px;
  min-width: 22px;
  padding: 6px;
  position: absolute;
  touch-action: none;
  user-select: none;
  z-index: 2;
}

.document-template-block > span {
  background: #fff;
  border: 1px solid rgb(164 19 19 / 28%);
  border-radius: 3px;
  left: 0;
  padding: 2px 5px;
  position: absolute;
  top: -20px;
}

.document-template-block.is-active {
  background: rgb(164 19 19 / 9%);
  box-shadow: 0 0 0 2px rgb(164 19 19 / 18%);
}

.document-template-block.is-preview-measured {
  background: rgb(164 19 19 / 2%);
  border-style: dashed;
}

.document-template-block.is-flow-block {
  border-color: rgb(194 65 12 / 82%);
}

.document-template-block:active {
  cursor: grabbing;
}

.document-template-resize {
  background: var(--accent);
  border: 0;
  border-radius: 2px;
  bottom: 3px;
  cursor: nwse-resize;
  height: 10px;
  padding: 0;
  position: absolute;
  right: 3px;
  width: 10px;
}

.supplier-price-rows {
  display: grid;
  gap: 14px;
}

.supplier-price-row {
  background: #fbfaf8;
  border: 1px solid var(--line);
  padding: 16px;
}

.supplier-price-row h3 {
  color: var(--accent);
  font-size: 16px;
  margin-top: 0;
}

.supplier-packaging-fields {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 10px;
  padding: 12px;
}

.supplier-packaging-fields h4 {
  color: var(--accent);
  font-size: 14px;
  margin: 0;
}

.supplier-packaging-fields > small {
  color: var(--muted);
}

.machine-spec-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.machine-spec-grid article {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 6px;
  padding: 14px;
}

.machine-spec-grid span {
  color: var(--muted);
}

.machine-spec-grid strong {
  font-size: 18px;
}

.machine-calibration-list {
  margin: 1rem 0;
}

.machine-calibration-card .section-header {
  align-items: flex-start;
}

.machine-calibration-card h2 {
  margin-bottom: 0.5rem;
}

.machine-calibration-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 1rem;
}

.machine-calibration-field {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 0.45rem;
  min-width: 0;
  padding: 0.85rem;
}

.machine-calibration-field.is-confirmed {
  border-left: 4px solid #2f855a;
}

.machine-calibration-field > span:first-child {
  color: var(--muted);
  font-size: 0.84rem;
}

.machine-measurement-guide ol {
  margin-bottom: 1rem;
}

.machine-measurement-summary {
  border-top: 1px solid var(--line);
  margin-top: 1rem;
  padding-top: 1rem;
}

.machine-measurement-summary h3 {
  margin: 0 0 0.25rem;
}

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

.imposition-placeholder {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
  min-height: 260px;
}

.imposition-placeholder strong {
  color: var(--accent);
  font-size: 34px;
}

.sheet-imposition-panel {
  align-items: stretch;
  justify-content: flex-start;
  min-height: 640px;
}

.sheet-imposition-panel strong {
  color: var(--text);
  font-size: inherit;
}

.sheet-imposition-heading {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.sheet-imposition-heading > span {
  color: var(--accent-dark);
  font-weight: 700;
  text-align: left;
}

.sheet-preview-controls {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.sheet-orientation-toggle,
.sheet-preview-mode-toggle {
  border: 1px solid var(--line);
  display: inline-flex;
}

.sheet-orientation-toggle a,
.sheet-preview-mode-toggle a {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  padding: 7px 10px;
  text-decoration: none;
}

.sheet-orientation-toggle a + a,
.sheet-preview-mode-toggle a + a {
  border-left: 1px solid var(--line);
}

.sheet-orientation-toggle a.is-active,
.sheet-preview-mode-toggle a.is-active {
  background: var(--accent);
  color: #fff;
}

.sheet-imposition-context {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sheet-imposition-context article,
.sheet-imposition-results article {
  background: #fff;
  border: 1px solid var(--line);
  padding: 9px 10px;
}

.sheet-imposition-context span,
.sheet-imposition-results span {
  color: var(--muted);
  display: block;
  font-size: 11px;
}

.sheet-imposition-context strong,
.sheet-imposition-results strong {
  display: block;
  font-size: 14px;
  margin-top: 2px;
}

.sheet-imposition-stage {
  background: #fff;
  border: 1px solid var(--line);
  padding: 8px;
}

.sheet-imposition-svg {
  background: #fff;
  height: auto;
  max-height: 540px;
  width: 100%;
}

.sheet-purchase {
  fill: #fff;
  stroke: #334155;
  stroke-width: 3;
}

.sheet-effective {
  fill: rgba(37, 99, 235, 0.04);
  stroke: #2563eb;
  stroke-width: 2;
}

.sheet-rough {
  fill: rgba(234, 88, 12, 0.025);
  stroke: #ea580c;
  stroke-dasharray: 4 3;
  stroke-width: 1.5;
}

.sheet-loading-corner {
  fill: none;
  stroke: #15803d;
  stroke-linecap: square;
  stroke-width: 3;
}

.sheet-effective-cutline {
  stroke: #2563eb;
  stroke-dasharray: 9 7;
  stroke-width: 2;
}

.sheet-cut-line {
  stroke: #b91c1c;
  stroke-dasharray: 6 4;
  stroke-width: 2.25;
}

.sheet-cut-line.is-trim {
  stroke: #ea580c;
  stroke-dasharray: 3 4;
}

.sheet-cut-label-bg {
  fill: #b91c1c;
  stroke: #fff;
  stroke-width: 2;
}

.sheet-cut-label {
  dominant-baseline: central;
  fill: #fff;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  text-anchor: middle;
}

.sheet-layout-group {
  fill: rgba(164, 19, 19, 0.03);
  stroke: #6b4a45;
  stroke-dasharray: 6 5;
  stroke-width: 1.5;
}

.sheet-product {
  fill: rgba(245, 158, 11, 0.08);
  stroke: #f59e0b;
  stroke-dasharray: 5 4;
  stroke-width: 1.5;
}

.sheet-product-finish {
  fill: rgba(22, 163, 74, 0.05);
  stroke: #16a34a;
  stroke-width: 1;
}

.sheet-product-number,
.sheet-label,
.sheet-dimension,
.sheet-side-title,
.sheet-group-label {
  fill: var(--text);
  font-family: Arial, sans-serif;
}

.sheet-product-number {
  fill: var(--accent-dark);
  font-size: 18px;
  font-weight: 700;
  text-anchor: middle;
}

.sheet-label {
  font-size: 22px;
  font-weight: 700;
}

.sheet-label-effective {
  fill: var(--accent);
  font-size: 18px;
}

.sheet-side-title {
  fill: var(--accent-dark);
  font-size: 17px;
  font-weight: 700;
}

.sheet-group-label {
  fill: #6b4a45;
  font-size: 12px;
  font-weight: 700;
}

.sheet-dimension {
  fill: var(--muted);
  font-size: 16px;
  font-weight: 700;
  text-anchor: middle;
}

.sheet-dimension-effective {
  fill: var(--accent);
  font-size: 14px;
}

.sheet-imposition-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
}

.sheet-technical-safe-area {
  fill: rgba(220, 38, 38, 0.015);
  stroke: #dc2626;
  stroke-dasharray: 7 5;
  stroke-width: 1.5;
}

.sheet-imposition-legend span {
  align-items: center;
  color: var(--muted);
  display: flex;
  font-size: 13px;
  gap: 8px;
}

.sheet-imposition-legend i {
  border: 1px solid var(--line);
  display: inline-block;
  height: 12px;
  width: 18px;
}

.legend-purchase {
  background: #fff;
  border-color: #334155 !important;
}

.legend-effective {
  background: rgba(37, 99, 235, 0.04);
  border-color: #2563eb !important;
}

.legend-rough {
  background: rgba(234, 88, 12, 0.04);
  border-color: #ea580c !important;
  border-style: dashed !important;
}

.legend-loading-corner {
  background: #15803d;
  border-color: #15803d !important;
}

.legend-bleed {
  background: rgba(245, 158, 11, 0.08);
  border-color: #f59e0b !important;
}

.legend-finish {
  background: rgba(22, 163, 74, 0.05);
  border-color: #16a34a !important;
}

.legend-technical-safe {
  background: rgba(220, 38, 38, 0.04);
  border-color: #dc2626 !important;
  border-style: dashed !important;
}

.legend-cut {
  background: repeating-linear-gradient(90deg, #b91c1c 0 4px, transparent 4px 7px);
  border-color: #b91c1c !important;
}

.paper-cutting-plan {
  background: #fffaf7;
  border: 1px solid #efc5b8;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.paper-cutting-plan-heading {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.paper-cutting-plan-heading span,
.paper-cutting-plan-heading strong {
  display: block;
}

.paper-cutting-plan-heading span {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.paper-cutting-plan-heading strong {
  margin-top: 3px;
}

.paper-cutting-plan-heading b {
  background: #fee2e2;
  color: #991b1b;
  font-size: 12px;
  padding: 6px 9px;
  white-space: nowrap;
}

.paper-cutting-plan-summary {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.paper-cutting-plan-summary article {
  background: #fff;
  border: 1px solid var(--line-soft);
  padding: 9px 10px;
}

.paper-cutting-plan-summary span,
.paper-cutting-plan-summary strong {
  display: block;
}

.paper-cutting-plan-summary span {
  color: var(--muted);
  font-size: 11px;
}

.paper-cutting-plan-summary strong {
  font-size: 13px;
  margin-top: 3px;
}

.paper-cutting-plan p {
  margin: 0;
}

.cutting-cost-card {
  align-items: start;
  background: #f0fdf4;
  border: 1px solid #86efac;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.cutting-cost-card.is-warning {
  background: #fff7ed;
  border-color: #fdba74;
}

.cutting-cost-card > div {
  align-items: baseline;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.cutting-cost-card span,
.cutting-cost-card strong {
  display: block;
}

.cutting-cost-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.cutting-cost-card strong {
  color: var(--accent-dark);
  text-align: right;
}

.cutting-cost-card small {
  color: var(--muted);
}

.cutting-cost-card .button-secondary {
  justify-self: start;
}

.finishing-cutting-cost {
  margin-bottom: 14px;
}

.paper-cutting-strategy-reason {
  color: var(--muted);
  display: block;
}

.paper-cutting-steps {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.paper-cutting-steps li {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line-soft);
  display: grid;
  gap: 10px;
  grid-template-columns: 30px minmax(0, 1fr);
  padding: 8px 10px;
}

.paper-cutting-steps li > span {
  align-items: center;
  background: #b91c1c;
  border-radius: 50%;
  color: #fff;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  height: 26px;
  justify-content: center;
  width: 26px;
}

.paper-cutting-steps li strong,
.paper-cutting-steps li small {
  display: block;
}

.paper-cutting-steps li small {
  color: var(--muted);
  margin-top: 2px;
}

.paper-cutting-steps li.is-turn {
  background: #eff6ff;
  border-color: #bfdbfe;
}

.paper-cutting-steps li.is-turn > span {
  background: #2563eb;
  font-size: 16px;
}

.paper-cutting-steps li.is-final-trim {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.paper-cutting-steps li.is-final-trim > span {
  background: #15803d;
}

.paper-cutting-operator-note {
  border-top: 1px solid #efc5b8;
  color: var(--muted);
  padding-top: 9px;
}

.paper-cutting-no-cuts {
  background: #ecfdf5;
  border: 1px solid #bbf7d0;
  color: #166534;
  padding: 9px 10px;
}

.press-sheet-scenarios {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 10px;
  padding-top: 10px;
}

.press-sheet-scenarios-heading div {
  display: grid;
  gap: 2px;
}

.press-sheet-scenarios-heading small {
  color: var(--muted);
}

.press-sheet-scenario-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.press-sheet-scenario {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.press-sheet-scenario.is-selected {
  border-color: var(--accent);
  box-shadow: inset 3px 0 0 var(--accent);
}

.press-sheet-scenario > div {
  align-items: baseline;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.press-sheet-scenario > div span,
.press-sheet-scenario > small {
  color: var(--muted);
  font-size: 11px;
}

.press-sheet-scenario dl {
  display: grid;
  font-size: 11px;
  gap: 3px 8px;
  grid-template-columns: 1fr auto;
  margin: 0;
}

.press-sheet-scenario dt {
  color: var(--muted);
}

.press-sheet-scenario dd {
  font-weight: 800;
  margin: 0;
}

.press-sheet-scenario .scenario-warning {
  color: #9a3412;
}

.scenario-selected-label {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
}

.sheet-imposition-results {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.sheet-imposition-results article {
  border-radius: 7px;
  min-width: 0;
}

.sheet-imposition-details {
  border-top: 1px solid var(--line-soft);
  margin-top: 2px;
}

.sheet-imposition-details > summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  padding: 8px 0 0;
}

.sheet-imposition-details-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: 8px;
}

.sheet-imposition-details-grid article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 8px 9px;
}

.sheet-imposition-details-grid span {
  color: var(--muted);
  display: block;
  font-size: 10px;
}

.sheet-imposition-details-grid strong {
  display: block;
  font-size: 12px;
  margin-top: 2px;
}

.material-result-section > .material-step-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.material-calculation-status {
  align-self: center;
  background: #edf8f2;
  border: 1px solid #c5e5d4;
  border-radius: 999px;
  color: #236945;
  font-size: 10px;
  font-weight: 850;
  padding: 4px 8px;
  text-transform: uppercase;
  white-space: nowrap;
}

.material-calculation-status.is-manual {
  background: #fff6e8;
  border-color: #e7bd78;
  color: #8d5406;
}

.material-procurement-panel {
  background: transparent;
  display: grid;
  gap: 9px;
  padding: 0;
}

.external-material-plan {
  background: #f1f6ff;
  border: 1px solid #b9cdf4;
  border-radius: 9px;
  display: grid;
  gap: 10px;
  padding: 13px;
}

.external-material-plan p {
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
}

.external-material-plan.is-compact {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  margin: 12px 0;
}

.external-material-plan.is-compact span {
  color: var(--muted);
}

.material-procurement-grid {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.material-procurement-grid article {
  background: #fff;
  border: 1px solid #eadbc2;
  border-radius: 7px;
  min-width: 0;
  padding: 9px 10px;
}

.material-procurement-grid article.is-primary {
  background: #fff6e8;
  border-color: #e7bd78;
}

.material-procurement-grid article.is-cost-total {
  background: #fff0ef;
  border-color: #e7b7b3;
}

.material-procurement-grid span {
  color: var(--muted);
  display: block;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.material-procurement-grid strong {
  color: var(--text);
  display: block;
  font-size: 14px;
  margin-top: 2px;
}

.material-procurement-grid small {
  color: var(--muted);
  display: block;
  font-size: 10px;
  line-height: 1.3;
  margin-top: 3px;
}

.material-cost-override-action {
  display: flex;
  justify-content: flex-end;
}

.material-cost-override-toggle {
  background: transparent;
  border: 0;
  color: var(--accent-dark);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  padding: 2px 0;
}

.material-cost-override-toggle:focus-visible {
  outline: 3px solid rgba(164, 19, 19, 0.14);
  outline-offset: 3px;
}

.material-cost-override-panel {
  align-items: end;
  border-top: 1px solid #eadbc2;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(200px, 1fr) minmax(180px, 0.45fr) minmax(220px, 0.65fr);
  padding-top: 10px;
}

.material-cost-override-panel[hidden] {
  display: none;
}

.material-cost-override-copy strong,
.material-cost-override-copy small {
  display: block;
}

.material-cost-override-copy small {
  color: var(--muted);
  font-size: 11px;
  margin-top: 2px;
}

.material-cost-quantity-field {
  color: var(--muted);
  display: grid;
  gap: 6px;
}

.material-cost-quantity-field span {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.material-cost-quantity-field strong {
  color: var(--accent-dark);
}

.material-cost-quantity-field small {
  line-height: 1.35;
}

@media (max-width: 1180px) {
  .sheet-imposition-results,
  .material-procurement-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .material-result-section > .material-step-heading,
  .material-cost-override-panel {
    grid-template-columns: 1fr;
  }

  .material-calculation-status {
    justify-self: start;
    margin-left: 40px;
  }

  .sheet-imposition-results,
  .material-procurement-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .press-sheet-dimension-fields,
  .press-sheet-reserve-fields,
  .press-sheet-scenario-grid {
    grid-template-columns: 1fr;
  }

  .press-sheet-selection-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .press-sheet-selection-heading > span {
    align-self: flex-start;
  }

  .calculation-advanced-settings > summary {
    align-items: start;
  }

  .grouped-layout-fields,
  .machine-technical-details .machine-mini-summary {
    grid-template-columns: 1fr;
  }
}

.material-manual-entry {
  align-items: end;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.5fr);
}

.material-manual-entry .material-card-quantity {
  align-items: stretch;
  display: grid;
  gap: 6px;
}

.material-manual-entry .material-card-quantity > span {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.calculation-cutting-results {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: grid;
  gap: 14px;
  padding: 16px;
}

.calculation-collapsible-results {
  display: block;
}

.calculation-collapsible-results summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
}

.calculation-collapsible-results summary::-webkit-details-marker {
  display: none;
}

.calculation-collapsible-results > *:not(summary) {
  margin-top: 14px;
}

.collapse-indicator::before {
  border-bottom: 2px solid var(--accent-dark);
  border-right: 2px solid var(--accent-dark);
  content: "";
  display: block;
  height: 8px;
  transform: rotate(45deg);
  transition: transform 0.15s ease;
  width: 8px;
}

.calculation-collapsible-results:not([open]) .collapse-indicator::before {
  transform: rotate(-45deg);
}

.calculation-cutting-results h3 {
  margin: 0;
}

.print-summary-strip {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

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

.print-summary-strip article,
.print-panel,
.print-cost-breakdown {
  background: #fff;
  border: 1px solid var(--line);
}

.print-summary-strip article {
  display: grid;
  gap: 6px;
  padding: 12px;
}

.print-summary-strip span,
.print-definition-grid dt {
  color: var(--muted);
  font-size: 12px;
}

.print-summary-strip strong {
  color: var(--accent-dark);
  font-size: 18px;
}

.calculation-print-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.summary-recap-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.calculation-summary-cockpit {
  display: grid;
  gap: 16px;
}

.calculation-summary-heading {
  align-items: start;
  display: flex;
  gap: 20px;
  justify-content: space-between;
}

.calculation-summary-heading .section-hint {
  max-width: 520px;
}

.calculation-summary-total-band {
  align-items: center;
  background: var(--accent);
  color: #fff;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  padding: 20px 24px;
}

.calculation-summary-total-band div {
  display: grid;
  gap: 4px;
}

.calculation-summary-total-band div:last-child {
  justify-items: end;
}

.calculation-summary-total-band span {
  color: rgba(255, 255, 255, 0.86);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
}

.calculation-summary-total-band strong {
  color: #fff;
  font-size: 30px;
}

.summary-cockpit-metrics {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
}

.summary-cockpit-metrics article {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  padding: 14px;
}

.summary-cockpit-metrics span,
.summary-finance-table th,
.summary-control-panel dt {
  color: var(--muted);
  font-size: 12px;
}

.summary-cockpit-metrics strong {
  color: var(--accent-dark);
  font-size: 20px;
}

.summary-cockpit-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
}

.summary-finance-table,
.summary-control-panel {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 14px;
  padding: 16px;
}

.summary-finance-table h3,
.summary-control-panel h3 {
  color: var(--accent-dark);
  margin: 0;
}

.summary-finance-table table {
  border-collapse: collapse;
  width: 100%;
}

.summary-finance-table th,
.summary-finance-table td {
  border-bottom: 1px solid var(--line);
  padding: 11px 8px;
  text-align: left;
}

.summary-finance-table .number {
  text-align: right;
}

.summary-finance-table tfoot th {
  background: #fbf5f4;
  color: var(--accent-dark);
  font-size: 17px;
}

.summary-finance-table tfoot .summary-vat-row th {
  background: #fff;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}

.summary-status-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.summary-status-pills span {
  background: #f0ebe6;
  color: var(--ink);
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 9px;
}

.summary-status-pills .is-ready {
  background: #e8f3ef;
  color: #1d6f58;
}

.summary-status-pills .is-warning {
  background: #fff0d9;
  color: #9b5c00;
}

.calculation-summary-form {
  background: linear-gradient(135deg, #fff 0%, #fbf2f1 100%);
  border: 1px solid #e2b8b4;
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(105, 22, 19, 0.08);
  display: grid;
  gap: 10px;
  padding: 16px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.calculation-summary-form:focus-within {
  border-color: var(--accent);
  box-shadow: 0 10px 24px rgba(105, 22, 19, 0.14);
}

.calculation-margin-control {
  display: grid;
  gap: 8px;
}

.calculation-margin-control-label {
  color: var(--accent-dark);
  font-size: 14px;
  font-weight: 800;
}

.calculation-margin-input-wrap {
  align-items: stretch;
  background: #fff;
  border: 2px solid var(--accent);
  border-radius: 7px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px;
  overflow: hidden;
}

.calculation-summary-form .calculation-margin-input-wrap input {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--accent-dark);
  font-size: 28px;
  font-weight: 800;
  min-height: 58px;
  padding: 10px 14px;
  width: 100%;
}

.calculation-summary-form .calculation-margin-input-wrap input:focus {
  box-shadow: none;
  outline: 0;
}

.calculation-margin-unit {
  align-items: center;
  background: var(--accent);
  color: #fff;
  display: flex;
  font-size: 22px;
  font-weight: 800;
  justify-content: center;
}

.calculation-summary-form > small {
  font-size: 12px;
  line-height: 1.45;
}

.print-panel {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.print-panel h3,
.print-cost-breakdown h3 {
  color: var(--accent-dark);
  margin: 0;
}

.print-definition-grid {
  display: grid;
  gap: 10px 16px;
  grid-template-columns: minmax(120px, 0.8fr) minmax(0, 1fr);
  margin: 0;
}

.print-definition-grid dd {
  font-weight: 700;
  margin: 0;
}

.print-cost-breakdown {
  overflow-x: auto;
}

.print-cost-breakdown h3 {
  background: #fbf5f4;
  border-bottom: 1px solid var(--line);
  padding: 14px 16px;
}

.print-cost-breakdown table th {
  background: #fbf5f4;
  color: var(--accent-dark);
}

.print-cost-input {
  max-width: 120px;
  min-width: 90px;
}

.calculation-print-apply {
  justify-self: start;
}

.calculation-chip-input {
  min-width: 220px;
}

.calculation-chip-input-control {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  height: 42px;
  max-height: 42px;
  min-height: 42px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 5px 8px;
  scrollbar-width: none;
}

.calculation-chip-input-control::-webkit-scrollbar {
  display: none;
}

.calculation-chip-input-control:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgb(164 19 19 / 10%);
}

.calculation-chip-list {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.calculation-color-chip {
  align-items: center;
  background: #f7e8e6;
  border: 1px solid #e3c4bf;
  color: var(--accent-dark);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  gap: 5px;
  height: 28px;
  line-height: 1;
  min-height: 28px;
  padding: 6px 7px;
}

.calculation-color-chip-remove {
  align-items: center;
  background: transparent;
  border: 0;
  color: var(--accent-dark);
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 900;
  height: 14px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 14px;
}

.calculation-chip-input-control input {
  border: 0;
  flex: 1 0 90px;
  height: 30px;
  min-height: 30px;
  min-width: 90px;
  padding: 5px 0;
}

.calculation-chip-input-control input:focus {
  outline: 0;
}

.calculation-save-status-button {
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.calculation-save-status-button.is-neutral {
  background: #fff;
  border-color: var(--line);
  color: var(--accent-dark);
}

.calculation-save-status-button.is-dirty {
  background: #c77718;
  border-color: #c77718;
  box-shadow: 0 10px 22px rgb(199 119 24 / 18%);
  color: #fff;
}

.calculation-save-status-button.is-saving {
  background: #6b5a4a;
  border-color: #6b5a4a;
  color: #fff;
}

.calculation-save-status-button.is-saved {
  background: #11834a;
  border-color: #11834a;
  color: #fff;
}

.print-total-panel {
  align-items: center;
  background: var(--accent);
  color: #fff;
  display: flex;
  gap: 16px;
  justify-content: flex-end;
  padding: 16px;
}

.print-total-panel span,
.print-total-panel strong {
  color: #fff;
}

.print-total-panel strong {
  font-size: 24px;
}

.calculation-tab-total {
  margin-top: 16px;
}

.calculation-detail-total-band {
  align-items: center;
  background: var(--accent);
  color: #fff;
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
  padding: 18px 22px;
}

.calculation-detail-total-band span {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
}

.calculation-detail-total-band div {
  display: grid;
  gap: 4px;
  justify-items: end;
}

.calculation-detail-total-band strong {
  font-size: 28px;
  line-height: 1;
}

.calculation-detail-total-band small {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.calculation-detail-metrics {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  margin-bottom: 14px;
}

.calculation-detail-metrics article {
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  gap: 8px;
  padding: 14px;
}

.calculation-detail-metrics span {
  color: var(--muted);
  font-size: 12px;
}

.calculation-detail-metrics strong {
  color: var(--accent-dark);
  font-size: 19px;
}

.calculation-detail-workspace {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr);
}

.calculation-detail-main {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.calculation-detail-main > * {
  max-width: 100%;
  min-width: 0;
}

.calculation-detail-main > .table-section {
  overflow-x: auto;
}

.calculation-detail-side {
  position: sticky;
  top: 18px;
}

.document-detail-process-side {
  position: sticky;
  top: 12px;
}

.calculation-detail-context {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(240px, 1.6fr) minmax(180px, 1fr) repeat(2, minmax(140px, 0.8fr));
}

.calculation-detail-context article,
.calculation-detail-kpi-row article {
  background: #fff;
  border: 1px solid rgba(164, 19, 19, 0.12);
  border-radius: 8px;
  box-shadow: 0 14px 38px rgba(35, 30, 28, 0.06);
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 14px 16px;
}

.calculation-detail-context span,
.calculation-detail-kpi-row span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.calculation-detail-context strong,
.calculation-detail-context a {
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.calculation-detail-context a:hover {
  color: var(--accent);
}

.calculation-detail-context small {
  color: var(--muted);
  font-size: 12px;
}

.calculation-detail-client-card {
  border-color: rgba(164, 19, 19, 0.24);
}

.calculation-detail-client-card strong {
  color: var(--accent-dark);
  font-size: 22px;
  line-height: 1.1;
}

.calculation-detail-kpi-row {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.calculation-detail-kpi-row strong {
  color: var(--accent-dark);
  font-size: 18px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.calculation-detail-kpi-row .is-primary {
  background: #fff8f8;
  border-color: rgba(164, 19, 19, 0.28);
}

.calculation-detail-kpi-row .is-primary strong {
  font-size: 22px;
}

.calculation-detail-kpi-row .is-profit {
  background: #f3faf6;
  border-color: rgba(47, 125, 89, 0.28);
}

.calculation-detail-kpi-row .is-profit strong {
  color: #236345;
}

.external-calculation-hero {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(35, 30, 28, 0.05);
  margin-bottom: 14px;
  padding: 22px 26px;
}

.external-calculation-hero .back-link {
  display: none;
}

.external-calculation-hero h1 {
  font-size: clamp(30px, 3vw, 40px);
  letter-spacing: -0.03em;
  line-height: 1.05;
  margin: 5px 0 8px;
}

.external-calculation-eyebrow {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  margin: 0;
  text-transform: uppercase;
}

.external-calculation-subtitle {
  color: var(--muted);
  font-size: 17px;
  margin: 0;
}

.external-calculation-client {
  align-items: baseline;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  gap: 6px;
  margin: 10px 0 0;
}

.external-calculation-client span {
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.external-calculation-client strong {
  color: var(--ink);
  font-size: 15px;
}

.calculation-header-actions {
  align-self: center;
  display: grid;
  gap: 7px;
  justify-items: end;
  min-width: 0;
}

.calculation-header-actions .document-actions {
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.calculation-header-actions .document-actions > form {
  display: flex;
}

.calculation-header-note {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  margin: 0;
  max-width: 520px;
  text-align: right;
}

.calculation-header-blocker-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.calculation-header-blocker-links a {
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.work-order-header-actions {
  align-self: center;
  display: grid;
  gap: 7px;
  justify-items: end;
  min-width: 0;
}

.work-order-header-actions .job-title-actions > form {
  display: flex;
}

.calculation-job-context {
  background: #eae5df;
  border: 1px solid #d7cdc4;
  border-radius: 10px;
  box-shadow: 0 8px 22px rgba(61, 48, 39, 0.07);
  margin-bottom: 16px;
  padding: 10px 12px;
}

.calculation-job-context-grid {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  min-width: 0;
}

.calculation-job-context-card {
  --context-background: rgba(255, 255, 255, 0.84);
  --context-border: #d3c8bf;
  --context-color: var(--text);
  --context-soft: #f5f1ed;
  background: var(--context-soft);
  border: 1px solid var(--context-border);
  border-left: 4px solid var(--context-color);
  border-radius: 8px;
  color: var(--context-color);
  display: grid;
  gap: 7px;
  grid-template-rows: auto minmax(32px, auto);
  min-height: 82px;
  min-width: 0;
  padding: 8px;
}

.calculation-job-context-card > header {
  align-items: center;
  display: flex;
  gap: 6px;
  justify-content: space-between;
  min-width: 0;
}

.calculation-job-context-card h2 {
  color: var(--context-color);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.02em;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.calculation-job-context-count {
  align-items: center;
  background: var(--context-soft);
  border: 0;
  border-radius: 999px;
  color: var(--context-color);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  height: 22px;
  justify-content: center;
  min-width: 22px;
  padding: 0 6px;
  text-decoration: none;
}

.calculation-job-context-controls {
  align-items: stretch;
  display: grid;
  gap: 5px;
  grid-template-columns: minmax(0, 1fr) minmax(44px, auto);
  min-width: 0;
}

.calculation-job-context-controls.is-single {
  grid-template-columns: minmax(0, 1fr);
}

.calculation-job-context-link-list {
  align-items: stretch;
  display: flex;
  gap: 4px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.calculation-job-context-link-list .calculation-job-context-link--compact {
  flex: 0 0 auto;
  justify-content: center;
  min-width: 0;
  padding-inline: 3px;
  width: auto;
}

.calculation-job-context-card--calculations .calculation-job-context-controls {
  gap: 4px;
  grid-template-columns: minmax(0, 1fr) minmax(30px, auto);
}

.calculation-job-context-card--calculations .calculation-job-context-action {
  font-size: 10px;
  padding-inline: 2px;
}

.calculation-job-context-link--compact.is-current {
  background: var(--context-color);
  color: #fff;
}

.calculation-job-context-controls form {
  display: flex;
  margin: 0;
  min-width: 0;
}

.calculation-job-context-link,
.calculation-job-context-action,
.calculation-job-context-empty {
  align-items: center;
  background: #fff;
  border: 1px solid var(--context-border);
  border-radius: 6px;
  color: var(--context-color);
  display: flex;
  font-size: 11px;
  font-weight: 850;
  justify-content: flex-start;
  line-height: 1.2;
  min-height: 32px;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 6px 8px;
  text-decoration: none;
  width: 100%;
}

.calculation-job-context-action {
  cursor: pointer;
  justify-content: center;
  text-align: center;
}

.calculation-job-context-action:hover:not(:disabled),
.calculation-job-context-action:focus-visible,
.calculation-job-context-link:hover,
.calculation-job-context-link:focus-visible {
  background: var(--context-soft);
  color: var(--context-color);
}

.calculation-job-context-action:disabled,
.calculation-job-context-empty {
  color: var(--muted);
  cursor: not-allowed;
}

.calculation-job-context-card--job {
  --context-border: var(--doc-job-border);
  --context-color: var(--doc-job);
  --context-soft: var(--doc-job-soft);
}

.calculation-job-context-card--calculations {
  --context-border: var(--doc-calculation-border);
  --context-color: var(--doc-calculation);
  --context-soft: var(--doc-calculation-soft);
}

.calculation-job-context-card--offers {
  --context-border: var(--doc-offer-border);
  --context-color: var(--doc-offer);
  --context-soft: var(--doc-offer-soft);
}

.calculation-job-context-card--customer-orders {
  --context-border: var(--doc-customer-order-border);
  --context-color: var(--doc-customer-order);
  --context-soft: var(--doc-customer-order-soft);
}

.calculation-job-context-card--work-orders {
  --context-border: var(--doc-work-order-border);
  --context-color: var(--doc-work-order);
  --context-soft: var(--doc-work-order-soft);
}

.calculation-job-context-card--proformas {
  --context-border: var(--doc-proforma-border);
  --context-color: var(--doc-proforma);
  --context-soft: var(--doc-proforma-soft);
}

.calculation-job-context-card--invoices {
  --context-border: var(--doc-invoice-border);
  --context-color: var(--doc-invoice);
  --context-soft: var(--doc-invoice-soft);
}

.calculation-job-context-card--delivery-notes {
  --context-border: var(--doc-delivery-note-border);
  --context-color: var(--doc-delivery-note);
  --context-soft: var(--doc-delivery-note-soft);
}

.external-calculation-process {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 16px;
  padding: 12px;
}

.external-calculation-process > a,
.external-calculation-process > form,
.external-calculation-process > form button {
  min-width: 0;
}

.external-calculation-process > a,
.external-calculation-process > form button {
  background: #fbfaf9;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--text);
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  text-align: left;
  text-decoration: none;
  width: 100%;
}

.external-calculation-process > form {
  margin: 0;
}

.external-calculation-process > form button {
  cursor: pointer;
  font: inherit;
}

.external-calculation-process span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.external-calculation-process strong {
  font-size: 15px;
}

.external-calculation-process .is-done,
.external-calculation-process > form.is-done button {
  background: #eef8f4;
  border-color: #c6e6da;
}

.external-calculation-process .is-current button {
  background: #fbefee;
  border-color: #efcac6;
  color: var(--accent-dark);
}

.external-calculation-process--editor {
  gap: 7px;
  padding: 9px;
}

.external-calculation-process--editor > a,
.external-calculation-process--editor > div {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-left: 4px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  display: grid;
  gap: 3px;
  min-height: 62px;
  min-width: 0;
  padding: 9px 11px;
  text-align: left;
  text-decoration: none;
}

.external-calculation-process--editor > a.is-done {
  background: var(--doc-work-order-soft);
  border-color: var(--doc-work-order-border);
  border-left-color: var(--doc-work-order);
}

.external-calculation-process--editor > a.is-job {
  background: var(--doc-job-soft);
  border-color: var(--doc-job-border);
  border-left-color: var(--doc-job);
  color: var(--doc-job-dark);
}

.external-calculation-process--editor > .is-calculation {
  background: var(--doc-calculation-soft);
  border-color: var(--doc-calculation-border);
  border-left-color: var(--doc-calculation);
  color: var(--doc-calculation-dark);
}

.external-calculation-process--editor > .is-offer {
  border-left-color: var(--doc-offer);
}

.external-calculation-context-strip,
.external-calculation-basic-panel {
  border-left: 4px solid var(--doc-calculation);
}

.external-calculation-context-strip {
  display: grid;
  gap: 10px;
  grid-template-columns: 1.15fr 1fr 0.9fr 1fr;
}

.external-calculation-basic-panel .section-header {
  margin-bottom: 12px;
}

.external-structured-specification {
  background: var(--surface-soft);
  border-radius: 7px;
  padding: 0 10px 10px;
}

.external-structured-specification > summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 850;
  padding: 10px 0;
}

.external-structured-specification-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 10px;
}

.external-structured-specification-grid article {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  min-width: 0;
  padding: 8px;
}

.external-structured-specification-grid span {
  color: var(--muted);
  display: block;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.external-structured-specification-grid strong {
  color: var(--text);
  font-size: 11px;
  overflow-wrap: anywhere;
  padding: 0;
  white-space: normal;
}

.external-structured-specification label {
  color: var(--muted);
  font-size: 11px;
}

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

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

@media (max-width: 760px) {
  .external-calculation-context-strip {
    grid-template-columns: minmax(0, 1fr);
  }

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

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

.calculation-detail-workspace.is-external-detail .calculation-detail-side {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) 290px;
  position: static;
}

.external-calculation-financials,
.external-calculation-product-card,
.external-calculation-source-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(35, 30, 28, 0.05);
}

.external-calculation-financials {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 20px;
}

.external-calculation-financials article {
  background: #fbfaf9;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 16px;
}

.external-calculation-financials span,
.external-calculation-spec-grid span,
.external-calculation-source-chain span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.external-calculation-financials strong {
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.05;
}

.external-calculation-product-card,
.external-calculation-source-card {
  padding: 20px;
}

.external-calculation-section-heading {
  align-items: start;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  margin-bottom: 16px;
}

.external-calculation-section-heading h2 {
  font-size: 22px;
  margin: 0 0 5px;
}

.external-calculation-section-heading p {
  color: var(--muted);
  margin: 0;
}

.external-calculation-kpd {
  background: #edf4ff;
  border: 1px solid #cdddf6;
  border-radius: 999px;
  color: #2d5f9e;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  padding: 7px 11px;
}

.external-calculation-product-identity {
  background: #fff9f8;
  border: 1px solid #efd5d2;
  border-radius: 9px;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(150px, 0.75fr) minmax(280px, 2fr) minmax(140px, 0.75fr);
  padding: 16px;
}

.external-calculation-product-identity div {
  display: grid;
  gap: 6px;
}

.external-calculation-product-identity span {
  color: var(--muted);
  font-size: 14px;
}

.external-calculation-product-identity strong {
  font-size: 22px;
  line-height: 1.15;
}

.external-calculation-spec-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 12px;
}

.external-calculation-spec-grid article {
  background: #fbfaf9;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.external-calculation-spec-grid strong {
  font-size: 15px;
  line-height: 1.3;
}

.external-calculation-source-chain {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.external-calculation-source-chain > a,
.external-calculation-source-chain > article,
.external-calculation-source-chain > form,
.external-calculation-source-chain > form button {
  min-width: 0;
}

.external-calculation-source-chain > a,
.external-calculation-source-chain > article,
.external-calculation-source-chain > form button {
  background: #fbfaf9;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  display: grid;
  gap: 6px;
  padding: 14px;
  text-align: left;
  text-decoration: none;
  width: 100%;
}

.external-calculation-source-chain > form {
  margin: 0;
}

.external-calculation-source-chain > form button {
  cursor: pointer;
  font: inherit;
}

.external-calculation-source-chain strong {
  font-size: 16px;
  overflow-wrap: anywhere;
}

.external-calculation-source-chain small {
  color: var(--muted);
}

.external-calculation-source-chain .is-calculation {
  background: #fff5f4;
  border-color: #efcfcc;
}

.external-calculation-source-chain .is-offer,
.external-calculation-source-chain form.is-offer button {
  background: #f2f6fd;
  border-color: #d3def2;
}

.calculation-detail-grand-total th {
  background: var(--accent);
  color: #fff;
  font-size: 16px;
  padding: 16px;
}

.calculation-detail-grand-total .number {
  display: grid;
  gap: 4px;
  justify-items: end;
}

.calculation-detail-grand-total span {
  color: #fff;
  font-size: 22px;
}

.calculation-detail-grand-total small {
  color: #fff;
  font-size: 11px;
  text-transform: uppercase;
}

.calculation-detail-section-header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
}

.calculation-detail-section-header h2 {
  margin-bottom: 6px;
}

.calculation-detail-material-order.is-attention {
  background: linear-gradient(135deg, #fff8ed 0%, #fffaf4 48%, #fff 100%);
  border-color: rgba(176, 117, 0, 0.24);
  box-shadow: 0 16px 42px rgba(108, 76, 21, 0.08);
}

.calculation-detail-material-order.is-attention .calculation-detail-section-header h2 {
  color: #7a4f00;
}

.calculation-detail-material-order.is-attention .calculation-detail-order-total {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(176, 117, 0, 0.22);
}

.calculation-detail-order-total {
  background: #fbf5f4;
  border: 1px solid var(--line);
  display: flex;
  gap: 10px;
  padding: 12px 16px;
}

.calculation-detail-order-total span {
  color: var(--muted);
}

.calculation-detail-order-total strong {
  color: var(--accent-dark);
}

.calculation-detail-component-list {
  display: grid;
  gap: 12px;
}

.calculation-line-overview {
  overflow: hidden;
}

.calculation-line-overview-list {
  border-top: 1px solid var(--line);
  display: grid;
}

.calculation-line-overview-row {
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: 38px minmax(250px, 1.35fr) minmax(100px, 0.45fr) minmax(450px, 1.7fr);
  padding: 18px 20px;
}

.calculation-line-overview-row + .calculation-line-overview-row {
  border-top: 1px solid var(--line-soft);
}

.calculation-line-overview-row.is-component {
  grid-template-columns: 38px minmax(300px, 1.35fr) minmax(100px, 0.45fr) minmax(450px, 1.7fr);
}

.calculation-line-overview-index {
  align-items: center;
  background: var(--accent);
  border-radius: 999px;
  color: #fff;
  display: flex;
  font-size: 14px;
  font-weight: 900;
  height: 32px;
  justify-content: center;
  width: 32px;
}

.calculation-line-overview-copy > span,
.calculation-line-overview-quantity span,
.calculation-line-overview-price span,
.calculation-line-overview-total span {
  color: var(--muted);
  display: block;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.calculation-line-overview-copy h3 {
  color: var(--text);
  font-size: 21px;
  line-height: 1.15;
  margin: 3px 0;
}

.calculation-line-overview-copy p {
  color: var(--accent);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.3;
  margin: 4px 0 0;
}

.calculation-line-overview-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.calculation-line-overview-meta > span {
  background: #f8f4f1;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  color: var(--muted);
  font-size: 10px;
  padding: 6px 8px;
  text-transform: uppercase;
}

.calculation-line-overview-meta strong {
  color: var(--text);
  display: block;
  font-size: 12px;
  margin-top: 2px;
  text-transform: none;
}

.calculation-line-overview-quantity,
.calculation-line-overview-price,
.calculation-line-overview-total {
  display: grid;
  gap: 4px;
}

.calculation-line-overview-financials {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(125px, 1fr));
}

.calculation-line-financial-cell {
  background: #faf7f4;
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 10px;
}

.calculation-line-financial-cell > span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.calculation-line-financial-cell > strong {
  font-size: 14px;
  overflow-wrap: anywhere;
}

.calculation-line-financial-cell > small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.calculation-line-financial-cell.is-sale {
  background: #fff8f8;
  border-color: rgba(164, 19, 19, 0.2);
}

.calculation-line-financial-cell.is-profit {
  background: #f3faf6;
  border-color: rgba(47, 125, 89, 0.24);
}

.calculation-line-financial-cell.is-profit > strong,
.calculation-line-financial-cell.is-profit > small {
  color: #236345;
}

.calculation-line-overview-quantity strong,
.calculation-line-overview-price strong {
  font-size: 16px;
}

.calculation-line-overview-total {
  justify-items: end;
  text-align: right;
}

.calculation-line-overview-total strong {
  color: var(--accent-dark);
  font-size: 22px;
}

.calculation-detail-deep-dive {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}

.calculation-detail-deep-dive > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  list-style: none;
  padding: 16px 20px;
}

.calculation-detail-deep-dive > summary::-webkit-details-marker {
  display: none;
}

.calculation-detail-deep-dive > summary > span:first-child {
  display: grid;
  gap: 3px;
}

.calculation-detail-deep-dive > summary strong {
  font-size: 18px;
}

.calculation-detail-deep-dive > summary small,
.calculation-detail-deep-dive > summary > span:last-child {
  color: var(--muted);
  font-size: 12px;
}

.calculation-detail-deep-dive[open] > summary {
  border-bottom: 1px solid var(--line);
}

.calculation-detail-deep-dive-action > span:last-child,
.calculation-detail-deep-dive[open] .calculation-detail-deep-dive-action > span:first-child {
  display: none;
}

.calculation-detail-deep-dive[open] .calculation-detail-deep-dive-action > span:last-child {
  display: inline;
}

.calculation-detail-deep-dive > .calculation-detail-components {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
}

@media (max-width: 1050px) {
  .calculation-line-overview-row,
  .calculation-line-overview-row.is-component {
    grid-template-columns: 38px minmax(240px, 1fr) minmax(110px, 0.4fr);
  }

  .calculation-line-overview-quantity {
    grid-column: 3;
  }

  .calculation-line-overview-financials {
    grid-column: 2 / -1;
  }

  .finishing-die-mode-grid,
  .finishing-die-fields {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
}

@media (max-width: 720px) {
  .calculation-line-overview-row,
  .calculation-line-overview-row.is-component {
    align-items: start;
    grid-template-columns: 32px minmax(0, 1fr);
    padding: 15px;
  }

  .calculation-line-overview-copy,
  .calculation-line-overview-quantity,
  .calculation-line-overview-price,
  .calculation-line-overview-total,
  .calculation-line-overview-financials {
    grid-column: 2;
    justify-items: start;
    text-align: left;
  }

  .calculation-line-overview-financials {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .calculation-detail-deep-dive > summary {
    align-items: flex-start;
    gap: 14px;
  }

  .finishing-die-mode-grid,
  .finishing-die-fields,
  .finishing-die-charge-grid {
    grid-template-columns: 1fr;
  }
}

.calculation-detail-component {
  border: 1px solid var(--line);
  background: #fff;
}

.calculation-component-card {
  border-radius: 8px;
  box-shadow: 0 16px 42px rgba(35, 30, 28, 0.06);
  overflow: hidden;
}

.calculation-component-header {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 16px 18px;
}

.calculation-component-header span {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.calculation-component-header h3 {
  font-size: 20px;
  margin: 4px 0 0;
}

.calculation-component-header strong {
  color: var(--accent-dark);
  font-size: 20px;
}

.calculation-component-total {
  display: grid;
  gap: 3px;
  justify-items: end;
  text-align: right;
}

.calculation-component-total small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.calculation-component-tabs {
  background: #fbf8f6;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 0;
  overflow-x: auto;
  padding: 0 12px;
}

.calculation-component-tabs button {
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  color: var(--muted);
  cursor: pointer;
  font-weight: 800;
  min-height: 44px;
  padding: 0 14px;
  white-space: nowrap;
}

.calculation-component-tabs button.is-active {
  border-bottom-color: var(--accent);
  color: var(--accent-dark);
}

.calculation-component-panel {
  padding: 16px 18px 18px;
}

.calculation-component-panel[hidden] {
  display: none;
}

.calculation-component-panel table {
  margin: 0;
}

.calculation-component-spec-grid {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  gap: 10px 16px;
  grid-template-columns: repeat(2, minmax(120px, 0.65fr) minmax(0, 1.35fr));
  padding: 14px;
}

.calculation-component-cost-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(220px, 0.5fr) minmax(0, 1fr);
}

.calculation-component-other-cost-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.calculation-component-cost-grid article,
.calculation-component-other-cost-grid article {
  min-width: 0;
}

.calculation-component-cost-grid h4,
.calculation-component-other-cost-grid h4,
.calculation-component-panel h4 {
  color: var(--accent-dark);
  font-size: 14px;
  margin: 14px 0 10px;
}

.calculation-color-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.calculation-color-chip-list span {
  background: #fff8f8;
  border: 1px solid rgba(164, 19, 19, 0.22);
  border-radius: 999px;
  color: var(--accent-dark);
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  padding: 3px 8px;
}

.calculation-detail-component summary {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  list-style: none;
  padding: 14px 16px;
}

.calculation-detail-component summary::-webkit-details-marker {
  display: none;
}

.calculation-detail-component summary small {
  color: var(--accent-dark);
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.calculation-detail-component summary strong {
  color: var(--text);
  font-size: 18px;
}

.calculation-detail-component-total {
  color: var(--accent-dark);
  font-size: 18px;
  font-weight: 700;
}

.calculation-detail-component:not([open]) .collapse-indicator::before {
  transform: rotate(-45deg);
}

.calculation-detail-component-grid {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 14px 16px;
}

.calculation-detail-component-grid article {
  background: #fbf5f4;
  border: 1px solid var(--line);
  padding: 14px;
}

.calculation-detail-component-grid h3 {
  color: var(--accent-dark);
  font-size: 15px;
  margin: 0 0 10px;
}

.calculation-detail-imposition-summary {
  align-items: stretch;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(170px, 0.75fr) minmax(0, 1fr);
}

.calculation-detail-imposition-thumb {
  align-items: stretch;
  background: #fff;
  border: 1px solid var(--line);
  display: grid;
  min-height: 260px;
  padding: 10px;
}

.calculation-detail-imposition-thumb svg {
  display: block;
  height: 100%;
  min-height: 240px;
  width: 100%;
}

.calculation-detail-imposition-thumb .imposition-sheet {
  fill: #fff;
  stroke: var(--accent);
  stroke-width: 1.5;
}

.calculation-detail-imposition-thumb .imposition-bleed {
  fill: rgba(164, 19, 19, 0.08);
  stroke: var(--accent);
  stroke-width: 1;
}

.calculation-detail-imposition-thumb .imposition-finish {
  fill: rgba(255, 255, 255, 0.62);
  stroke: #333;
  stroke-width: 0.8;
}

.calculation-detail-imposition-thumb text {
  fill: var(--accent-dark);
  font-size: 10px;
  font-weight: 700;
  text-anchor: middle;
  dominant-baseline: central;
}

.compact-definition-list {
  gap: 8px 12px;
  grid-template-columns: minmax(140px, 0.8fr) minmax(0, 1fr);
}

.calculation-detail-component-lines {
  overflow-x: auto;
  padding: 0 16px 16px;
}

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

.finishing-line-list {
  border: 1px solid var(--line);
  border-radius: 12px;
  display: grid;
  overflow: hidden;
}

.finishing-line {
  display: grid;
  gap: 0;
}

.finishing-line + .finishing-line {
  border-top: 1px solid var(--line);
}

.finishing-line-header {
  align-items: center;
  background: #fbf5f4;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding: 12px 14px;
}

.finishing-line-header span {
  color: var(--accent-dark);
  font-weight: 700;
}

.finishing-line-accordion > summary {
  list-style: none;
}

.finishing-line-accordion > summary::-webkit-details-marker {
  display: none;
}

.finishing-line-summary {
  align-items: center;
  background: var(--surface);
  cursor: pointer;
  display: grid;
  gap: 14px;
  grid-template-columns: 18px minmax(0, 1fr) minmax(190px, auto);
  min-height: 76px;
  padding: 14px 16px;
}

.finishing-line-summary:hover {
  background: #fbf7f6;
}

.finishing-line-accordion[open] > .finishing-line-summary {
  background: #fbf5f4;
  border-bottom: 1px solid var(--line);
}

.finishing-line-chevron {
  border-bottom: 2px solid var(--accent-dark);
  border-right: 2px solid var(--accent-dark);
  display: block;
  height: 8px;
  transform: rotate(-45deg);
  transition: transform 140ms ease;
  width: 8px;
}

.finishing-line-accordion[open] > .finishing-line-summary .finishing-line-chevron {
  transform: rotate(45deg) translate(-2px, -2px);
}

.finishing-line-identity,
.finishing-line-state {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.finishing-line-identity strong {
  color: var(--accent-dark);
  font-size: 1.03rem;
}

.finishing-line-identity small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.finishing-line-state {
  justify-items: end;
  text-align: right;
}

.finishing-line-state > strong {
  color: var(--accent-dark);
}

.finishing-line.is-missing_cost .status-badge,
.finishing-line.is-warning .status-badge,
.finishing-line.is-incomplete .status-badge {
  background: #fff4e5;
  color: #9a5b00;
}

.finishing-line.is-invalid .status-badge {
  background: #fef2f2;
  color: #991b1b;
}

.finishing-line.is-ready .status-badge {
  background: #ecfdf3;
  color: #166534;
}

.finishing-line-body {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.finishing-line-body-header {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.finishing-line-body-header p {
  color: var(--muted);
  margin: 3px 0 0;
}

.finishing-line-rate {
  margin: 0;
}

.finishing-line-warning {
  background: #fff8eb;
  border-left: 3px solid #d97706;
  color: #8a4b00;
  margin: 0;
  padding: 10px 12px;
}

.finishing-advanced-slot:empty {
  display: none;
}

.finishing-advanced-slot .numbering-plan-card {
  margin-top: 2px;
}

.finishing-system-line {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}

.finishing-system-line-body {
  align-items: start;
}

.finishing-system-line-body p {
  margin: 0;
}

.finishing-system-line-body .button-secondary {
  justify-self: start;
}

.finishing-line-grid {
  align-items: end;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(180px, 1.4fr) minmax(100px, 0.6fr) minmax(120px, 0.7fr) minmax(120px, 0.7fr) minmax(160px, 1fr) minmax(110px, 0.6fr);
  padding: 14px;
}

.finishing-line-grid label,
.finishing-line-total {
  display: grid;
  gap: 6px;
}

.finishing-line-total span {
  color: var(--muted);
  font-size: 12px;
}

.finishing-line-total strong {
  color: var(--accent-dark);
  font-size: 16px;
}

.finishing-subtotal {
  margin-top: 0;
}

.calculation-costs-form {
  display: grid;
  gap: 18px;
}

.cost-group {
  border: 1px solid var(--line);
  display: grid;
  gap: 0;
}

.cost-group-header {
  align-items: center;
  background: #fbf5f4;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 14px 16px;
}

.cost-group-header h3 {
  color: var(--accent-dark);
  margin: 0;
}

.cost-group-header p {
  color: var(--muted);
  margin: 4px 0 0;
}

.cost-line-list {
  display: grid;
}

.cost-line {
  align-items: end;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 12px;
  padding: 14px 16px;
}

.cost-line-prepress {
  grid-template-columns: minmax(180px, 1.4fr) minmax(90px, 0.45fr) minmax(120px, 0.55fr) minmax(160px, 1fr) minmax(110px, 0.5fr) auto;
}

.cost-line-other {
  grid-template-columns: minmax(170px, 1.2fr) minmax(90px, 0.45fr) minmax(115px, 0.6fr) minmax(115px, 0.55fr) minmax(150px, 0.9fr) minmax(110px, 0.5fr) auto;
}

.cost-line label,
.cost-line-total {
  display: grid;
  gap: 6px;
}

.cost-line-total span {
  color: var(--muted);
  font-size: 12px;
}

.cost-line-total strong {
  color: var(--accent-dark);
  font-size: 16px;
}

.calculation-sidebar {
  top: 18px;
}

.component-sidebar-summary {
  display: grid;
  gap: 14px;
}

.component-sidebar-list {
  display: grid;
  gap: 10px;
}

.component-sidebar-card {
  border: 1px solid var(--line);
  background: #fff;
}

.component-sidebar-card.is-active {
  border-color: var(--accent);
}

.component-sidebar-card summary {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto 16px;
  list-style: none;
  padding: 12px;
}

.component-sidebar-card summary::-webkit-details-marker {
  display: none;
}

.component-sidebar-card summary::after {
  border-bottom: 2px solid var(--accent-dark);
  border-right: 2px solid var(--accent-dark);
  content: "";
  height: 7px;
  transform: rotate(45deg);
  transition: transform 0.15s ease;
  width: 7px;
}

.component-sidebar-card[open] summary::after {
  transform: rotate(225deg);
}

.component-sidebar-card summary span,
.component-sidebar-card-body {
  display: grid;
  gap: 4px;
}

.component-sidebar-card summary small {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.component-sidebar-card summary strong {
  color: var(--text);
}

.component-sidebar-card summary b {
  color: var(--accent-dark);
  white-space: nowrap;
}

.component-sidebar-card-body {
  border-top: 1px solid var(--line);
  padding: 12px;
}

.component-money-list {
  border-top: 1px solid var(--line);
  margin-top: 0;
  padding-top: 8px;
}

.component-money-heading {
  margin-top: 8px;
}

.calculation-finance-panel {
  display: grid;
  gap: 16px;
}

.calculation-total-box {
  background: var(--accent);
  color: #fff;
  display: grid;
  gap: 4px;
  padding: 16px;
}

.calculation-total-box span,
.calculation-total-box small,
.calculation-total-box strong {
  color: #fff;
}

.calculation-total-box strong {
  font-size: 28px;
}

.calculation-total-unit {
  border-top: 1px solid rgba(255, 255, 255, 0.35);
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
  padding-top: 8px;
}

.calculation-total-box .calculation-total-unit span,
.calculation-total-box .calculation-total-unit strong {
  font-size: 13px;
}

.calculation-total-box .calculation-total-unit strong {
  font-weight: 800;
}

.workflow-options {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.workflow-option {
  border: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
}

.workflow-option h3 {
  font-size: 16px;
  margin: 0 0 8px;
}

.workflow-option p {
  margin: 0;
}

@media (max-width: 1700px) {
  html:has(.external-calculation-form),
  body:has(.external-calculation-form) {
    overflow-x: clip;
  }

  .external-calculation-form {
    grid-template-columns: minmax(0, 1fr);
    padding-bottom: 92px;
  }

  .external-calculation-form .context-side-column {
    bottom: 18px;
    max-height: calc(100vh - 36px);
    overflow: visible;
    position: fixed;
    right: 0;
    top: 18px;
    transform: translateX(100%);
    transition: transform 160ms ease, box-shadow 160ms ease;
    width: 320px;
    z-index: 45;
  }

  .external-calculation-form .context-side-column:hover,
  .context-sidebar-open .external-calculation-form .context-side-column,
  .context-sidebar-pinned .external-calculation-form .context-side-column {
    box-shadow: -10px 0 24px rgba(0, 0, 0, 0.12);
    transform: translateX(0);
  }

  .external-calculation-form .context-sidebar-rail {
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 8px 20px rgba(31, 29, 27, 0.08);
    display: grid;
    gap: 8px;
    left: -43px;
    padding: 8px 6px;
    position: absolute;
    top: 0;
    width: 43px;
  }

  .external-calculation-form .context-sidebar-rail-button {
    height: 30px;
    width: 30px;
  }

  .external-calculation-action-dock {
    align-items: center;
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid var(--line);
    bottom: 18px;
    box-shadow: 0 12px 30px rgba(31, 29, 27, 0.18);
    display: flex;
    gap: 18px;
    justify-content: space-between;
    max-width: min(560px, calc(100vw - 100px));
    padding: 12px 14px;
    position: fixed;
    right: 68px;
    transition: opacity 140ms ease, transform 140ms ease;
    width: max-content;
    z-index: 44;
  }

  .external-calculation-action-state {
    align-items: center;
    display: flex;
    gap: 10px;
    min-width: 0;
  }

  .external-calculation-action-state > div {
    display: grid;
    gap: 2px;
    min-width: 0;
  }

  .external-calculation-action-state strong,
  .external-calculation-action-state small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .external-calculation-action-state strong {
    font-size: 13px;
  }

  .external-calculation-action-state small {
    color: var(--muted);
    font-size: 11px;
  }

  .external-calculation-action-dot {
    background: #8b817a;
    border-radius: 50%;
    flex: 0 0 auto;
    height: 9px;
    width: 9px;
  }

  .external-calculation-action-dock.is-dirty .external-calculation-action-dot {
    background: var(--accent);
    box-shadow: 0 0 0 4px rgba(164, 19, 19, 0.12);
  }

  .external-calculation-action-dock.is-clean .external-calculation-action-dot {
    background: #2f7a62;
  }

  .external-calculation-action-dock.is-saving .external-calculation-action-dot {
    animation: external-save-pulse 900ms ease-in-out infinite alternate;
    background: var(--accent);
  }

  .external-calculation-action-dock .button-primary {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .external-calculation-form .context-side-column:hover ~ .external-calculation-action-dock,
  .context-sidebar-open .external-calculation-action-dock,
  .context-sidebar-pinned .external-calculation-action-dock {
    opacity: 0;
    pointer-events: none;
    transform: translateX(12px);
  }
}

@keyframes external-save-pulse {
  from { opacity: 0.45; }
  to { opacity: 1; }
}

@media (max-width: 760px) {
  .external-calculation-action-dock {
    bottom: 12px;
    left: 12px;
    max-width: none;
    right: 12px;
    width: auto;
  }

  .external-calculation-action-state small {
    display: none;
  }

  .app-sidebar,
  .app-sidebar:hover,
  .sidebar-pinned .app-sidebar {
    border-bottom: 1px solid var(--line);
    border-right: 0;
    bottom: auto;
    box-shadow: 0 8px 20px rgba(31, 29, 27, 0.08);
    display: flex;
    gap: 8px;
    height: 58px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 8px 12px;
    right: 0;
    width: 100%;
  }

  .sidebar-top,
  .sidebar-nav,
  .sidebar-user {
    display: flex;
    gap: 8px;
  }

  .sidebar-top {
    flex: 0 0 auto;
  }

  .sidebar-nav {
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .sidebar-user {
    border-top: 0;
    padding-top: 0;
  }

  .sidebar-pin,
  .sidebar-user-card {
    display: none;
  }

  .notification-popover {
    bottom: auto;
    left: 12px;
    max-height: calc(100vh - 88px);
    top: 72px;
    width: calc(100vw - 24px);
  }

  .notification-list {
    max-height: calc(100vh - 170px);
  }

  .sidebar-brand,
  .sidebar-link {
    grid-template-columns: 40px;
    padding-right: 0;
  }

  .sidebar-label,
  .app-sidebar:hover .sidebar-label,
  .sidebar-pinned .sidebar-label {
    display: none;
  }

  .has-sidebar .page,
  .sidebar-pinned .page {
    margin-left: 0;
    padding-top: 82px;
  }

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

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

  .sales-document-header-workspace {
    grid-template-columns: 1fr;
  }

  .sales-document-header-column-resizer {
    display: none;
  }

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

  .request-item-card {
    grid-template-columns: 1fr;
  }

  .request-group-item {
    grid-template-columns: 1fr;
  }

  .request-group-details strong {
    text-align: left;
  }

  .request-view-workflow {
    grid-template-columns: 1fr;
  }

  .calculation-request-item {
    grid-template-columns: 1fr;
  }

  .calculation-request-material strong,
  .calculation-request-other strong {
    text-align: left;
  }

  .calculation-project-summary,
  .calculation-structure-panel,
  .calculation-detail-context,
  .calculation-detail-kpi-row,
  .calculation-component-spec-grid,
  .calculation-component-cost-grid,
  .calculation-component-other-cost-grid,
  .calculation-basic-grid,
  .component-field-grid,
  .calculation-preview-cards,
  .calculation-cost-panels,
  .calculation-cutting-preview,
  .calculation-cutting-controls,
  .calculation-material-card-body,
  .calculation-material-panels,
  .calculation-material-additional-body,
  .calculation-material-reference,
  .calculation-detail-component-grid,
  .external-line-grid,
  .external-line-main,
  .external-line-pricing,
  .external-summary-grid,
  .pricing-product-context,
  .pricing-signal-grid,
  .pricing-alternative-grid,
  .external-sanity-list article,
  .external-supplier-profit-panel,
  .external-supplier-profit-list article,
  .calculation-print-grid,
  .machine-mini-summary,
  .paper-cutting-plan-summary,
  .print-summary-strip,
  .summary-cockpit-grid,
  .finishing-line-grid,
  .cost-line,
  .settings-grid,
  .machine-spec-grid,
  .machine-calibration-grid {
    grid-template-columns: 1fr;
  }

  .workflow-options {
    grid-template-columns: 1fr;
  }

  .filter-form {
    grid-template-columns: 1fr;
  }

  .filter-primary-row {
    grid-template-columns: 1fr;
  }

  .filter-action-group {
    justify-content: flex-start;
  }

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

  .job-intake-grid {
    grid-template-columns: 1fr;
  }

  .material-name-input-row {
    grid-template-columns: 1fr;
  }

  .request-advanced-grid {
    grid-template-columns: 1fr;
  }

  .calculation-link-summary-grid {
    grid-template-columns: 1fr;
  }

  .calculation-detail-total-band,
  .calculation-summary-heading,
  .calculation-summary-total-band,
  .calculation-detail-section-header {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  .calculation-detail-total-band div,
  .calculation-summary-total-band div:last-child,
  .calculation-detail-grand-total .number {
    justify-items: start;
  }

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

  .job-basic-grid {
    grid-template-columns: 1fr;
  }

  .job-command-title {
    align-items: flex-start;
    flex-direction: column;
  }

  .job-title-meta {
    justify-content: flex-start;
  }

  .job-command-flow,
  .job-linked-doc-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .job-command-overview-grid {
    grid-template-columns: 1fr;
  }

  .job-workspace {
    grid-template-columns: 1fr;
  }

  .request-config-grid {
    grid-template-columns: 1fr;
  }

  .job-side-column {
    position: static;
  }

  .summary-actions {
    display: none;
  }

  .external-line-card-header,
  .external-line-header-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .external-line-header-summary strong {
    text-align: left;
  }

  .external-line-preview {
    grid-template-columns: 1fr;
  }

  .page-title-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .document-template-editor {
    grid-template-columns: 1fr;
  }

  .document-template-sidebar {
    position: static;
  }

  .document-template-canvas-shell {
    min-height: 520px;
    padding: 16px;
  }
}

@media (max-width: 680px) {
  .calculation-editor {
    grid-template-columns: minmax(0, 1fr);
  }

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

  .calculation-tab-panel {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }

  .calculation-tab-panel > .section-header {
    align-items: stretch;
    flex-direction: column;
  }

  .calculation-tab-panel > .section-header .button-secondary {
    width: 100%;
  }

  .calculation-material-combined-form,
  .calculation-material-card,
  .calculation-material-card-body,
  .calculation-material-processing-scope {
    min-width: 0;
    width: 100%;
  }

  .calculation-material-processing-header,
  .calculation-material-card-header {
    align-items: stretch;
    flex-direction: column;
  }

  .calculation-material-processing-header label {
    min-width: 0;
  }

  .calculation-material-card-title {
    align-items: flex-start;
    flex-direction: column;
  }

  .external-profit-breakdown {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  .job-command-flow,
  .job-linked-doc-grid {
    grid-template-columns: 1fr;
  }
}

/* Lumen-inspired HIP direction: lighter shell, softer panels, denser operational overview. */
:root {
  --bg: #f3f0ec;
  --surface-soft: #fbfaf8;
  --surface-strong: #f7f2ee;
  --line: #ddd5cf;
  --line-soft: #ece4de;
  --muted: #706762;
  --accent-dark: #7d1510;
  --accent-soft: #faecec;
  --shadow-soft: 0 18px 48px rgba(47, 35, 28, 0.08);
  --shadow-subtle: 0 10px 30px rgba(47, 35, 28, 0.045);
  --sidebar-open: 248px;
}

body {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0) 230px),
    var(--bg);
}

.page {
  padding-top: 22px;
}

.app-sidebar {
  background: #fbfaf8;
  box-shadow: none;
  gap: 18px;
  padding: 14px 10px;
}

.sidebar-brand,
.sidebar-link,
.sidebar-user-card {
  border-radius: 8px;
}

.sidebar-brand-mark {
  background: linear-gradient(135deg, var(--accent-dark), #c92525);
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(164, 19, 19, 0.22);
}

.sidebar-avatar {
  border-radius: 8px;
}

.sidebar-link {
  color: #5f5651;
  min-height: 42px;
}

.sidebar-link:hover {
  background: #f3ede8;
  color: var(--accent-dark);
}

.sidebar-link.is-active {
  background: var(--accent-soft);
  border-color: #efd0d0;
  color: var(--accent-dark);
}

.sidebar-user-card {
  background: #fff;
  border: 1px solid var(--line-soft);
  padding-right: 8px;
}

.page-title,
.detail-page-title,
.filter-panel,
.table-section,
.info-panel,
.studio-detail-panel,
.studio-detail-section,
.studio-total-panel,
.job-command-title,
.job-summary-panel {
  border-radius: 8px;
}

.detail-page-title,
.filter-panel,
.table-section,
.info-panel,
.studio-detail-panel,
.studio-detail-section,
.studio-total-panel,
.job-summary-panel {
  border-color: var(--line-soft);
  box-shadow: var(--shadow-subtle);
}

.detail-page-title,
.job-command-title {
  background:
    linear-gradient(135deg, rgba(164, 19, 19, 0.075), rgba(255, 255, 255, 0.92) 54%),
    #fff;
}

.page-title h1 {
  font-size: 29px;
  font-weight: 800;
}

.page-kicker,
.summary-eyebrow {
  color: var(--accent);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.top-action-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

button,
.button-primary,
.button-secondary,
.button-danger,
.button-disabled {
  border-radius: 6px;
  font-weight: 750;
  min-height: 38px;
}

.button-secondary,
.filter-form .button-secondary,
.document-preview-toolbar .button-secondary,
.job-icon-action {
  background: #fff;
  border-color: var(--line);
  color: #3f3935;
}

.button-secondary:hover,
.job-icon-action:hover {
  border-color: #e8baba;
  color: var(--accent-dark);
}

input,
select,
textarea {
  border-color: var(--line);
  border-radius: 8px;
  background: #fff;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #dca0a0;
  box-shadow: 0 0 0 3px rgba(164, 19, 19, 0.08);
  outline: none;
}

.list-filter-panel {
  background: rgba(255, 255, 255, 0.84);
}

.business-list-table {
  border-spacing: 0 6px;
}

.business-list-table td {
  padding-bottom: 13px;
  padding-top: 13px;
}

.business-list-table tbody tr:hover td,
.studio-detail-table tbody tr:hover td {
  background: #fffdfb;
}

.business-list-table tbody tr.document-row:hover td,
.studio-detail-table tbody tr.document-row:hover td {
  background: var(--document-soft);
  border-color: var(--document-border);
}

.badge,
.status-badge,
.job-meta-chip {
  border-radius: 999px;
}

.job-flow-step,
.job-linked-doc-tile,
.request-type-group,
.request-group-item,
.request-workflow-card {
  border-radius: 8px;
}

.dashboard-title {
  align-items: center;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(251, 250, 248, 0.88)),
    #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-subtle);
  padding: 18px;
}

.dashboard-title h1 {
  margin-top: 2px;
}

.dashboard-workspace {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) 320px;
}

.dashboard-main,
.dashboard-side {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.dashboard-side {
  position: sticky;
  top: 18px;
}

.dashboard-hero {
  align-items: center;
  background:
    radial-gradient(circle at 88% 10%, rgba(164, 19, 19, 0.13), transparent 34%),
    linear-gradient(135deg, #fff, #fbf7f4);
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 260px;
  min-height: 172px;
}

.dashboard-hero h2 {
  font-size: 26px;
  margin: 3px 0 8px;
}

.dashboard-hero p {
  color: var(--muted);
  margin: 0;
  max-width: 700px;
}

.dashboard-hero-card {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  padding: 16px;
}

.dashboard-hero-card span,
.dashboard-metric-card span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-hero-card strong {
  font-size: 28px;
  line-height: 1;
}

.dashboard-hero-card small,
.dashboard-metric-card small {
  color: var(--muted);
}

.dashboard-metrics {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-metric-card {
  align-content: space-between;
  background: linear-gradient(180deg, #fff, #fbfaf8);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-subtle);
  display: grid;
  gap: 12px;
  min-height: 104px;
  padding: 14px;
}

.dashboard-metric-card strong {
  font-size: 30px;
  line-height: 1;
}

.dashboard-pipeline-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-lane {
  align-content: start;
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-height: 220px;
  padding: 12px;
}

.dashboard-lane-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.dashboard-lane-head h3 {
  margin: 0;
}

.dashboard-lane-list {
  display: grid;
  gap: 8px;
}

.dashboard-mini-card {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 5px;
  padding: 10px;
}

.dashboard-mini-card:hover {
  border-color: #e5baba;
}

.dashboard-mini-card span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-split {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.dashboard-table-section {
  margin-bottom: 0;
  overflow-x: auto;
}

.dashboard-attention-panel,
.dashboard-actions-panel {
  padding: 18px;
}

.dashboard-attention-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.dashboard-attention-item {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
}

.dashboard-attention-dot {
  background: var(--accent);
  border-radius: 50%;
  box-shadow: 0 0 0 5px var(--accent-soft);
  height: 10px;
  margin-top: 7px;
  width: 10px;
}

.dashboard-attention-item span:last-child {
  display: grid;
  gap: 2px;
}

.dashboard-attention-item small {
  color: var(--accent);
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

.dashboard-attention-item em {
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

@media (max-width: 1180px) {
  .dashboard-workspace,
  .dashboard-split {
    grid-template-columns: 1fr;
  }

  .dashboard-side {
    position: static;
  }

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

@media (max-width: 1300px) {
  .calculation-detail-workspace {
    grid-template-columns: 1fr;
  }

  .calculation-detail-side {
    position: static;
  }

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

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

  .calculation-detail-workspace.is-external-detail .calculation-detail-side {
    grid-template-columns: minmax(0, 1fr) 270px;
  }
}

@media (max-width: 760px) {
  .dashboard-hero,
  .dashboard-pipeline-grid,
  .dashboard-metrics {
    grid-template-columns: 1fr;
  }

  .external-calculation-hero {
    align-items: stretch;
    padding: 18px;
  }

  .external-calculation-hero .document-actions {
    width: 100%;
  }

  .external-calculation-hero .document-actions > * {
    flex: 1 1 160px;
  }

  .calculation-header-actions {
    justify-items: stretch;
    width: 100%;
  }

  .calculation-header-actions .document-actions {
    justify-content: stretch;
  }

  .calculation-header-actions .document-actions > * {
    flex: 1 1 150px;
  }

  .calculation-header-actions .document-actions > form > button,
  .calculation-header-actions .document-actions > a,
  .calculation-header-actions .document-actions > button {
    width: 100%;
  }

  .calculation-header-note {
    max-width: none;
    text-align: left;
  }

  .calculation-header-blocker-links {
    justify-content: flex-start;
  }

  .work-order-header-actions {
    justify-items: stretch;
    width: 100%;
  }

  .calculation-job-context {
    padding: 9px 10px;
  }

  .calculation-job-context-grid {
    display: flex;
    justify-content: flex-start;
    overflow-x: auto;
    padding: 2px 0 8px;
  }

  .calculation-job-context-card {
    flex: 0 0 148px;
    min-width: 148px;
  }

  .external-calculation-process,
  .external-calculation-financials,
  .external-calculation-spec-grid,
  .external-calculation-source-chain,
  .calculation-detail-workspace.is-external-detail .calculation-detail-side {
    grid-template-columns: 1fr;
  }

  .external-calculation-product-identity {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 761px) and (max-width: 1050px) {
  .external-calculation-hero > div:first-child {
    flex: 1 1 250px;
    min-width: 0;
  }

  .external-calculation-hero .calculation-header-actions {
    flex: 0 1 auto;
  }

  .external-calculation-hero .calculation-header-actions .document-actions {
    flex-wrap: nowrap;
  }

  .external-calculation-hero .calculation-header-actions .document-actions > * {
    white-space: nowrap;
  }

  .calculation-job-context-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .external-calculation-process,
  .external-calculation-financials,
  .external-calculation-spec-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .external-calculation-product-identity {
    grid-template-columns: minmax(130px, 0.8fr) minmax(240px, 1.6fr);
  }

  .external-calculation-product-identity > div:last-child {
    grid-column: 1 / -1;
  }

  .calculation-detail-workspace.is-external-detail .calculation-detail-side {
    grid-template-columns: 1fr;
  }
}

.dashboard-operational-title {
  align-items: end;
}

.dashboard-operational-title.motion-ready,
.dashboard-operational-inbox .motion-ready {
  opacity: 1 !important;
  transform: none !important;
  will-change: auto;
}

.dashboard-top-actions {
  max-width: 660px;
}

.dashboard-assistant {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-subtle);
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
  min-width: 0;
  padding: 14px;
}

.dashboard-assistant-head,
.dashboard-assistant-meta {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.assistant-conversation-history {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 380px;
  overflow-y: auto;
  padding: 2px 1px;
}

.assistant-conversation-message {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 12px 12px 12px 4px;
  max-width: min(82%, 860px);
  padding: 9px 12px;
}

.assistant-conversation-message.is-user {
  align-self: flex-end;
  background: var(--accent-soft);
  border-color: #ebcbc6;
  border-radius: 12px 12px 4px 12px;
}

.assistant-conversation-message.is-error {
  border-color: var(--accent);
}

.assistant-conversation-role {
  color: var(--muted);
  display: block;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  margin-bottom: 2px;
  text-transform: uppercase;
}

.assistant-conversation-message p {
  margin: 0;
  overflow-wrap: anywhere;
}

.dashboard-assistant-head h2 {
  font-size: 19px;
  margin: 2px 0 0;
}

.dashboard-assistant-badge {
  background: var(--accent-soft);
  border: 1px solid #ebcbc6;
  border-radius: 999px;
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 850;
  padding: 5px 9px;
  white-space: nowrap;
}

.dashboard-assistant-form {
  align-items: stretch;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.dashboard-assistant-form textarea {
  min-height: 58px;
  resize: vertical;
}

.dashboard-assistant-form .button-primary {
  min-width: 104px;
}

.dashboard-assistant-meta {
  color: var(--muted);
  font-size: 11px;
}

.assistant-conversation-busy {
  align-items: center;
  color: var(--accent-dark);
  display: flex;
  font-size: 12px;
  font-weight: 750;
  gap: 8px;
  margin: 0;
}

.assistant-conversation-busy[hidden],
.assistant-conversation-workbench[hidden] {
  display: none;
}

.assistant-conversation-busy::before {
  animation: assistant-pulse 0.9s ease-in-out infinite alternate;
  background: var(--accent);
  border-radius: 50%;
  content: "";
  height: 8px;
  width: 8px;
}

@keyframes assistant-pulse {
  from { opacity: 0.35; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1.15); }
}

.assistant-conversation-workbench {
  background: #fffaf8;
  border: 1px solid #e6bbb4;
  border-left: 4px solid var(--accent);
  border-radius: 10px;
  box-shadow: 0 7px 18px rgba(92, 41, 32, 0.08);
  margin-top: 4px;
  padding: 14px;
}

.assistant-conversation-workbench-head,
.assistant-working-draft-summary {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.assistant-conversation-workbench-head h3 {
  font-size: 14px;
  margin: 0 0 8px;
}

.dashboard-assistant-response {
  border-top: 1px solid #ead8d4;
  padding-top: 12px;
}

.assistant-working-draft {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  margin-bottom: 12px;
  padding: 12px;
}

.assistant-working-draft-state {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  padding: 4px 8px;
}

.assistant-working-draft-state.is-review,
.assistant-working-draft-state.is-saved {
  background: #edf7f0;
  border-color: #b8dcc1;
  color: #236436;
}

.assistant-working-draft-fields {
  display: grid;
  gap: 5px 12px;
  grid-template-columns: minmax(110px, 0.35fr) minmax(0, 1fr);
  margin: 12px 0;
}

.assistant-working-draft-fields dt {
  color: var(--muted);
  font-weight: 750;
}

.assistant-working-draft-fields dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.assistant-working-draft-warnings {
  background: #fff3d6;
  border-left: 3px solid #c88a00;
  margin: 10px 0;
  padding: 8px 10px;
}

.assistant-working-draft-warnings p {
  margin: 3px 0;
}

.assistant-working-draft-recommendation {
  background: #eef6ff;
  border-left: 3px solid #3478b8;
  margin: 10px 0;
  padding: 9px 11px;
}

.assistant-working-draft-recommendation p,
.assistant-working-draft-recommendation small {
  display: block;
  margin: 3px 0;
}

.assistant-working-draft-recommendation details {
  margin: 7px 0;
}

.assistant-working-draft-recommendation.is-accepted {
  background: #edf7f0;
  border-left-color: #3d8b55;
}

.assistant-working-draft-action {
  margin-top: 10px;
}

.assistant-operation-draft-sources {
  margin: 10px 0;
}

.assistant-operation-draft {
  border-top: 4px solid var(--accent);
}

.assistant-operation-draft-eyebrow {
  color: var(--accent-dark);
  display: block;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  margin-bottom: 2px;
  text-transform: uppercase;
}

.assistant-operation-draft-grid {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 12px -12px;
  background: var(--line-soft);
}

.assistant-operation-draft-block {
  background: var(--surface);
  border-left: 3px solid var(--line-soft);
  min-width: 0;
  padding: 11px 12px;
}

.assistant-operation-draft-block.is-known { border-left-color: #3a8b55; }
.assistant-operation-draft-block.is-missing,
.assistant-operation-draft-block.is-warning { border-left-color: #c88a00; }
.assistant-operation-draft-block.is-conflict { border-left-color: var(--accent); }
.assistant-operation-draft-block.is-source { border-left-color: #4b789e; }
.assistant-operation-draft-block.is-change { border-left-color: #7a5a99; }
.assistant-operation-draft-block.is-plan,
.assistant-operation-draft-block.is-saved { border-left-color: #27663b; }

.assistant-operation-draft-block ul {
  margin: 7px 0 0;
  padding-left: 18px;
}

.assistant-operation-draft-block li {
  margin: 3px 0;
  overflow-wrap: anywhere;
}

.assistant-operation-draft-note {
  background: var(--surface-soft);
  border-radius: 6px;
  color: var(--muted);
  margin: 10px 0 0;
  padding: 8px 10px;
}

.assistant-job-draft-card {
  --job-draft-green: #27663b;
  --job-draft-green-soft: #edf7f0;
  --job-draft-amber: #986400;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-left: 4px solid var(--job-draft-amber);
  border-radius: 8px;
  padding: 14px 16px 16px;
}

.assistant-job-draft-card.is-ready {
  border-left-color: var(--job-draft-green);
}

.assistant-job-draft-card > header {
  align-items: flex-start;
  display: flex;
  gap: 18px;
  justify-content: space-between;
}

.assistant-job-draft-card h4 {
  font-size: 18px;
  margin: 1px 0 0;
}

.assistant-job-draft-eyebrow {
  color: var(--accent-dark);
  display: block;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.assistant-job-draft-identity {
  border-top: 1px solid var(--line-soft);
  margin-top: 11px;
  padding-top: 11px;
}

.assistant-job-draft-identity strong,
.assistant-job-draft-identity p {
  display: block;
}

.assistant-job-draft-identity strong {
  font-size: 15px;
}

.assistant-job-draft-identity p {
  color: var(--muted);
  margin: 4px 0 0;
}

.assistant-job-draft-finances {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 12px 0 0;
  overflow: hidden;
}

.assistant-job-draft-finances > div {
  background: var(--surface-soft);
  padding: 9px 10px;
}

.assistant-job-draft-finances dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.assistant-job-draft-finances dd {
  font-size: 14px;
  font-weight: 800;
  margin: 3px 0 0;
}

.assistant-job-draft-question {
  background: #fff6dc;
  border-left: 3px solid var(--job-draft-amber);
  display: grid;
  gap: 3px;
  margin-top: 12px;
  padding: 9px 11px;
}

.assistant-job-draft-question span {
  color: var(--job-draft-amber);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.assistant-job-draft-warnings,
.assistant-job-draft-evidence {
  border-top: 1px solid var(--line-soft);
  margin-top: 11px;
  padding-top: 9px;
}

.assistant-job-draft-warnings summary,
.assistant-job-draft-evidence summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.assistant-job-draft-warnings ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.assistant-job-draft-warnings li {
  margin: 4px 0;
}

.assistant-job-draft-action {
  display: inline-block;
  margin-top: 12px;
}

.assistant-job-draft-evidence {
  margin-bottom: 2px;
  padding: 9px 2px 0;
}

.assistant-job-draft-evidence-body {
  border-left: 2px solid var(--line-soft);
  margin: 9px 0 0 3px;
  padding-left: 12px;
}

.assistant-review-board {
  --review-green: #27663b;
  --review-green-soft: #edf7f0;
  --review-amber: #986400;
  --review-amber-soft: #fff6dc;
  --review-blue: #315f86;
  --review-blue-soft: #eef5fa;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-top: 4px solid var(--accent);
  margin-bottom: 14px;
}

.assistant-review-board.is-ready {
  border-top-color: var(--review-green);
}

.assistant-review-board-head {
  align-items: center;
  background: #fbf8f7;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 14px 16px;
}

.assistant-review-board.is-ready .assistant-review-board-head {
  background: var(--review-green-soft);
}

.assistant-review-board-head h4 {
  font-size: 17px;
  margin: 0 0 3px;
}

.assistant-review-board-head p {
  color: var(--muted);
  margin: 0;
}

.assistant-review-meter {
  display: flex;
  flex: 0 0 auto;
}

.assistant-review-meter > div {
  align-items: baseline;
  border-left: 1px solid var(--line-soft);
  display: grid;
  min-width: 88px;
  padding: 0 12px;
}

.assistant-review-meter > div:first-child {
  border-left: 0;
}

.assistant-review-meter strong {
  color: var(--text);
  font-size: 22px;
  line-height: 1;
}

.assistant-review-meter span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.assistant-review-grid {
  display: grid;
  gap: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.assistant-review-card {
  border-right: 1px solid var(--line-soft);
  min-width: 0;
  padding: 14px 16px;
}

.assistant-review-card:last-child {
  border-right: 0;
}

.assistant-review-card h5 {
  align-items: center;
  display: flex;
  font-size: 12px;
  gap: 7px;
  letter-spacing: 0.055em;
  margin: 0 0 10px;
  text-transform: uppercase;
}

.assistant-review-card h5::before {
  background: currentColor;
  border-radius: 50%;
  content: "";
  height: 7px;
  width: 7px;
}

.assistant-review-card.is-known h5 { color: var(--review-green); }
.assistant-review-card.is-missing h5 { color: var(--review-amber); }
.assistant-review-card.is-next h5 { color: var(--accent-dark); }

.assistant-review-card ul {
  display: grid;
  gap: 9px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.assistant-review-card li {
  border-left: 2px solid var(--line-soft);
  padding-left: 9px;
}

.assistant-review-card.is-known li { border-left-color: #acd1b6; }
.assistant-review-card.is-missing li { border-left-color: #e5ba5e; }

.assistant-review-card li strong,
.assistant-review-card li p,
.assistant-review-card li small {
  display: block;
}

.assistant-review-card li p {
  margin: 2px 0;
  overflow-wrap: anywhere;
}

.assistant-review-card li small {
  color: var(--muted);
  margin-top: 2px;
}

.assistant-review-card.is-next > strong {
  display: block;
  font-size: 15px;
  line-height: 1.4;
}

.assistant-review-card.is-next .button-primary {
  margin-top: 14px;
  width: 100%;
}

.assistant-review-checks {
  background: var(--review-blue-soft);
  border-left: 3px solid var(--review-blue);
  margin-top: 14px;
  padding: 9px 10px;
}

.assistant-review-checks > span {
  color: var(--review-blue);
  display: block;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.055em;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.assistant-review-checks p {
  font-size: 12px;
  margin: 5px 0;
}

.assistant-review-financials {
  border-top: 1px solid var(--line-soft);
  padding: 11px 16px 14px;
}

.assistant-review-financials summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 800;
}

.assistant-review-financials ul {
  margin: 10px 0;
}

.assistant-review-financials p {
  margin: 5px 0;
}

.assistant-pricing-suggestion {
  background: var(--doc-calculation-soft);
  border: 1px solid var(--doc-calculation-border);
  border-left: 3px solid var(--doc-calculation);
  border-radius: 8px;
  margin: 10px 0;
  padding: 11px 12px;
}

.assistant-pricing-suggestion p,
.assistant-pricing-suggestion ul {
  margin: 7px 0;
}

.assistant-pricing-suggestion a {
  color: var(--accent-dark);
  font-weight: 750;
  text-decoration: underline;
}

.job-assistant-conversation {
  border-top: 1px solid var(--line-soft);
  padding: 12px 0;
}

.job-assistant-conversation summary {
  cursor: pointer;
  font-weight: 800;
  margin-bottom: 10px;
}

.job-assistant-conversation .assistant-conversation-history {
  margin-bottom: 12px;
  max-height: 460px;
}

.assistant-package-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1rem;
}

.assistant-package-title h1 {
  margin: .3rem 0 .35rem;
}

.assistant-package-title p {
  max-width: 52rem;
  margin: 0;
  color: var(--text-muted);
}

.assistant-package-title-actions {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: .65rem;
  flex-wrap: wrap;
}

.assistant-package-title-actions > .assistant-working-draft-state,
.assistant-package-title-actions > button {
  margin-top: .05rem;
}

.assistant-package-promote-control {
  display: grid;
  gap: .35rem;
  justify-items: stretch;
  max-width: 20rem;
}

.assistant-package-action-help {
  color: var(--text-muted);
  font-size: .72rem;
  line-height: 1.35;
  max-width: 20rem;
}

.assistant-package-action-help.is-blocked {
  color: #8a3a22;
  font-weight: 700;
}

.assistant-package-lifecycle {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--border-color);
  background: #fff;
  margin-bottom: 1rem;
}

.assistant-package-lifecycle span {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .8rem 1rem;
  color: var(--text-muted);
  border-right: 1px solid var(--border-color);
}

.assistant-package-lifecycle span:last-child { border-right: 0; }
.assistant-package-lifecycle b {
  display: grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  background: #ede9e6;
  font-size: .78rem;
}
.assistant-package-lifecycle .is-complete { color: #27613f; }
.assistant-package-lifecycle .is-complete b { color: #fff; background: #2d7a4c; }
.assistant-package-lifecycle .is-current { color: #921b19; font-weight: 700; }
.assistant-package-lifecycle .is-current b { color: #fff; background: #b41715; }

.assistant-package-notice {
  padding: .85rem 1rem;
  border-left: 4px solid #b41715;
  background: #fff8f5;
  margin-bottom: 1rem;
}

.assistant-package-workspace {
  display: grid;
  gap: 1rem;
  max-width: 1180px;
  margin: 0 auto 3rem;
}

.assistant-package-workspace.is-busy { opacity: .7; pointer-events: none; }

.assistant-package-sheet {
  background: #fff;
  border: 1px solid #ddd5cf;
  box-shadow: 0 12px 30px rgba(62, 39, 30, .06);
  padding: 1.2rem 1.3rem 1.35rem;
}

.assistant-package-sheet > header {
  display: flex;
  align-items: center;
  gap: .8rem;
  padding-bottom: .85rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid #e5dfda;
}

.assistant-package-sheet > header > span {
  color: #b41715;
  font: 800 .78rem/1 var(--font-sans);
  letter-spacing: .08em;
}

.assistant-package-sheet > header h2,
.assistant-package-sheet > header p { margin: 0; }
.assistant-package-sheet > header em {
  margin-left: auto;
  color: var(--text-muted);
  font-style: normal;
  font-size: .82rem;
}

.form-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field-span-two { grid-column: span 2; }
.assistant-package-line {
  border: 0;
  padding: 0;
  margin: 0;
}
.assistant-package-line legend {
  margin-bottom: .7rem;
  font-weight: 750;
}

.assistant-package-calculation-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: #ddd5cf;
  border: 1px solid #ddd5cf;
  margin-bottom: 1rem;
}
.assistant-package-calculation-summary > div {
  background: #f8f6f4;
  padding: .9rem 1rem;
}
.assistant-package-calculation-summary small,
.assistant-package-calculation-summary strong { display: block; }
.assistant-package-calculation-summary strong { margin-top: .25rem; font-size: 1.15rem; }
.assistant-package-warnings {
  margin: 1rem 0 0;
  padding: .8rem 1rem .8rem 2rem;
  background: #fff8e8;
  color: #76520c;
}

@media (max-width: 800px) {
  .assistant-package-title { align-items: stretch; flex-direction: column; }
  .assistant-package-title-actions { justify-content: flex-start; }
  .assistant-package-lifecycle { grid-template-columns: 1fr; }
  .assistant-package-lifecycle span { border-right: 0; border-bottom: 1px solid var(--border-color); }
  .form-grid-three, .assistant-package-calculation-summary { grid-template-columns: 1fr; }
  .assistant-job-draft-finances { grid-template-columns: 1fr; }
  .field-span-two { grid-column: auto; }
}

.job-hip-ai-open { align-self: center; }
.job-assistant-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1090;
  background: rgba(35, 25, 21, .38);
  backdrop-filter: blur(2px);
}
.job-assistant-drawer {
  position: fixed;
  z-index: 1100;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(720px, 94vw);
  overflow: auto;
  background: #f6f2ef;
  box-shadow: -22px 0 60px rgba(45, 29, 24, .2);
  padding: 1rem;
}
.job-assistant-drawer[hidden], .job-assistant-backdrop[hidden] { display: none; }
.job-assistant-drawer .dashboard-assistant {
  min-height: calc(100vh - 2rem);
  margin: 0;
  border-radius: 0;
}
.job-assistant-drawer .assistant-conversation-history { max-height: 38vh; }
.job-assistant-drawer-actions { display: flex; gap: .5rem; align-items: center; }
body.has-job-assistant-open { overflow: hidden; }

@media (max-width: 700px) {
  .job-assistant-drawer { width: 100vw; padding: .5rem; }
  .job-assistant-drawer-actions { align-items: stretch; flex-direction: column; }
}

.dashboard-assistant-status {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}

.dashboard-assistant-status.is-error {
  color: var(--accent-dark);
}

.dashboard-assistant-answer {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.dashboard-assistant-draft:not([hidden]) {
  background: var(--surface, #fff);
  border: 1px solid var(--line-soft);
  border-left: 3px solid var(--accent-dark);
  border-radius: 8px;
  margin-top: 10px;
  padding: 10px 12px;
  overflow-wrap: anywhere;
}

.dashboard-assistant-draft p {
  margin: 5px 0 0;
}

.dashboard-assistant-draft a {
  display: block;
  margin-top: 5px;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
}

.dashboard-assistant-approval {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
}

.dashboard-assistant-approval label {
  align-items: flex-start;
  display: flex;
  gap: 7px;
  font-size: 12px;
}

.dashboard-assistant-approval .button-primary {
  justify-self: start;
  max-width: 100%;
  white-space: normal;
}

.dashboard-assistant-evidence:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 10px;
}

.dashboard-assistant-evidence a {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
}

.dashboard-assistant-mail-list:not([hidden]),
.dashboard-assistant-mail-message:not([hidden]) {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  overflow-wrap: anywhere;
}

.dashboard-assistant-mail-list button {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  padding: 8px 10px;
  text-align: left;
}

.dashboard-assistant-mail-list button:hover,
.dashboard-assistant-mail-list button:focus-visible {
  border-color: var(--accent-dark);
}

.dashboard-assistant-mail-message p { margin: 0; color: var(--muted); }
.dashboard-assistant-mail-message pre {
  font: inherit;
  margin: 0;
  max-height: 300px;
  overflow: auto;
  white-space: pre-wrap;
}
.dashboard-assistant-mail-message blockquote {
  border-left: 3px solid var(--accent-dark);
  margin: 2px 0;
  padding: 4px 10px;
  white-space: pre-wrap;
}

.dashboard-assistant.is-busy {
  opacity: 0.82;
}

.dashboard-period-bar {
  align-items: end;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: var(--shadow-subtle);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(260px, 1fr) 130px 130px auto;
  margin-bottom: 14px;
  padding: 12px 14px;
}

.dashboard-period-bar label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  min-width: 0;
}

.dashboard-period-bar input,
.dashboard-period-bar select {
  min-height: 38px;
}

.dashboard-operational-metrics {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  margin-bottom: 14px;
}

.dashboard-operational-metric {
  min-height: 100px;
}

.dashboard-operational-metric.is-alert {
  background: linear-gradient(180deg, #fff, #fae7e7);
  border-color: #efcdca;
}

.dashboard-operational-metric.is-work {
  background: linear-gradient(180deg, #fff, #e7eff6);
  border-color: #cbdceb;
}

.dashboard-operational-metric strong {
  font-size: 25px;
}

.dashboard-operational-inbox {
  grid-template-columns: minmax(0, 1fr) 380px;
}

.dashboard-inbox-panel,
.dashboard-pulse-panel,
.dashboard-quick-panel {
  margin-bottom: 0;
}

.dashboard-filter-tabs {
  background: var(--surface-strong);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: flex;
  flex-wrap: nowrap;
  gap: 2px;
  max-width: 100%;
  overflow-x: auto;
  padding: 3px;
}

.dashboard-filter-tab {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: var(--muted);
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  min-height: 30px;
  padding: 5px 10px;
  white-space: nowrap;
}

.dashboard-filter-tab.is-active {
  background: #fff;
  box-shadow: 0 1px 5px rgba(32, 29, 27, 0.12);
  color: var(--accent-dark);
}

.dashboard-inbox-list,
.dashboard-invoice-list {
  display: grid;
  gap: 8px;
}

.dashboard-inbox-row {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 30px minmax(0, 1.35fr) minmax(130px, 0.38fr) 112px;
  min-height: 78px;
  padding: 10px;
}

.dashboard-inbox-row:hover,
.dashboard-invoice-row:hover {
  background: #fffdfb;
  border-color: #e6cbc5;
}

.dashboard-inbox-row[hidden] {
  display: none;
}

.dashboard-priority {
  align-items: center;
  border-radius: 7px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  height: 30px;
  justify-content: center;
  width: 30px;
}

.dashboard-priority.is-high {
  background: #fae7e7;
  color: #b01212;
}

.dashboard-priority.is-medium {
  background: #f7eedb;
  color: #8a5a13;
}

.dashboard-priority.is-normal {
  background: var(--surface-strong);
  color: var(--muted);
}

.dashboard-row-title {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.dashboard-row-primary-link {
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-row-primary-link:hover {
  color: var(--accent);
}

.dashboard-row-meta {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 12px;
  min-width: 0;
}

.dashboard-chip {
  align-items: center;
  background: var(--surface-strong);
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  color: var(--muted);
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  min-height: 24px;
  padding: 4px 8px;
  white-space: nowrap;
}

.dashboard-chip.is-money {
  background: var(--accent-soft);
  border-color: #ebcbc6;
  color: var(--accent-dark);
}

.dashboard-chip.is-work {
  background: #e7eff6;
  border-color: #cbdceb;
  color: #315f86;
}

.dashboard-chip.is-production {
  background: #e7f2ee;
  border-color: #bdd9cf;
  color: #1d6f58;
}

.dashboard-row-amount,
.dashboard-invoice-money {
  display: grid;
  gap: 2px;
  justify-items: end;
  text-align: right;
  white-space: nowrap;
}

.dashboard-row-amount small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.dashboard-empty-note {
  background: var(--surface-soft);
  border: 1px dashed var(--line-soft);
  border-radius: 8px;
  color: var(--muted);
  margin: 0;
  padding: 12px;
}

.dashboard-pulse-grid,
.dashboard-quick-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-pulse-card {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 5px;
  min-height: 74px;
  padding: 10px;
}

.dashboard-pulse-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.dashboard-pulse-card strong {
  font-size: 18px;
}

.dashboard-quick-grid .button-primary,
.dashboard-quick-grid .button-secondary {
  justify-content: center;
  min-height: 42px;
}

.dashboard-invoices-panel,
.dashboard-work-summary-panel,
.dashboard-timer-panel {
  padding: 16px;
}

.dashboard-invoice-row {
  align-items: center;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 10px;
}

.dashboard-invoice-row span:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.dashboard-invoice-row small {
  color: var(--muted);
}

.dashboard-invoice-money em {
  background: var(--surface-strong);
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  padding: 4px 8px;
}

.dashboard-summary-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.dashboard-summary-list div {
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.dashboard-summary-list dt,
.dashboard-summary-list dd {
  margin: 0;
}

.dashboard-summary-list dt {
  color: var(--muted);
  font-weight: 800;
}

.dashboard-summary-list dd {
  font-weight: 850;
  text-align: right;
}

.dashboard-timer-head {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.dashboard-timer-head strong {
  color: var(--accent-dark);
  font-size: 24px;
}

.dashboard-timer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 12px;
}

@media (max-width: 1240px) {
  .dashboard-operational-inbox {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 920px) {
  .dashboard-operational-title {
    align-items: stretch;
  }

  .dashboard-operational-title > div,
  .dashboard-top-actions {
    max-width: none;
    min-width: 0;
    width: 100%;
  }

  .dashboard-period-bar,
  .dashboard-inbox-row {
    grid-template-columns: 1fr;
  }

  .dashboard-top-actions,
  .dashboard-quick-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-top-actions .button-primary,
  .dashboard-top-actions .button-secondary,
  .dashboard-quick-grid .button-primary,
  .dashboard-quick-grid .button-secondary {
    min-width: 0;
    white-space: normal;
  }

  .dashboard-row-amount {
    justify-items: start;
    text-align: left;
  }

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

@media (max-width: 760px) {
  .dashboard-assistant-form {
    grid-template-columns: 1fr;
  }

  .dashboard-assistant-head,
  .dashboard-assistant-meta,
  .assistant-conversation-workbench-head,
  .assistant-working-draft-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .assistant-working-draft-fields {
    grid-template-columns: 1fr;
  }

  .assistant-operation-draft-grid {
    grid-template-columns: 1fr;
  }

  .assistant-review-board-head {
    align-items: flex-start;
    flex-direction: column;
  }

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

  .assistant-review-card {
    border-bottom: 1px solid var(--line-soft);
    border-right: 0;
  }

  .assistant-review-card:last-child {
    border-bottom: 0;
  }

  .dashboard-assistant-form .button-primary {
    width: 100%;
  }

  .assistant-conversation-message {
    max-width: 94%;
  }

  .dashboard-operational-metrics,
  .dashboard-pulse-grid,
  .dashboard-quick-grid,
  .dashboard-top-actions,
  .dashboard-timer-head {
    grid-template-columns: 1fr;
  }

  .dashboard-inbox-panel {
    min-width: 0;
    overflow: hidden;
  }

  .dashboard-inbox-panel .section-header {
    align-items: stretch;
    display: grid;
    grid-template-columns: 1fr;
  }

  .dashboard-filter-tabs {
    min-width: 0;
    width: 100%;
  }

  .dashboard-inbox-list,
  .dashboard-inbox-row,
  .dashboard-row-title,
  .dashboard-row-primary-link,
  .dashboard-row-meta,
  .dashboard-row-amount {
    min-width: 0;
    width: 100%;
  }
}

/* Job command center: approved flow/documents mockup direction. */
.job-command-flow {
  display: grid;
  gap: 18px;
  grid-template-columns: 1fr;
  margin-bottom: 18px;
  padding: 18px;
}

.job-flow-header {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.job-flow-header h2 {
  margin: 2px 0 0;
}

.job-flow-progress-pill {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  color: var(--accent-dark);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 850;
  min-height: 28px;
  padding: 0 12px;
  white-space: nowrap;
}

.job-flow-track {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  padding-top: 24px;
  position: relative;
}

.job-flow-line {
  background: #dfd7d0;
  height: 3px;
  left: 7%;
  position: absolute;
  right: 7%;
  top: 42px;
  z-index: 0;
}

.job-flow-line-done {
  background: linear-gradient(90deg, #1f9d6b, var(--accent), #2d6297);
  display: block;
  height: 100%;
}

.job-flow-step {
  background: transparent;
  border: 0;
  color: var(--text);
  display: grid;
  gap: 11px;
  min-height: 0;
  padding: 0;
  position: relative;
  text-decoration: none;
  z-index: 1;
}

.job-flow-step::before {
  display: none;
}

.job-flow-step-kicker {
  align-items: center;
  align-self: center;
  background: #e6e0da;
  border: 4px solid #f6f3ef;
  border-radius: 50%;
  box-shadow: 0 10px 28px rgba(47, 35, 28, 0.08);
  color: #665d57;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  height: 34px;
  justify-content: center;
  justify-self: center;
  line-height: 1;
  width: 34px;
}

.job-flow-step-card {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-height: 86px;
  padding: 13px;
}

.job-flow-step-card strong {
  font-size: 14px;
  line-height: 1.15;
}

.job-flow-step-card small,
.job-flow-step-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.2;
}

.job-flow-step-card em {
  align-self: end;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.job-flow-step.is-done .job-flow-step-kicker {
  background: #1f9d6b;
  box-shadow: 0 12px 30px rgba(31, 157, 107, 0.24);
  color: #fff;
}

.job-flow-step.is-done .job-flow-step-card {
  border-color: rgba(31, 157, 107, 0.26);
}

.job-flow-step.is-done .job-flow-step-card em,
.doc-status {
  color: #1f8a5e;
}

.job-flow-step.is-current .job-flow-step-kicker {
  background: var(--accent);
  box-shadow: 0 14px 34px rgba(164, 19, 19, 0.26);
  color: #fff;
}

.job-flow-step.is-current .job-flow-step-card {
  border-color: rgba(164, 19, 19, 0.26);
  box-shadow: 0 12px 30px rgba(164, 19, 19, 0.08);
}

.job-flow-step.is-current .job-flow-step-card em {
  color: var(--accent);
}

.job-flow-step.is-pending .job-flow-step-card {
  color: #665d57;
}

.job-flow-step.is-pending .job-flow-step-card em {
  color: #8a817b;
}

.job-flow-step.is-skipped .job-flow-step-kicker {
  background: #d8d2cc;
  color: #665d57;
}

.job-flow-step.is-skipped .job-flow-step-card {
  background: #f7f5f2;
  border-color: #d8d2cc;
  color: #665d57;
}

.job-flow-step.is-skipped .job-flow-step-card em {
  color: #7a716b;
}

.job-flow-step.is-disabled {
  cursor: not-allowed;
  opacity: 0.5;
  pointer-events: none;
}

.job-flow-step.is-disabled .job-flow-step-card {
  background: #f3f0ed;
  border-color: #ddd5ce;
}

.job-flow-step.is-disabled .job-flow-step-card em {
  color: #8a817b;
}

.job-client-highlight {
  color: var(--text);
  font-size: 18px;
  font-weight: 900;
}

.job-next-step-panel {
  align-content: start;
}

.job-next-step-card {
  align-items: center;
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 94px;
  padding: 16px;
}

.job-next-step-card strong {
  display: block;
  font-size: 18px;
  margin-bottom: 4px;
}

.job-next-step-card p {
  color: var(--muted);
  margin: 0;
}

.job-flow-progress-pill.is-complete {
  background: #edf8f2;
  border-color: #b9dfca;
  color: #17633e;
}

.job-calculation-coverage-list {
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  overflow: hidden;
}

.job-calculation-coverage-row {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid var(--line-soft);
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 14px 16px;
}

.job-calculation-coverage-row:last-child {
  border-bottom: 0;
}

.job-calculation-coverage-row.is-covered {
  box-shadow: inset 4px 0 0 #2f8f62;
}

.job-calculation-coverage-row.is-missing {
  background: #fffaf8;
  box-shadow: inset 4px 0 0 var(--accent);
}

.job-calculation-coverage-copy > span {
  color: var(--muted);
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.job-calculation-coverage-copy h3 {
  font-size: 16px;
  margin: 2px 0 0;
}

.job-calculation-coverage-copy p {
  color: var(--accent-dark);
  margin: 6px 0 0;
}

.job-calculation-coverage-links {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

.job-calculation-coverage-links a {
  color: var(--accent-dark);
  font-weight: 800;
}

.job-calculation-coverage-action .button-primary,
.job-calculation-coverage-action .button-secondary {
  margin: 0;
  white-space: nowrap;
}

.job-request-summary-item {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr);
}

.job-request-summary-item .request-group-copy {
  max-width: 100%;
}

.job-request-summary-item .request-group-details {
  background: #fffdfb;
  border-left: 1px solid var(--line-soft);
  padding-left: 18px;
}

.finishing-quantity-panel {
  align-items: end;
  background: #f8fafc;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(260px, 1fr) minmax(210px, 0.55fr) minmax(230px, 0.65fr);
  padding: 12px 14px;
}

.finishing-quantity-panel > div,
.finishing-quantity-panel > label {
  display: grid;
  gap: 5px;
}

.finishing-quantity-panel p {
  color: var(--muted);
  margin: 0;
}

.finishing-die-tool-panel {
  background: #fffaf7;
  border: 1px solid rgba(164, 19, 19, 0.2);
  border-radius: 10px;
  display: grid;
  gap: 14px;
  margin: 2px 14px 14px;
  padding: 16px;
}

.finishing-die-mode-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.finishing-die-mode-option {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  gap: 9px;
  min-height: 44px;
  padding: 10px 12px;
}

.finishing-die-mode-option:has(input:checked) {
  background: #fff1ef;
  border-color: var(--accent);
  color: var(--accent-dark);
  font-weight: 800;
}

.finishing-die-mode-option input {
  margin: 0;
  width: auto;
}

.finishing-die-fields,
.finishing-die-charge-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.finishing-die-fields label,
.finishing-die-charge-grid label {
  display: grid;
  gap: 6px;
}

.finishing-die-charge-grid {
  border-top: 1px solid var(--line-soft);
  grid-template-columns: minmax(230px, 1fr) minmax(180px, 0.7fr) minmax(260px, 1.3fr);
  padding-top: 14px;
}

.finishing-die-cost-note {
  color: var(--accent-dark);
  margin: 0;
  text-align: right;
}

[hidden].finishing-die-tool-panel,
[hidden].finishing-die-fields,
[hidden].finishing-die-charge-grid,
[hidden][data-finishing-die-charge-field] {
  display: none;
}

.calculation-context-cell strong,
.calculation-context-cell small,
.calculation-usage-cell small,
.calculation-updated-time {
  display: block;
}

.calculation-context-cell small,
.calculation-usage-cell small,
.calculation-updated-time {
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
}

.calculation-usage-cell {
  min-width: 130px;
}

.calculation-usage-link,
.calculation-document-usage a {
  border: 1px solid var(--line);
  color: var(--text);
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  margin: 0 4px 4px 0;
  padding: 3px 6px;
  text-decoration: none;
}

.calculation-usage-link.is-offer,
.calculation-document-usage a.is-offer {
  border-color: #dfb8b2;
  color: var(--accent-dark);
}

.calculation-usage-link.is-work-order,
.calculation-document-usage a.is-work-order {
  border-color: #b9d7c1;
  color: #28743a;
}

.calculation-status-line {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.calculation-status-line small {
  color: var(--muted);
}

.calculation-document-usage {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}

.inline-notice {
  background: var(--surface);
  border: 1px solid var(--line);
  margin: 0 0 12px;
  padding: 10px 12px;
}

.inline-notice--warning {
  background: #fff8e6;
  border-color: #e7ca7d;
  color: #6b4e07;
}

.inline-notice--info {
  background: #eef5fb;
  border-color: #b9d3e8;
  color: #234f70;
}

.inline-notice-item {
  font-weight: 700;
}

.job-offer-action-choice {
  display: grid;
  gap: 5px;
}

.job-offer-action-choice small {
  color: var(--muted);
  line-height: 1.35;
}

.job-offer-row-checkbox {
  justify-content: center;
  min-height: 20px;
}

.job-offer-select-all {
  color: var(--accent-dark) !important;
  font-size: 11px;
  font-weight: 850 !important;
  justify-content: center;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.job-hours-panel {
  min-width: 0;
  overflow: hidden;
  scroll-margin-top: 72px;
}

.job-hours-header {
  align-items: flex-start;
}

.job-hours-header h2 {
  margin: 2px 0 4px;
}

.job-hours-header .section-hint {
  margin: 0;
  max-width: 720px;
}

.job-hours-header-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.job-hours-profile-menu {
  position: relative;
}

.job-hours-profile-menu > summary {
  cursor: pointer;
  list-style: none;
}

.job-hours-profile-menu > summary::-webkit-details-marker {
  display: none;
}

.job-hours-profile-popover {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: 0 18px 44px rgba(47, 35, 28, 0.18);
  display: grid;
  gap: 4px;
  min-width: 260px;
  padding: 8px;
  margin-top: 7px;
  position: static;
  z-index: 20;
}

.job-hours-profile-popover > strong {
  color: var(--muted);
  font-size: 11px;
  padding: 5px 7px 7px;
  text-transform: uppercase;
}

.job-hours-profile-popover a {
  border-radius: 6px;
  color: var(--text);
  display: grid;
  gap: 2px;
  padding: 8px;
  text-decoration: none;
}

.job-hours-profile-popover a:hover,
.job-hours-profile-popover a:focus-visible {
  background: var(--accent-soft);
  outline: 0;
}

.job-hours-profile-popover small {
  color: var(--muted);
}

.job-work-sections {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.job-work-request-groups {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.job-work-request-group {
  background: #faf7f4;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  overflow: hidden;
}

.job-work-request-header {
  align-items: center;
  background: #fffdfb;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 24px;
  justify-content: space-between;
  padding: 13px 16px;
}

.job-work-request-header h3 {
  font-size: 18px;
  margin: 2px 0 0;
}

.job-work-request-metrics {
  display: flex;
  gap: 22px;
}

.job-work-request-metrics span {
  color: var(--muted);
  display: grid;
  font-size: 11px;
  gap: 1px;
  white-space: nowrap;
}

.job-work-request-metrics strong {
  color: var(--ink);
  font-size: 15px;
}

.job-work-request-group > .job-work-sections {
  margin: 0;
  padding: 10px;
}

.job-work-section-card {
  align-items: center;
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  min-height: 76px;
  padding: 12px 14px 12px 12px;
}

.job-work-section-card-with-hours {
  display: block;
  overflow: hidden;
  padding: 0;
}

.job-work-section-overview {
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  min-height: 76px;
  padding: 12px 14px 12px 12px;
}

.job-work-section-main {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.job-work-section-mark {
  align-self: stretch;
  background: var(--accent);
  border-radius: 999px;
  flex: 0 0 4px;
  min-height: 44px;
  position: relative;
}

.job-work-section-mark::after {
  background: #fff;
  border: 2px solid var(--accent);
  border-radius: 50%;
  content: "";
  height: 8px;
  left: 50%;
  position: absolute;
  top: 15px;
  transform: translateX(-50%);
  width: 8px;
}

.job-work-section-main h3 {
  font-size: 16px;
  margin: 2px 0;
}

.job-work-section-main p {
  color: var(--muted);
  margin: 0;
}

.job-work-section-context {
  color: var(--accent-dark);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.job-work-section-metrics {
  display: flex;
  gap: 18px;
}

.job-work-section-metrics span {
  color: var(--muted);
  display: grid;
  font-size: 11px;
  gap: 1px;
  white-space: nowrap;
}

.job-work-section-metrics strong {
  color: var(--ink);
  font-size: 15px;
}

.job-work-section-actions {
  display: grid;
  gap: 4px;
  min-width: 132px;
}

.job-work-section-actions form {
  display: flex;
  justify-content: center;
  margin: 0;
}

.job-work-section-remove {
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 11px;
  font-weight: 750;
  padding: 4px 8px;
}

.job-work-section-remove:hover,
.job-work-section-remove:focus-visible {
  background: var(--accent-soft);
  outline: 0;
}

.job-work-entry-table-wrap {
  border-top: 1px solid var(--line-soft);
  overflow-x: auto;
}

.job-work-entry-table {
  min-width: 680px;
  width: 100%;
}

.job-work-entry-table th,
.job-work-entry-table td {
  padding-left: 14px;
  padding-right: 14px;
}

.job-work-entry-table tbody tr:last-child td {
  border-bottom: 0;
}

.job-work-entry-description {
  color: var(--ink);
  font-weight: 700;
}

.job-work-entry-table td small {
  color: var(--muted);
  display: block;
  margin-top: 2px;
}

.job-work-section-empty {
  border-top: 1px solid var(--line-soft);
  color: var(--muted);
  margin: 0;
  padding: 12px 14px;
}

.job-work-ungrouped {
  background: #fff8f5;
  border: 1px solid #e3c5ba;
  border-radius: 8px;
  margin-top: 14px;
  overflow: hidden;
}

.job-work-ungrouped > header {
  align-items: center;
  display: flex;
  gap: 20px;
  justify-content: space-between;
  padding: 12px 14px;
}

.job-work-ungrouped h3,
.job-work-ungrouped p {
  margin: 0;
}

.job-work-ungrouped p {
  color: var(--muted);
  font-size: 12px;
  max-width: 620px;
}

.job-work-sections-empty {
  background: #fff8f5;
  border: 1px dashed #e3c5ba;
  border-radius: 8px;
  margin-top: 14px;
  padding: 14px 16px;
}

.job-work-sections-empty p {
  color: var(--muted);
  margin: 4px 0 0;
}

.job-hours-summary {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 14px 0;
}

.job-hours-summary > div {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
}

.job-hours-summary > div + div {
  border-left: 1px solid var(--line-soft);
}

.job-hours-summary span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.job-hours-summary strong {
  color: var(--ink);
  font-size: 17px;
}

.job-hours-table-wrap {
  overflow-x: auto;
}

.job-hours-table,
.job-hours-candidate-table {
  min-width: 760px;
  width: 100%;
}

.job-hours-table td,
.job-hours-candidate-table td {
  vertical-align: middle;
}

.job-hours-table td small,
.job-hours-candidate-table td small {
  color: var(--muted);
  display: block;
  margin-top: 2px;
}

.job-hours-row-action {
  text-align: right;
  white-space: nowrap;
}

.job-hours-row-action form {
  margin: 0;
}

.job-hours-row-action .button-ghost {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--muted);
  font-size: 12px;
  padding: 5px 7px;
}

.job-hours-row-action .button-ghost:hover,
.job-hours-row-action .button-ghost:focus-visible {
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.job-hours-status {
  background: #f1efec;
  border-radius: 999px;
  color: #665d57;
  display: inline-flex;
  font-size: 11px;
  font-weight: 850;
  min-height: 24px;
  padding: 5px 9px;
  white-space: nowrap;
}

.job-hours-status.is-open {
  background: #fff1ea;
  color: #9a3b1d;
}

.job-hours-status.is-offered {
  background: #edf4fb;
  color: #2d6297;
}

.job-hours-status.is-invoiced,
.job-hours-status.is-invoiced_manual {
  background: #edf8f1;
  color: #1f7a54;
}

.job-hours-empty {
  background: #f8f6f3;
  border: 1px dashed #d8d0c9;
  border-radius: 8px;
  padding: 18px;
}

.job-hours-empty p {
  color: var(--muted);
  margin: 5px 0 0;
}

.job-hours-empty .table-link {
  display: inline-flex;
  margin-top: 9px;
}

.job-hours-dialog {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  box-shadow: 0 28px 80px rgba(31, 24, 20, 0.3);
  max-height: min(820px, calc(100vh - 40px));
  max-width: calc(100vw - 40px);
  padding: 0;
  width: min(960px, calc(100vw - 40px));
}

.job-hours-dialog::backdrop {
  background: rgba(31, 24, 20, 0.48);
}

.job-hours-dialog[open] {
  display: block;
}

.job-hours-dialog form {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  margin: 0;
  max-height: min(820px, calc(100vh - 40px));
}

.job-hours-dialog-header {
  align-items: flex-start;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 18px 20px;
}

.job-hours-dialog-header h2 {
  margin: 2px 0 4px;
}

.job-hours-dialog-header p:last-child {
  color: var(--muted);
  margin: 0;
}

.job-hours-dialog-summary {
  align-items: center;
  background: #fff8f5;
  border-bottom: 1px solid #f0d8cf;
  color: var(--accent-dark);
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 10px 20px;
}

.job-hours-dialog-summary span {
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.job-hours-target-section {
  background: #faf8f6;
  border-bottom: 1px solid var(--line-soft);
  display: grid;
  gap: 4px;
  grid-template-columns: minmax(260px, 420px) 1fr;
  padding: 12px 20px;
}

.job-hours-target-section label,
.job-work-section-form > label,
.job-work-section-field {
  display: grid;
  font-size: 12px;
  font-weight: 850;
  gap: 5px;
}

.job-hours-target-section p {
  align-self: end;
  color: var(--muted);
  margin: 0 0 9px;
}

.job-work-section-dialog {
  width: min(720px, calc(100vw - 40px));
}

.job-work-section-dialog form {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.job-work-section-form {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: auto;
  padding: 18px 20px 22px;
}

.job-work-section-form label small,
.job-work-section-field > small {
  color: var(--muted);
  font-weight: 500;
}

.job-work-section-name-field {
  grid-column: 1 / -1;
}

.job-work-section-name-options button {
  display: grid;
  gap: 1px;
}

.job-work-section-name-options button[hidden] {
  display: none;
}

.job-work-section-name-options button strong {
  font-size: 13px;
}

.job-hours-dialog-body {
  overflow: auto;
  padding: 0 20px;
}

.job-hours-check {
  text-align: center;
  width: 44px;
}

.job-hours-check input {
  accent-color: var(--accent);
  height: 17px;
  width: 17px;
}

.job-hours-dialog-footer {
  align-items: center;
  border-top: 1px solid var(--line-soft);
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 14px 20px;
}

.job-hours-dialog-footer > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.job-hours-dialog-footer > div {
  display: flex;
  gap: 8px;
}

.job-documents-section {
  overflow-x: auto;
}

.commercial-decision-center {
  min-width: 0;
  overflow: hidden;
  scroll-margin-top: 72px;
}

.commercial-decision-header {
  align-items: flex-start;
  gap: 24px;
}

.commercial-decision-header h2 {
  margin: 2px 0 4px;
}

.commercial-decision-header .section-hint {
  margin: 0;
  max-width: 760px;
}

.commercial-decision-flow {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 0;
  padding-top: 3px;
}

.commercial-decision-step {
  align-items: center;
  background: #f5f2ef;
  border: 1px solid var(--line-soft);
  color: var(--muted);
  display: inline-flex;
  font-size: 11px;
  font-weight: 850;
  gap: 6px;
  min-height: 32px;
  padding: 5px 10px;
  position: relative;
}

.commercial-decision-step + .commercial-decision-step {
  border-left: 0;
}

.commercial-decision-step:first-child {
  border-radius: 8px 0 0 8px;
}

.commercial-decision-step:last-child {
  border-radius: 0 8px 8px 0;
}

.commercial-decision-step b {
  align-items: center;
  background: #ded8d2;
  border-radius: 50%;
  display: inline-flex;
  height: 19px;
  justify-content: center;
  width: 19px;
}

.commercial-decision-step small {
  background: #fff;
  border-radius: 999px;
  font-size: 10px;
  padding: 2px 6px;
}

.commercial-decision-step.has-data {
  background: var(--accent-soft);
  border-color: #e2c9c5;
  color: var(--accent-dark);
}

.commercial-decision-step.has-data b {
  background: var(--accent);
  color: #fff;
}

.commercial-decision-step.is-offer.has-data {
  background: var(--doc-offer-soft);
  border-color: var(--doc-offer-border);
  color: var(--doc-offer-dark);
}

.commercial-decision-step.is-offer.has-data b {
  background: var(--doc-offer);
}

.commercial-decision-stage {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  margin-top: 16px;
  min-width: 0;
  overflow: hidden;
}

.commercial-decision-stage-header {
  align-items: center;
  background: #faf8f5;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 12px 14px;
}

.commercial-decision-stage-header > div {
  display: grid;
  gap: 3px;
}

.commercial-decision-stage-header h3 {
  font-size: 17px;
  margin: 0;
}

.commercial-decision-stage-header > div > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.commercial-decision-stage-header > small {
  color: var(--muted);
  max-width: 460px;
  text-align: right;
}

.supplier-source-stage {
  border-left: 4px solid #8b8178;
}

.calculation-comparison {
  border-left: 4px solid var(--doc-calculation);
}

.customer-offers-stage {
  border-left: 4px solid var(--doc-offer);
}

.commercial-table-wrap {
  overflow-x: auto;
}

.supplier-source-table {
  min-width: 1080px;
  width: 100%;
}

.supplier-source-table td,
.customer-offer-table td {
  vertical-align: top;
}

.supplier-source-table td > strong,
.supplier-source-table td > small,
.customer-offer-table td > strong,
.customer-offer-table td > small {
  display: block;
}

.supplier-source-table td > small,
.customer-offer-table td > small {
  color: var(--muted);
  font-size: 11px;
  margin-top: 3px;
}

.supplier-source-table .number,
.customer-offer-table .number {
  text-align: right;
}

.supplier-source-table tr.is-expired td {
  background: #fffafa;
}

.commercial-source-link,
.commercial-offer-link,
.calculation-source-link {
  color: var(--accent-dark);
  display: block;
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 4px;
  text-decoration: none;
  text-transform: uppercase;
}

.commercial-source-link:hover,
.commercial-source-link:focus-visible,
.commercial-offer-link:hover,
.commercial-offer-link:focus-visible,
.calculation-source-link:hover,
.calculation-source-link:focus-visible {
  text-decoration: underline;
}

.calculation-source-link {
  margin: 7px 0 0;
}

.calculation-source-link.is-expired,
.commercial-expired-label {
  color: #a42121 !important;
}

.commercial-row-action {
  min-height: 31px;
  padding: 6px 9px;
  white-space: nowrap;
}

.calculation-selection-note {
  font-size: 11px;
  min-height: 32px;
  min-width: 180px;
  padding: 6px 8px;
  width: 100%;
}

.calculation-selection-note-saved {
  background: #eef8f0;
  border-left: 3px solid #72af80;
  color: #315c3a !important;
  max-width: 220px;
  padding: 5px 7px;
}

.customer-offers-stage .commercial-decision-stage-header {
  background: var(--doc-offer-soft);
}

.customer-offers-stage .commercial-decision-stage-header > div > span {
  color: var(--doc-offer-dark);
}

.customer-offer-groups {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.customer-offer-group {
  border: 1px solid var(--doc-offer-border);
  border-radius: 8px;
  overflow: hidden;
}

.customer-offer-group > header {
  align-items: center;
  background: #f8fbff;
  border-bottom: 1px solid var(--doc-offer-border);
  display: flex;
  justify-content: space-between;
  padding: 9px 12px;
}

.customer-offer-group > header > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.customer-offer-group > header > span.is-accepted {
  color: #27703a;
}

.customer-offer-table {
  min-width: 900px;
  width: 100%;
}

.customer-offer-table tr.is-accepted td {
  background: #f4fbf6;
}

.commercial-offer-link {
  color: var(--doc-offer-dark);
}

.is-positive-change {
  color: #7a5600;
}

.is-negative-change {
  color: #27703a;
}

.job-documents-unified {
  width: 100%;
}

.job-documents-unified th:first-child,
.job-documents-unified td:first-child {
  width: 190px;
}

.job-documents-unified th:nth-child(5),
.job-documents-unified th:nth-child(6) {
  text-align: right;
}

.calculation-comparison {
  min-width: 0;
  scroll-margin-top: 72px;
}

.calculation-comparison-header {
  align-items: flex-start;
}

.calculation-comparison-header h2 {
  margin: 2px 0 4px;
}

.calculation-comparison-header .section-hint {
  margin: 0;
  max-width: 790px;
}

.calculation-comparison-groups {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.calculation-comparison-group {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  min-width: 0;
  overflow: hidden;
}

.calculation-comparison-group-header {
  align-items: center;
  background: #faf7f3;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 12px 14px;
}

.calculation-comparison-group-header > div {
  display: grid;
  gap: 3px;
}

.calculation-comparison-group-header h3 {
  font-size: 17px;
  margin: 0;
}

.calculation-comparison-group-header > div > span {
  color: var(--accent-dark);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.calculation-comparison-signal {
  border: 1px solid;
  border-radius: 999px;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 850;
  padding: 5px 9px;
}

.calculation-comparison-signal.is-comparable {
  background: #edf8f0;
  border-color: #bddfc5;
  color: #27703a;
}

.calculation-comparison-signal.is-warning {
  background: #fff7df;
  border-color: #ead28c;
  color: #76560a;
}

.calculation-comparison-table-wrap {
  overflow-x: auto;
}

.calculation-comparison-table {
  min-width: 980px;
  width: 100%;
}

.calculation-comparison-table th:nth-child(n + 3):nth-child(-n + 7),
.calculation-comparison-table td:nth-child(n + 3):nth-child(-n + 7) {
  text-align: right;
}

.calculation-comparison-table th:first-child {
  min-width: 180px;
}

.calculation-comparison-table th:nth-child(2) {
  min-width: 145px;
}

.calculation-comparison-table th:last-child {
  min-width: 145px;
}

.calculation-comparison-row td {
  background: #fff;
  vertical-align: top;
}

.calculation-comparison-row.is-confirmed td {
  background: #f4fbf6;
}

.calculation-comparison-row.is-confirmed td:first-child {
  box-shadow: inset 4px 0 0 #2e8a48;
}

.calculation-comparison-row td > strong,
.calculation-comparison-row td > small,
.calculation-comparison-variant > a,
.calculation-reliability-label {
  display: block;
}

.calculation-comparison-row td > small,
.calculation-comparison-variant > small {
  color: var(--muted);
  font-size: 11px;
  margin-top: 3px;
}

.calculation-comparison-variant > a {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 4px;
  text-decoration: none;
  text-transform: uppercase;
}

.calculation-comparison-variant > a:hover,
.calculation-comparison-variant > a:focus-visible {
  text-decoration: underline;
}

.calculation-reliability-label {
  font-size: 10px;
  font-weight: 850;
  margin-top: 7px;
}

.calculation-reliability-label.is-success {
  color: #27703a;
}

.calculation-reliability-label.is-warning {
  color: #80600e;
}

.calculation-reliability-label.is-danger,
.calculation-comparison-table .is-negative {
  color: #a42121;
}

.calculation-comparison-table .is-positive {
  color: #27703a;
}

.calculation-comparison-decision {
  display: grid;
  gap: 7px;
  justify-items: start;
}

.calculation-comparison-decision form {
  margin: 0;
}

.calculation-comparison-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.calculation-comparison-highlights small {
  background: #f0e7e4;
  border-radius: 999px;
  color: var(--accent-dark);
  font-size: 9px;
  font-weight: 900;
  padding: 3px 6px;
  text-transform: uppercase;
}

.calculation-comparison-action {
  min-height: 30px;
  padding: 5px 9px;
}

.calculation-comparison-confirmed-note {
  color: #27703a !important;
  font-weight: 850;
}

.job-document-flow-row td {
  vertical-align: middle;
}

.job-money-stack {
  display: grid;
  gap: 3px;
  justify-items: end;
  min-width: 96px;
}

.job-money-main {
  color: var(--ink);
  font-weight: 850;
}

.job-money-sub {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.job-doc-type {
  align-items: center;
  display: inline-flex;
  gap: 9px;
  font-weight: 850;
}

.job-doc-type span {
  background: var(--document-accent, var(--accent));
  border-radius: 50%;
  box-shadow: 0 0 0 4px var(--document-soft, var(--accent-soft));
  height: 10px;
  width: 10px;
}

.doc-status {
  background: #edf8f1;
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  min-height: 24px;
  padding: 5px 9px;
  text-transform: lowercase;
}

.job-documents-unified .job-document-actions {
  justify-content: flex-end;
}

.job-summary-panel {
  align-content: start;
}

.job-summary-panel .summary-list {
  gap: 10px 12px;
}

.job-summary-panel .summary-list dd {
  font-weight: 800;
  text-align: right;
}

.job-summary-value {
  background: linear-gradient(135deg, #fff, #fff7f7);
  border: 1px solid #efd0d0;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  margin-top: 4px;
  padding: 14px;
}

.job-summary-value span {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.job-summary-value strong {
  color: var(--accent-dark);
  font-size: 22px;
}

.job-summary-value .job-summary-value-main {
  color: var(--accent-dark);
  font-size: 22px;
  line-height: 1.1;
}

.job-summary-value .job-summary-value-sub {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: none;
}

.job-summary-financial-breakdown {
  border-top: 1px solid #efd0d0;
  display: grid;
  gap: 8px;
  margin-top: 7px;
  padding-top: 10px;
}

.job-summary-financial-breakdown > span {
  align-items: baseline;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.job-summary-financial-breakdown small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.job-summary-financial-breakdown strong {
  color: var(--text);
  font-size: 12px;
  text-align: right;
}

.job-summary-financial-breakdown .is-profit strong {
  color: #236345;
}

.job-client-history-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.job-client-history-card {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.job-client-history-card strong {
  font-size: 16px;
}

.job-history-meta {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 8px;
  justify-content: space-between;
}

.job-history-meta b {
  color: var(--accent-dark);
}

.motion-ready {
  will-change: opacity, transform;
}

.is-motion-hovered {
  transform: translateY(-2px);
}

@media (max-width: 1180px) {
  .job-flow-track {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .job-flow-line {
    display: none;
  }

  .job-client-history-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .commercial-decision-header,
  .commercial-decision-stage-header,
  .customer-offer-group > header {
    align-items: stretch;
    flex-direction: column;
  }

  .commercial-decision-flow {
    align-items: stretch;
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .commercial-decision-step,
  .commercial-decision-step:first-child,
  .commercial-decision-step:last-child {
    border: 1px solid var(--line-soft);
    border-radius: 0;
    justify-content: flex-start;
  }

  .commercial-decision-step:first-child {
    border-radius: 8px 8px 0 0;
  }

  .commercial-decision-step:last-child {
    border-radius: 0 0 8px 8px;
  }

  .commercial-decision-step + .commercial-decision-step {
    border-top: 0;
  }

  .commercial-decision-stage-header > small {
    text-align: left;
  }

  .customer-offer-groups,
  .calculation-comparison-groups {
    padding: 10px;
  }

  .calculation-comparison-header,
  .calculation-comparison-group-header {
    align-items: stretch;
    flex-direction: column;
  }

  .calculation-comparison-signal {
    align-self: flex-start;
  }

  .job-hours-header,
  .job-hours-dialog-header,
  .job-hours-dialog-footer,
  .job-hours-dialog-summary {
    align-items: stretch;
    flex-direction: column;
  }

  .job-hours-header-actions,
  .job-hours-dialog-footer > div {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .job-hours-header-actions > *,
  .job-hours-header-actions .button-primary,
  .job-hours-header-actions .button-secondary,
  .job-hours-dialog-footer button {
    width: 100%;
  }

  .job-hours-profile-popover {
    min-width: 0;
  }

  .job-work-section-card {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .job-work-request-header,
  .job-work-ungrouped > header {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }

  .job-work-request-metrics {
    border-top: 1px solid var(--line-soft);
    justify-content: space-between;
    padding-top: 10px;
  }

  .job-work-section-overview {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .job-work-section-metrics {
    border-top: 1px solid var(--line-soft);
    justify-content: space-between;
    padding-top: 10px;
  }

  .job-work-section-actions,
  .job-work-section-actions > .button-secondary {
    width: 100%;
  }

  .job-work-entry-table-wrap {
    overflow: visible;
  }

  .job-work-entry-table {
    min-width: 0;
  }

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

  .job-work-entry-table,
  .job-work-entry-table tbody,
  .job-work-entry-table tr,
  .job-work-entry-table td {
    display: block;
  }

  .job-work-entry-table tr {
    display: grid;
    gap: 10px 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 12px 14px;
  }

  .job-work-entry-table tr + tr {
    border-top: 1px solid var(--line-soft);
  }

  .job-work-entry-table td {
    border: 0;
    display: grid;
    gap: 3px;
    padding: 0;
    text-align: left;
    white-space: normal;
  }

  .job-work-entry-table td::before {
    color: var(--muted);
    content: attr(data-label);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .job-work-entry-table .job-hours-row-action {
    grid-column: 1 / -1;
  }

  .job-work-entry-table .job-hours-row-action:empty {
    display: none;
  }

  .job-work-entry-table .job-hours-row-action form,
  .job-work-entry-table .job-hours-row-action button {
    width: 100%;
  }

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

  .job-hours-summary > div:nth-child(3) {
    border-left: 0;
    border-top: 1px solid var(--line-soft);
  }

  .job-hours-summary > div:nth-child(4) {
    border-top: 1px solid var(--line-soft);
  }

  .job-hours-dialog {
    max-height: calc(100vh - 16px);
    max-width: calc(100vw - 16px);
    width: calc(100vw - 16px);
  }

  .job-hours-dialog form {
    max-height: calc(100vh - 16px);
  }

  .job-hours-dialog-body {
    padding: 0 12px;
  }

  .job-hours-target-section,
  .job-work-section-form {
    grid-template-columns: 1fr;
    padding-left: 14px;
    padding-right: 14px;
  }

  .job-hours-target-section p {
    margin-bottom: 0;
  }

  .job-work-section-name-field {
    grid-column: auto;
  }

  .job-flow-header,
  .job-next-step-card {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .job-flow-track {
    grid-template-columns: 1fr;
    padding-top: 0;
  }

  .job-flow-step {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .job-flow-step-kicker {
    margin-top: 8px;
  }

  .job-request-summary-item {
    grid-template-columns: 1fr;
  }

  .job-request-summary-item .request-group-details {
    border-left: 0;
    border-top: 1px solid var(--line-soft);
    padding-left: 0;
    padding-top: 12px;
  }
}

/* Work order command view. */
.work-order-command-title {
  align-items: center;
  justify-content: space-between;
}

.work-order-workspace {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 320px;
  margin-top: 20px;
  padding-bottom: 88px;
}

.request-material-help-row {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-top: 5px;
}

.request-material-help-row .request-field-help {
  margin: 0;
}

.request-material-quick-action,
.calculation-material-quick-action,
.material-step-heading-actions .button-link {
  background: transparent;
  border: 0;
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 850;
  padding: 2px 0;
  text-align: left;
}

.calculation-material-quick-action {
  display: inline-flex;
  margin-top: 6px;
}

.material-step-heading-actions {
  align-items: center;
  display: flex !important;
  flex: 0 0 auto;
  gap: 12px !important;
  margin-left: auto;
}

.material-step-heading-actions a {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.material-quick-inline-status {
  color: #18794e;
  display: block;
  font-weight: 750;
  margin-top: 5px;
}

.material-quick-dialog {
  max-height: min(900px, calc(100vh - 32px));
  max-width: min(920px, calc(100vw - 32px));
}

.material-quick-dialog > form {
  display: flex;
  flex-direction: column;
  max-height: min(900px, calc(100vh - 32px));
}

.material-quick-dialog-body {
  display: grid;
  gap: 16px;
  overflow-y: auto;
}

.material-quick-section {
  border: 1px solid var(--line);
  display: grid;
  gap: 14px;
  padding: 14px;
}

.material-quick-section[hidden],
.material-quick-create-candidate[hidden] {
  display: none;
}

.combobox-list button[data-material-status] {
  align-items: center;
  display: grid;
  gap: 3px 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.combobox-list button[data-material-status="ready"] .combobox-option-label {
  font-weight: 850;
}

.material-quick-create-candidate {
  background: #fff8e8;
  border-left: 4px solid #bf8500;
  display: grid;
  gap: 10px;
  padding: 11px 13px;
}

.material-quick-create-candidate p {
  margin: 0;
}

.material-quick-section-heading {
  align-items: start;
  display: grid;
  gap: 10px;
  grid-template-columns: 28px minmax(0, 1fr);
}

.material-quick-section-heading > span {
  align-items: center;
  background: #fff0ef;
  border-radius: 999px;
  color: var(--accent-dark);
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.material-quick-section-heading h3,
.material-quick-section-heading p {
  margin: 0;
}

.material-quick-section-heading p {
  color: var(--muted);
  font-size: 13px;
  margin-top: 3px;
}

.material-quick-existing {
  background: #fff8e8;
  border-left: 4px solid #bf8500;
  display: grid;
  gap: 3px;
  padding: 11px 13px;
}

.material-quick-existing[hidden] {
  display: none;
}

.material-quick-existing span,
.material-quick-existing small {
  color: var(--muted);
}

.material-quick-dialog-error {
  background: #fff0ee;
  border: 1px solid #e6b5ae;
  color: var(--accent-dark);
  margin: 0;
  padding: 10px 12px;
}

.material-quick-dialog-spacer {
  flex: 1 1 auto;
}

@media (max-width: 720px) {
  .request-material-help-row,
  .material-step-heading-actions,
  .material-quick-dialog-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .request-material-help-row {
    gap: 6px;
  }

  .material-step-heading-actions {
    margin-left: 40px;
    width: calc(100% - 40px);
  }

  .material-quick-dialog-footer > a,
  .material-quick-dialog-footer > button {
    width: 100%;
  }
}

.work-order-main {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.work-order-side {
  display: grid;
  gap: 12px;
  position: sticky;
  top: 18px;
}

.work-order-flow {
  display: grid;
  gap: 18px;
  padding: 18px;
}

.work-order-flow-track {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding-top: 24px;
  position: relative;
}

.work-order-flow-line {
  background: #dfd7d0;
  height: 3px;
  left: 10%;
  position: absolute;
  right: 10%;
  top: 42px;
  z-index: 0;
}

.work-order-flow-step {
  align-items: center;
  color: var(--muted);
  display: grid;
  gap: 8px;
  justify-items: center;
  position: relative;
  z-index: 1;
}

.work-order-flow-step span {
  align-items: center;
  background: #e6e0da;
  border: 4px solid #f6f3ef;
  border-radius: 50%;
  color: #665d57;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  height: 36px;
  justify-content: center;
  width: 36px;
}

.work-order-flow-step strong {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: block;
  font-size: 13px;
  padding: 10px 12px;
  text-align: center;
  width: 100%;
}

.work-order-flow-step.is-done span {
  background: #1f9d6b;
  box-shadow: 0 12px 30px rgba(31, 157, 107, 0.2);
  color: #fff;
}

.work-order-flow-step.is-done strong {
  border-color: rgba(31, 157, 107, 0.26);
  color: #1f8a5e;
}

.work-order-flow-step.is-current span {
  background: var(--accent);
  box-shadow: 0 14px 34px rgba(164, 19, 19, 0.24);
  color: #fff;
}

.work-order-flow-step.is-current strong {
  border-color: rgba(164, 19, 19, 0.28);
  color: var(--accent-dark);
}

.work-order-overview-grid {
  grid-template-columns: minmax(320px, 0.95fr) minmax(320px, 1.05fr);
}

.work-order-metric-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.work-order-metric-grid div {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  min-height: 76px;
  padding: 12px;
}

.work-order-metric-grid span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.work-order-metric-grid strong {
  color: var(--accent-dark);
  font-size: 24px;
}

.work-order-inline-editor {
  border-left: 4px solid var(--accent);
  scroll-margin-top: 96px;
}

.work-order-live-edit-badge {
  background: #edf8f1;
  border: 1px solid rgba(31, 157, 107, 0.25);
  border-radius: 999px;
  color: #176f4b;
  font-size: 12px;
  font-weight: 900;
  padding: 7px 11px;
}

.work-order-detail-edit-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.work-order-detail-edit-grid label,
.work-order-card-edit-grid label,
.work-order-line-edit-grid label,
.work-order-note-editor label,
.work-order-actual-quantity-field,
.work-order-executor-field {
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
}

.work-order-inline-editor input,
.work-order-inline-editor select,
.work-order-inline-editor textarea {
  font-weight: 400;
}

.work-order-detail-edit-grid small {
  color: var(--muted);
  font-weight: 500;
}

.work-order-note-field {
  background: #fff8ef;
  border: 1px solid #eed3b5;
  border-radius: 9px;
  grid-column: span 2;
  grid-row: span 2;
  padding: 12px;
}

.work-order-note-field textarea {
  min-height: 126px;
}

.work-order-items-section {
  display: grid;
  gap: 14px;
}

.work-order-item-card {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.work-order-item-header {
  align-items: start;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.work-order-item-header h3 {
  font-size: 21px;
  margin: 2px 0 8px;
}

.work-order-card-editor {
  background: #fbfaf8;
  border: 1px solid var(--line-soft);
  border-left: 4px solid #3a5f8a;
  border-radius: 9px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.work-order-card-editor-heading {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.work-order-card-editor-heading h4,
.work-order-card-editor-heading p {
  margin: 0;
}

.work-order-card-editor-heading p {
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
}

.work-order-calculation-source {
  background: #eef4fb;
  border: 1px solid #c9d8e9;
  border-radius: 999px;
  color: #284e78;
  font-size: 12px;
  font-weight: 850;
  padding: 7px 10px;
  text-decoration: none;
}

.work-order-calculation-source:hover,
.work-order-calculation-source:focus-visible {
  border-color: #284e78;
  color: #173a61;
}

.work-order-card-edit-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.work-order-card-description-field {
  grid-column: span 2;
}

.work-order-source-guidance {
  color: #50657d;
  font-size: 12px;
  margin: 0;
}

.work-order-source-pill,
.work-order-item-status span {
  background: #fff7f7;
  border: 1px solid #efd0d0;
  border-radius: 999px;
  color: var(--accent-dark);
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  min-height: 26px;
  padding: 5px 10px;
}

.work-order-item-status span {
  background: #edf8f1;
  border-color: rgba(31, 157, 107, 0.22);
  color: #1f8a5e;
}

.work-order-spec-strip {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.work-order-spec-strip div {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 5px;
  min-height: 70px;
  padding: 10px;
}

.work-order-spec-strip span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.work-order-spec-strip strong {
  color: var(--text);
  font-size: 14px;
  overflow-wrap: anywhere;
}

.work-order-item-description {
  color: var(--muted);
  margin: 0;
}

.work-order-production-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.work-order-production-block {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.work-order-production-block h4 {
  color: var(--accent-dark);
  font-size: 13px;
  margin: 0;
  text-transform: uppercase;
}

.work-order-line-list {
  display: grid;
  gap: 8px;
}

.work-order-line {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 3px;
  padding-top: 8px;
}

.work-order-line:first-child {
  border-top: 0;
  padding-top: 0;
}

.work-order-line span,
.work-order-line em {
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.work-order-line-edit-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 8px;
}

.work-order-line-edit-grid input,
.work-order-actual-quantity-field input,
.work-order-executor-field input {
  min-width: 0;
}

.work-order-actual-quantity-field,
.work-order-executor-field {
  background: #f5faf7;
  border: 1px solid #cfe4d8;
  border-radius: 7px;
  margin-top: 8px;
  padding: 9px;
}

.work-order-manual-addition {
  border-top: 1px dashed var(--line);
  margin-top: 4px;
  padding-top: 9px;
}

.work-order-manual-addition summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
}

.work-order-note-editor {
  display: grid;
  gap: 10px;
}

.work-order-note-editor label {
  background: #fff8ef;
  border: 1px solid #eed3b5;
  border-radius: 8px;
  padding: 10px;
}

.work-order-note-editor textarea {
  min-height: 86px;
}

.work-order-cutting-plan {
  border-top: 1px solid var(--line-soft);
  padding-top: 8px;
}

.work-order-cutting-plan summary {
  cursor: pointer;
  display: grid;
  gap: 3px;
  list-style-position: inside;
}

.work-order-cutting-plan summary span {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.work-order-cutting-plan summary strong {
  font-size: 13px;
}

.work-order-cutting-plan-body {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(130px, 0.75fr) minmax(0, 2fr);
  padding-top: 12px;
}

.work-order-cutting-diagram {
  align-self: start;
  background: #f8fbff;
  border: 1px solid #b8cdfb;
  padding: 8px;
}

.work-order-cutting-diagram svg {
  display: block;
  height: auto;
  max-height: 230px;
  width: 100%;
}

.work-order-cutting-diagram rect {
  fill: #f5f8ff;
  stroke: #263348;
  stroke-width: 1.2;
}

.work-order-cutting-diagram line {
  stroke: #b01717;
  stroke-dasharray: 2 1.5;
  stroke-width: 0.8;
}

.work-order-cutting-diagram text {
  fill: #8f1010;
  font-size: 5px;
  font-weight: 900;
}

.work-order-cutting-instructions {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  gap: 7px;
}

.work-order-cutting-instructions ol,
.work-order-cutting-instructions p {
  margin: 0;
}

.work-order-cutting-instructions ol {
  display: grid;
  gap: 5px;
  padding-left: 20px;
}

.work-order-print-cutting-plan {
  border: 1px solid #b7b7b7;
  margin-top: 8px;
  padding: 8px;
}

.work-order-print-cutting-heading {
  display: flex;
  font-size: 9pt;
  justify-content: space-between;
  margin-bottom: 6px;
}

.work-order-print-cutting-body {
  display: grid;
  font-size: 7.5pt;
  gap: 8px;
  grid-template-columns: 28mm minmax(0, 1fr);
}

.work-order-print-cutting-body svg {
  height: auto;
  width: 28mm;
}

.work-order-print-cutting-body rect {
  fill: #f7f9fd;
  stroke: #263348;
  stroke-width: 1.2;
}

.work-order-print-cutting-body line {
  stroke: #b01717;
  stroke-dasharray: 2 1.5;
  stroke-width: 0.8;
}

.work-order-print-cutting-body text {
  fill: #8f1010;
  font-size: 5px;
  font-weight: 900;
}

.work-order-print-cutting-body ol,
.work-order-print-cutting-body p {
  margin: 0 0 3px;
}

.work-order-print-cutting-body ol {
  padding-left: 16px;
}

.work-order-edit-form {
  display: grid;
  gap: 18px;
}

.work-order-edit-card {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.work-order-card-status {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  min-width: 180px;
  text-transform: uppercase;
}

.work-order-edit-fields {
  display: grid;
  gap: 10px;
  grid-template-columns: 1.4fr 1.6fr repeat(4, minmax(90px, 0.8fr));
}

.work-order-edit-fields label,
.work-order-edit-block label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  text-transform: uppercase;
}

.work-order-edit-production-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.work-order-edit-block {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
}

.work-order-edit-block h4 {
  color: var(--accent-dark);
  font-size: 13px;
  margin: 0;
  text-transform: uppercase;
}

.work-order-edit-table-wrap {
  overflow-x: auto;
}

.work-order-edit-table-wrap table {
  min-width: 640px;
  width: 100%;
}

.work-order-edit-table-wrap input {
  min-width: 86px;
  width: 100%;
}

.sticky-form-actions {
  background: rgba(243, 240, 236, 0.86);
  border-top: 1px solid var(--line-soft);
  bottom: 0;
  justify-content: flex-end;
  margin-top: 0;
  padding: 12px 0 0;
  position: sticky;
  z-index: 5;
}

.offer-profile-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 16px;
}

.offer-profile-card {
  align-content: start;
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  min-height: 176px;
  padding: 16px;
}

.offer-profile-card h3 {
  font-size: 18px;
  margin: 0;
}

.offer-profile-card p {
  color: var(--muted);
  line-height: 1.45;
  margin: 0;
}

.offer-profile-card .button-primary,
.offer-profile-card .badge {
  align-self: end;
  justify-self: start;
}

.offer-profile-card.is-disabled {
  opacity: 0.64;
}

.manual-offer-table-wrap {
  overflow-x: auto;
}

.offer-form-text-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.offer-form-text-grid label {
  display: grid;
  gap: 5px;
}

.offer-form-text-grid textarea {
  min-height: 112px;
  resize: vertical;
}

.manual-offer-table {
  min-width: 1080px;
  table-layout: fixed;
  width: 100%;
}

.monthly-hours-import {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px;
}

.monthly-hours-import h3 {
  font-size: 16px;
  margin: 0;
}

.monthly-hours-import .muted {
  margin: 3px 0 0;
}

.monthly-hours-import-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
}

.monthly-hours-paste-field,
.monthly-hours-import-options {
  display: grid;
  gap: 8px;
}

.monthly-hours-paste-field textarea {
  min-height: 168px;
  resize: vertical;
}

.monthly-hours-import-options {
  align-content: start;
  grid-template-columns: 1fr;
}

.monthly-hours-column-map {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 10px;
}

.monthly-hours-column-map label:nth-child(3) {
  grid-column: 1 / -1;
}

.monthly-hours-column-map select {
  width: 100%;
}

.monthly-hours-map-control {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-top: 4px;
}

.monthly-hours-map-control .field-inline-check {
  align-items: center;
  color: var(--muted);
  cursor: help;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 5px;
  justify-content: center;
  line-height: 1;
  min-height: 40px;
  min-width: 24px;
  white-space: nowrap;
}

.monthly-hours-map-control .field-inline-check input {
  accent-color: var(--accent);
  height: 16px;
  margin: 0;
  width: 16px;
}

.monthly-hours-summary dl {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.monthly-hours-summary dl div {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  padding: 10px 12px;
}

.monthly-hours-summary dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.monthly-hours-summary dd {
  font-size: 16px;
  font-weight: 800;
  margin: 0;
}

.manual-offer-table th:nth-child(1) {
  width: 52px;
}

.manual-offer-table th:nth-child(2) {
  width: 30%;
}

.manual-offer-table th:nth-child(3),
.manual-offer-table th:nth-child(4),
.manual-offer-table th:nth-child(6),
.manual-offer-table th:nth-child(7) {
  width: 130px;
}

.manual-offer-table th:nth-child(3) {
  width: 26%;
}

.manual-offer-table th:nth-child(5) {
  width: 90px;
}

.manual-offer-table th:nth-child(8) {
  width: 72px;
}

.manual-offer-table input {
  min-width: 0;
  width: 100%;
}

.manual-offer-table .manual-offer-product-combobox,
.manual-offer-table .manual-offer-unit-combobox {
  min-width: 0;
}

.manual-offer-table .manual-offer-product-combobox .combobox-control,
.manual-offer-table .manual-offer-unit-combobox .combobox-control {
  grid-template-columns: minmax(0, 1fr) 34px;
}

.manual-offer-table .combobox-list {
  z-index: 80;
}

.manual-offer-table .combobox-list button {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
}

.manual-offer-table .combobox-list .combobox-option-meta {
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}

.manual-offer-table .manual-offer-row-number {
  color: var(--accent-dark);
  font-size: 16px;
  font-weight: 800;
  text-align: center;
  vertical-align: middle;
}

.manual-offer-table .manual-offer-remove-button {
  display: inline-flex;
  height: 36px;
  justify-content: center;
  margin-inline: auto;
  padding: 0;
  width: 36px;
}

.manual-offer-table .manual-offer-remove-button svg {
  fill: none;
  height: 17px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 17px;
}

.manual-offer-totals {
  border-top: 1px solid var(--line-soft);
  margin-top: 14px;
  padding-top: 12px;
}

.manual-offer-totals dl {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.manual-offer-totals div {
  background: #fffdfb;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: 12px;
}

.manual-offer-totals dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.manual-offer-totals dd {
  font-size: 16px;
  font-weight: 800;
  margin: 0;
}

.manual-offer-history {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
}

[data-manual-offer-items] [data-offer-row].is-active {
  background: rgba(164, 19, 19, 0.05);
  box-shadow: inset 3px 0 0 var(--brand-red);
}

.manual-offer-history h3 {
  font-size: 16px;
  margin: 0;
}

.manual-offer-history .muted {
  margin: 3px 0 0;
}

.manual-offer-history-controls {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(180px, 1fr) minmax(160px, auto);
  min-width: min(520px, 100%);
}

.manual-offer-history-sources {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  display: flex;
  grid-column: 1 / -1;
  padding: 3px;
}

.manual-offer-history-sources button {
  align-items: center;
  background: transparent;
  border: 0;
  color: var(--muted);
  display: inline-flex;
  flex: 1 1 0;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  justify-content: center;
  min-height: 32px;
  padding: 6px 10px;
}

.manual-offer-history-sources button:hover {
  background: rgba(164, 19, 19, 0.05);
  color: var(--text);
}

.manual-offer-history-sources button.is-active {
  background: var(--surface);
  box-shadow: 0 1px 3px rgba(48, 36, 31, 0.14), inset 0 -2px 0 var(--brand-red);
  color: var(--brand-red);
}

.manual-offer-history-sources span {
  background: #eee8e4;
  color: inherit;
  font-size: 10px;
  line-height: 1;
  min-width: 20px;
  padding: 4px 5px;
  text-align: center;
}

.manual-offer-history-controls [hidden] {
  display: none;
}

.manual-offer-history-status {
  background: var(--surface-soft);
  border: 1px solid var(--line-soft);
  padding: 10px 12px;
}

.manual-offer-undo {
  align-items: center;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: var(--text);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 10px 12px;
}

.manual-offer-undo[hidden] {
  display: none;
}

.manual-offer-undo span {
  font-size: 13px;
  font-weight: 700;
}

.manual-offer-history-list {
  border: 1px solid var(--line-soft);
  display: grid;
  grid-auto-rows: minmax(86px, auto);
  max-height: 260px;
  overflow-y: auto;
}

.manual-offer-history-item {
  align-items: center;
  background: var(--surface);
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  color: var(--text);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) auto;
  justify-content: stretch;
  min-height: 86px;
  overflow: visible;
  padding: 14px;
  text-align: left;
}

.manual-offer-history-item:last-child {
  border-bottom: 0;
}

.manual-offer-history-item:hover {
  background: #f7f3f0;
}

.manual-offer-history-item.is-profile-match {
  box-shadow: inset 4px 0 0 var(--accent);
}

.manual-offer-history-main {
  align-content: center;
  display: grid;
  gap: 4px;
  min-width: 0;
}

.manual-offer-history-main strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.manual-offer-history-meta {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.manual-offer-history-description {
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.manual-offer-history-figures {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(92px, auto));
  justify-items: end;
}

.manual-offer-history-figure {
  display: grid;
  gap: 2px;
  min-width: 88px;
  text-align: right;
}

.manual-offer-history-figure-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.manual-offer-history-figure-value {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
}

.manual-offer-history-figure.is-total .manual-offer-history-figure-value {
  color: var(--accent);
}

@media (max-width: 960px) {
  .accounting-candidate-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .accounting-candidate-sheet-conversion {
    grid-template-columns: 1fr;
  }

  .manual-offer-history-item {
    grid-template-columns: 1fr;
  }

  .manual-offer-history-figures {
    justify-items: start;
  }

  .manual-offer-history-figure {
    text-align: left;
  }

  .offer-form-text-grid {
    grid-template-columns: 1fr;
  }

  .monthly-hours-import-grid,
  .monthly-hours-summary dl {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .manual-offer-history > .section-header {
    align-items: stretch;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr);
  }

  .manual-offer-history-controls {
    grid-template-columns: 1fr;
    min-width: 0;
    width: 100%;
  }

  .manual-offer-history-sources {
    grid-column: 1;
  }

  .manual-offer-history-list {
    display: block;
    overflow-x: hidden;
  }

  .manual-offer-history-figures {
    gap: 6px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }

  .manual-offer-history-figure {
    min-width: 0;
  }

  .manual-offer-history-figure-value {
    overflow-wrap: anywhere;
  }
}

/* Global quick calculator */
.sidebar-calculator-button {
  grid-template-columns: 40px minmax(0, 1fr) auto;
  width: 100%;
}

.sidebar-shortcut {
  background: #eee9e2;
  border: 1px solid #dfd7ce;
  border-radius: 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  opacity: 0;
  padding: 2px 5px;
  transition: opacity 120ms ease;
  white-space: nowrap;
}

.app-sidebar:hover .sidebar-shortcut,
.sidebar-pinned .sidebar-shortcut {
  opacity: 1;
}

.app-calculator {
  animation: app-calculator-in 150ms ease-out;
  background: var(--surface);
  border: 1px solid #cfc8c0;
  border-radius: 14px;
  box-shadow: 0 26px 70px rgba(31, 29, 27, 0.24);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  max-height: calc(100vh - 32px);
  overflow: hidden;
  position: fixed;
  right: 22px;
  top: 22px;
  width: min(390px, calc(100vw - 32px));
  z-index: 90;
}

.app-calculator[hidden] {
  display: none;
}

.app-calculator.is-dragging {
  cursor: grabbing;
  opacity: 0.97;
  user-select: none;
}

.app-calculator-header {
  align-items: center;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--line-soft);
  cursor: grab;
  display: flex;
  justify-content: space-between;
  padding: 13px 14px 12px 16px;
  touch-action: none;
}

.app-calculator-header:active {
  cursor: grabbing;
}

.app-calculator-header > div:first-child {
  display: grid;
  gap: 1px;
}

.app-calculator-header span {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.app-calculator-header h2 {
  font-size: 18px;
  line-height: 1.2;
  margin: 0;
}

.app-calculator-header-actions {
  display: flex;
  gap: 4px;
}

.app-calculator-header-actions button {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 7px;
  color: var(--muted);
  display: inline-flex;
  height: 34px;
  justify-content: center;
  padding: 0;
  width: 34px;
}

.app-calculator-header-actions button:hover,
.app-calculator-header-actions button:focus-visible {
  background: #eee9e2;
  border-color: #dfd7ce;
  color: var(--accent-dark);
}

.app-calculator-header-actions svg {
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 18px;
}

.app-calculator-tabs {
  background: var(--surface-soft);
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 7px;
}

.app-calculator-tabs button {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 7px;
  color: var(--muted);
  font-weight: 800;
  min-height: 36px;
  padding: 7px 10px;
}

.app-calculator-tabs button[aria-selected="true"] {
  background: var(--surface);
  border-color: var(--line);
  box-shadow: 0 3px 9px rgba(31, 29, 27, 0.06);
  color: var(--text);
}

.app-calculator-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.app-calculator-panel {
  display: grid;
  gap: 12px;
  padding: 14px 16px 16px;
}

.app-calculator-panel[hidden] {
  display: none;
}

.app-calculator-field {
  display: grid;
  gap: 5px;
}

.app-calculator-field > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.app-calculator-field input,
.app-calculator-field select {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  min-height: 42px;
  padding: 9px 11px;
  width: 100%;
}

.app-calculator-expression-field input {
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}

.app-calculator-field input:focus,
.app-calculator-field select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
  outline: none;
}

.app-calculator-result {
  background: var(--surface-strong);
  border: 1px solid #e5dcd4;
  border-radius: 10px;
  display: grid;
  gap: 3px;
  padding: 11px 13px;
  text-align: right;
}

.app-calculator-result > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.app-calculator-result > strong {
  font-size: 25px;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.app-calculator-keypad {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.app-calculator-keypad button {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
  min-height: 39px;
  padding: 6px;
}

.app-calculator-keypad button:hover,
.app-calculator-keypad button:focus-visible {
  background: #f7f3f0;
  border-color: #bcb4aa;
}

.app-calculator-keypad .is-utility {
  background: #f4f1ed;
  color: var(--muted);
}

.app-calculator-keypad .is-operator {
  background: var(--accent-soft);
  border-color: #e6c5c0;
  color: var(--accent-dark);
}

.app-calculator-keypad .is-equals {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  grid-column: 1 / -1;
}

.app-calculator-keypad .is-equals:hover,
.app-calculator-keypad .is-equals:focus-visible {
  background: var(--accent-dark);
  border-color: var(--accent-dark);
}

.app-calculator-history {
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 7px;
  padding-top: 10px;
}

.app-calculator-history > div {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.app-calculator-history > div strong {
  font-size: 12px;
}

.app-calculator-history > div button {
  background: transparent;
  border: 0;
  color: var(--muted);
  font-size: 11px;
  padding: 2px;
  text-decoration: underline;
}

.app-calculator-history ol {
  display: grid;
  gap: 3px;
  list-style: none;
  margin: 0;
  max-height: 94px;
  overflow-y: auto;
  padding: 0;
}

.app-calculator-history li.is-empty {
  color: var(--muted);
  font-size: 12px;
  padding: 4px 0;
}

.app-calculator-history li button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: var(--text);
  display: flex;
  font-size: 12px;
  justify-content: space-between;
  padding: 5px 6px;
  text-align: left;
  width: 100%;
}

.app-calculator-history li button:hover,
.app-calculator-history li button:focus-visible {
  background: #f7f3f0;
}

.app-calculator-history li span {
  color: var(--muted);
  max-width: 68%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-calculator-financial-fields {
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.app-calculator-paper-fields {
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.app-calculator-paper-fields[hidden],
.app-calculator-financial-fields .app-calculator-field[hidden] {
  display: none;
}

.app-calculator-formula {
  background: #f7f3f0;
  border-left: 3px solid var(--accent);
  color: #554e48;
  font-size: 12px;
  margin: 0;
  padding: 8px 10px;
}

.app-calculator-rate-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.app-calculator-rate-shortcuts[hidden] {
  display: none;
}

.app-calculator-rate-shortcuts button {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  padding: 4px 9px;
}

.app-calculator-rate-shortcuts button:hover,
.app-calculator-rate-shortcuts button:focus-visible {
  background: var(--accent-soft);
  border-color: #e6c5c0;
  color: var(--accent-dark);
}

.app-calculator-financial-result dl {
  border-top: 1px solid #e5dcd4;
  display: grid;
  gap: 5px 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: 8px 0 0;
  padding-top: 8px;
}

.app-calculator-financial-result dt,
.app-calculator-financial-result dd {
  font-size: 12px;
  margin: 0;
}

.app-calculator-financial-result dt {
  color: var(--muted);
  text-align: left;
}

.app-calculator-financial-result dd {
  font-weight: 800;
}

.app-calculator-footer {
  background: var(--surface-soft);
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 7px;
  padding: 11px 16px 12px;
}

.app-calculator-footer > div {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.app-calculator-footer button {
  min-height: 36px;
  padding: 7px 9px;
}

.app-calculator-footer p {
  color: var(--muted);
  font-size: 11px;
  margin: 0;
  min-height: 16px;
}

.app-calculator-footer p[data-state="success"] {
  color: #17643b;
}

.app-calculator-footer p[data-state="error"] {
  color: #9a1d1d;
}

@keyframes app-calculator-in {
  from {
    opacity: 0;
    transform: translateY(6px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 760px) {
  .sidebar-calculator-button {
    grid-template-columns: 40px;
    min-width: 40px;
    padding-right: 0;
    width: 40px;
  }

  .sidebar-shortcut {
    display: none;
  }

  .app-calculator {
    border-radius: 14px 14px 0 0;
    bottom: 0 !important;
    left: 0 !important;
    max-height: calc(100vh - 68px);
    right: 0 !important;
    top: auto !important;
    width: 100%;
  }

  .app-calculator-header,
  .app-calculator-header:active {
    cursor: default;
  }

  .app-calculator-header-actions [data-calculator-reset-position] {
    display: none;
  }
}

@media (min-width: 761px) and (max-height: 860px) {
  .app-sidebar {
    align-content: start;
    grid-template-rows: auto auto auto;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }

  .sidebar-user {
    gap: 6px;
  }
}

@media (max-width: 430px) {
  .app-calculator-financial-fields,
  .app-calculator-paper-fields,
  .app-calculator-footer > div {
    grid-template-columns: 1fr;
  }

  .app-calculator-result > strong {
    font-size: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-calculator {
    animation: none;
  }
}

@media (max-width: 1180px) {
  .offer-profile-grid {
    grid-template-columns: 1fr;
  }

  .work-order-workspace,
  .work-order-overview-grid {
    grid-template-columns: 1fr;
  }

  .work-order-side {
    position: static;
  }

  .work-order-spec-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

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

  .work-order-card-edit-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .work-order-edit-fields,
  .work-order-edit-production-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .accounting-candidate-header,
  .accounting-candidate-reviewed {
    align-items: stretch;
    flex-direction: column;
  }

  .accounting-candidate-metrics {
    grid-template-columns: 1fr;
  }

  .work-order-flow-track,
  .work-order-production-grid,
  .work-order-spec-strip,
  .work-order-metric-grid,
  .work-order-detail-edit-grid,
  .work-order-card-edit-grid,
  .work-order-line-edit-grid {
    grid-template-columns: 1fr;
  }

  .work-order-flow-line {
    display: none;
  }

  .work-order-item-header {
    flex-direction: column;
  }

  .work-order-card-editor-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .work-order-card-description-field,
  .work-order-note-field {
    grid-column: auto;
  }
}

.work-billing-filter {
  display: grid;
  gap: 12px;
}

.work-billing-title-actions {
  align-items: center;
  flex-wrap: wrap;
}

.work-billing-title-actions form {
  display: inline-flex;
}

.work-billing-more-menu {
  position: relative;
}

.work-billing-more-menu summary {
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  list-style: none;
}

.work-billing-more-menu summary::-webkit-details-marker {
  display: none;
}

.work-billing-more-menu summary::after {
  content: "▾";
  font-size: 11px;
  margin-left: 7px;
}

.work-billing-more-popover {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow-strong);
  min-width: 260px;
  padding: 6px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 30;
}

.work-billing-more-popover button {
  align-items: flex-start;
  background: transparent;
  border: 0;
  color: var(--text);
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 10px 12px;
  text-align: left;
  width: 100%;
}

.work-billing-more-popover button:not(:disabled):hover,
.work-billing-more-popover button:not(:disabled):focus-visible {
  background: var(--surface-soft);
}

.work-billing-more-popover small {
  color: var(--muted);
  font-weight: 500;
}

.work-billing-back-link {
  color: var(--accent-dark);
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  margin-bottom: 12px;
  text-decoration: none;
}

.work-billing-back-link:hover,
.work-billing-back-link:focus-visible {
  text-decoration: underline;
}

.work-billing-context-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(260px, 1fr) 110px 120px minmax(155px, 190px) auto auto;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.work-billing-overview-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: 140px 140px auto auto;
  max-width: 620px;
}

.work-billing-overview-metrics {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  margin-bottom: 18px;
}

.work-billing-overview-table {
  min-width: 1180px;
}

.work-billing-overview-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.work-billing-overview-chips .job-meta-chip {
  font-size: 11px;
  padding: 3px 7px;
}

.work-billing-overview-status.is-open {
  background: #fff0f0;
  border-color: #e6b3b3;
  color: var(--accent-dark);
}

.work-billing-overview-status.is-offered {
  background: #f4eee5;
  border-color: #ded1bf;
  color: #7a5622;
}

.work-billing-overview-status.is-invoiced {
  background: #edf6ed;
  border-color: #b9d7b9;
  color: #286b2a;
}

.work-billing-context-form label,
.work-billing-context-form label:first-child {
  flex: initial;
  min-width: 0;
}

.work-billing-profile-strip {
  border-top: 1px solid var(--line-soft);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 100%;
  min-width: 0;
  padding-top: 12px;
}

.work-billing-profile-strip .job-meta-chip {
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}

.work-billing-workspace {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 320px;
  min-width: 0;
}

.work-billing-main {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.work-billing-side {
  display: grid;
  gap: 18px;
  min-width: 0;
  position: sticky;
  top: 18px;
}

.work-billing-main > *,
.work-billing-side > * {
  max-width: 100%;
  min-width: 0;
}

.work-billing-metrics {
  grid-template-columns: repeat(6, minmax(136px, 1fr));
  max-width: 100%;
  min-width: 0;
}

.work-billing-metrics .dashboard-metric-card {
  min-width: 0;
}

.work-billing-selection-card {
  background: linear-gradient(180deg, #fff9f7, #fff);
  border-color: rgba(164, 19, 19, 0.28);
  box-shadow: inset 4px 0 0 var(--accent), var(--shadow-soft);
}

.work-billing-selection-card strong {
  color: var(--accent);
}

.work-billing-selection-card.is-empty {
  background: linear-gradient(180deg, #fff, #fbfaf8);
  border-color: var(--line-soft);
  box-shadow: var(--shadow-soft);
}

.work-billing-selection-card.is-empty strong {
  color: var(--muted);
}

.work-billing-metric-list {
  display: grid;
  gap: 5px;
}

.work-billing-metric-list span {
  align-items: baseline;
  color: var(--muted);
  display: flex;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  justify-content: space-between;
}

.work-billing-metric-list b {
  color: var(--text);
}

.work-billing-tabs {
  display: grid;
  gap: 14px;
}

.work-billing-tab-list {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 8px;
}

.work-billing-tab {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  min-height: 38px;
  padding: 8px 12px;
}

.work-billing-tab:hover,
.work-billing-tab:focus-visible {
  border-color: var(--accent);
  color: var(--accent-dark);
}

.work-billing-tab.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.work-billing-tab-panel {
  display: grid;
  gap: 18px;
}

.work-billing-tab-panel[hidden] {
  display: none !important;
}

.work-billing-annual-panel {
  display: grid;
  gap: 14px;
}

.work-billing-annual-metrics {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
}

.work-billing-retainer-billing {
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  display: grid;
  gap: 12px;
  padding: 16px;
}

.work-billing-retainer-billing .work-billing-annual-table-wrap {
  overflow-x: auto;
}

.work-billing-retainer-billing .work-billing-annual-table {
  min-width: 1120px;
}

.work-billing-retainer-billing-totals {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.work-billing-retainer-billing-totals > div {
  background: #f5f7f8;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 3px;
  padding: 10px 12px;
}

.work-billing-retainer-billing-totals span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.work-billing-retainer-billing-totals strong {
  font-size: 17px;
}

.work-billing-retainer-billing-totals .is-next-invoice {
  background: #fff8ec;
  border-color: #e8c889;
  box-shadow: inset 4px 0 0 #bf7b16;
}

.work-billing-month-adjustment {
  border-left: 3px solid currentColor;
  border-radius: 4px;
  display: block;
  font-size: 10px;
  font-weight: 800;
  margin-top: 4px;
  padding: 3px 5px;
  text-align: left;
  white-space: normal;
}

.work-billing-month-adjustment.is-addition-1,
.work-billing-coverage-chip.is-addition-1 { background: #edf6ff; color: #2f6f9f; }
.work-billing-month-adjustment.is-addition-2,
.work-billing-coverage-chip.is-addition-2 { background: #f2efff; color: #6657a8; }
.work-billing-month-adjustment.is-addition-3,
.work-billing-coverage-chip.is-addition-3 { background: #fff5e6; color: #9a641c; }
.work-billing-month-adjustment.is-addition-4,
.work-billing-coverage-chip.is-addition-4 { background: #eaf8f2; color: #24745a; }
.work-billing-month-adjustment.is-addition-5,
.work-billing-coverage-chip.is-addition-5 { background: #fff0f5; color: #a34567; }
.work-billing-month-adjustment.is-addition-6,
.work-billing-coverage-chip.is-addition-6 { background: #edf8f8; color: #27757a; }

.work-billing-invoice-status {
  border: 0;
  border-radius: 999px;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  margin: 0;
  padding: 3px 7px;
  text-transform: none;
  white-space: nowrap;
}

.work-billing-status-detail {
  display: block;
  margin-top: 0.28rem;
  color: var(--text-muted);
  line-height: 1.3;
}

.work-billing-invoice-status.is-open { background: #fff1ef; color: #9b2d20; }
.work-billing-invoice-status.is-partial { background: #fff6e7; color: #8a5b18; }
.work-billing-invoice-status.is-invoiced { background: #eaf7ee; color: #236436; }
.work-billing-invoice-status.is-to-invoice { background: #eef4ff; color: #28558a; }
.work-billing-invoice-status.is-uncovered { background: #fff1ef; color: #9b2d20; }
.work-billing-invoice-status.is-none { background: #f1f3f5; color: var(--muted); }
.work-billing-invoice-status.is-offered { background: #eef4ff; color: #28558a; }
.work-billing-invoice-status.is-void { background: #f1f3f5; color: var(--muted); }

.work-billing-retainer-to-invoice {
  min-width: 230px;
}

.work-billing-retainer-invoice-link {
  margin-top: 8px;
  text-align: left;
}

.work-billing-retainer-invoice-link summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 11px;
  font-weight: 850;
}

.work-billing-retainer-invoice-link form {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  margin-top: 7px;
  padding: 10px;
}

.work-billing-retainer-invoice-link label {
  color: var(--muted);
  display: grid;
  font-size: 11px;
  font-weight: 800;
  gap: 4px;
}

.work-billing-retainer-invoice-link small {
  color: var(--muted);
  line-height: 1.4;
  white-space: normal;
}

.work-billing-retainer-alert {
  background: #fff8ec;
  border-left: 4px solid #bf7b16;
  border-radius: 6px;
  margin: 0;
  padding: 10px 12px;
}

.work-billing-retainer-alert.is-exhausted {
  background: #fff1ef;
  border-left-color: #b42318;
}

.work-billing-retainer-top-alert {
  margin-bottom: 14px;
}

.work-billing-annual-header-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.work-billing-retainer-history {
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  display: grid;
  gap: 12px;
  padding: 16px;
}

.work-billing-retainer-history-list {
  display: grid;
  gap: 8px;
}

.work-billing-retainer-history-row {
  align-items: start;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-left: 4px solid var(--green);
  border-radius: 8px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 13px 14px;
}

.work-billing-retainer-history-row.is-base { border-left-color: var(--accent); }

.work-billing-retainer-history-row.is-addition {
  background: var(--retainer-addition-background, #f4f8f5);
  border-left-color: var(--retainer-addition-accent, var(--green));
}

.work-billing-retainer-history-row.is-voided {
  border-left-color: var(--muted);
  opacity: 0.72;
}

.work-billing-retainer-history-row > div:first-child {
  display: grid;
  gap: 4px;
}

.work-billing-retainer-history-row small { color: var(--muted); }

.work-billing-retainer-history-amount {
  align-items: end;
  display: grid;
  gap: 6px;
  justify-items: end;
  text-align: right;
}

.work-billing-retainer-history-amount details form {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  min-width: 240px;
  text-align: left;
}

.work-billing-annual-danger-card {
  background: linear-gradient(180deg, #fff7f5, #fff);
  border-color: rgba(180, 35, 24, 0.24);
  box-shadow: inset 4px 0 0 #b42318, var(--shadow-soft);
}

.work-billing-annual-danger-card strong {
  color: #b42318;
}

.work-billing-annual-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.5fr) minmax(260px, 0.8fr);
}

.work-billing-annual-table-wrap {
  min-width: 0;
  overflow-x: auto;
}

.work-billing-annual-table-wrap h3 {
  font-size: 16px;
  margin: 0 0 8px;
}

.work-billing-annual-table {
  min-width: 460px;
}

.work-billing-annual-tools {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(260px, 1fr) auto;
}

.work-billing-annual-search-field {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  min-width: 0;
}

.work-billing-annual-filter-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

.work-billing-annual-filter {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  font: inherit;
  font-weight: 800;
  min-height: 34px;
  padding: 7px 10px;
}

.work-billing-annual-filter.is-active,
.work-billing-annual-filter:hover,
.work-billing-annual-filter:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.work-billing-annual-dashboard {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.34fr);
  min-width: 0;
}

.work-billing-annual-content {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.work-billing-brand-budget-table {
  min-width: 1120px;
}

.work-billing-brand-budget-table tbody tr {
  cursor: pointer;
}

.work-billing-brand-budget-table tbody tr:hover,
.work-billing-brand-budget-table tbody tr.is-selected {
  background: #fff9f7;
}

.work-billing-brand-budget-table tbody tr.is-hidden {
  display: none;
}

.work-billing-annual-brand-name {
  display: grid;
  gap: 3px;
  min-width: 96px;
}

.work-billing-annual-brand-name strong {
  font-size: 16px;
}

.work-billing-annual-brand-name small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.work-billing-annual-progress-cell {
  min-width: 150px;
}

.work-billing-annual-progress-meta,
.work-billing-annual-month-label {
  align-items: center;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 10px;
  justify-content: space-between;
}

.work-billing-annual-bar {
  background: #eee8e0;
  border-radius: 999px;
  height: 8px;
  margin-top: 6px;
  overflow: hidden;
}

.work-billing-annual-bar span {
  background: var(--green);
  display: block;
  height: 100%;
  min-width: 2px;
  width: min(var(--w), 100%);
}

tr[data-annual-status="over"] .work-billing-annual-bar span,
.work-billing-annual-detail-panel [data-annual-detail-status="over"] .work-billing-annual-bar span {
  background: #b42318;
}

tr[data-annual-status="near"] .work-billing-annual-bar span {
  background: #8a5a13;
}

.work-billing-annual-status,
.work-billing-annual-chip {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  min-height: 28px;
  padding: 5px 9px;
  white-space: nowrap;
}

.work-billing-annual-status.is-available,
.work-billing-annual-chip.is-available {
  background: #e7f2ee;
  border-color: rgba(29, 111, 88, 0.2);
  color: #1d6f58;
}

.work-billing-annual-status.is-over,
.work-billing-annual-chip.is-over {
  background: #fff0ee;
  border-color: rgba(180, 35, 24, 0.24);
  color: #b42318;
}

.work-billing-annual-status.is-near {
  background: #f7eedb;
  border-color: rgba(138, 90, 19, 0.2);
  color: #8a5a13;
}

.work-billing-annual-status.is-unbudgeted {
  background: #f3f0eb;
  border-color: var(--line);
  color: var(--muted);
}

.work-billing-month-has-value {
  color: var(--text);
  font-weight: 800;
}

.work-billing-annual-empty {
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-weight: 750;
  padding: 18px;
  text-align: center;
}

.work-billing-annual-detail-panel,
.work-billing-annual-budget-panel {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(31, 29, 27, 0.05);
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 14px;
}

.work-billing-annual-budget-panel {
  align-self: start;
}

.work-billing-annual-detail-panel [hidden] {
  display: none !important;
}

.work-billing-annual-detail-head {
  align-items: start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.work-billing-annual-detail-head h3 {
  font-size: 20px;
  line-height: 1.12;
  margin: 2px 0 0;
}

.work-billing-annual-summary-list,
.work-billing-annual-month-bars,
.work-billing-annual-chip-list {
  display: grid;
  gap: 8px;
}

.work-billing-annual-summary-list span {
  align-items: baseline;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.work-billing-annual-summary-list b {
  color: var(--muted);
  font-size: 12px;
}

.work-billing-annual-month-overview {
  display: grid;
  gap: 10px;
}

.work-billing-annual-month-overview h3 {
  font-size: 16px;
  margin: 0;
}

.work-billing-annual-month-stack {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(12, minmax(50px, 1fr));
  min-height: 132px;
  overflow-x: auto;
}

.work-billing-annual-month-column {
  align-items: end;
  display: grid;
  gap: 6px;
  grid-template-rows: 1fr auto auto;
  min-width: 50px;
}

.work-billing-annual-column-track {
  align-items: end;
  background: #eee8e0;
  border-radius: 999px 999px 4px 4px;
  display: flex;
  height: 88px;
  overflow: hidden;
  width: 100%;
}

.work-billing-annual-column-track span {
  background: #285e7a;
  display: block;
  min-height: 2px;
  width: 100%;
}

.work-billing-annual-month-column strong,
.work-billing-annual-month-column small {
  font-size: 11px;
  text-align: center;
}

.work-billing-annual-month-column small {
  color: var(--muted);
}

.work-billing-brand-budget-group {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px;
}

.work-billing-brand-budget-group legend {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  padding: 0 4px;
  text-transform: uppercase;
}

.work-billing-brand-budget-row {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(120px, 1fr) minmax(120px, 0.7fr);
}

.work-billing-inline-form,
.work-billing-entry-form {
  align-items: end;
  display: grid;
  gap: 12px;
}

.work-billing-inline-form {
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 0.7fr) minmax(180px, 0.7fr) minmax(110px, 0.4fr) auto;
}

.work-billing-inline-form [hidden],
.work-billing-entry-form [hidden] {
  display: none !important;
}

.work-billing-profile-form {
  align-items: start;
  grid-template-columns: minmax(260px, 1.2fr) minmax(220px, 0.9fr) minmax(180px, 0.7fr) minmax(110px, 0.4fr) auto;
}

.work-billing-choice-group {
  align-content: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  grid-column: span 2;
  margin: 0;
  padding: 10px;
}

.work-billing-choice-group legend {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  padding: 0 4px;
  text-transform: uppercase;
}

.work-billing-check-option {
  align-items: center;
  color: var(--text) !important;
  display: inline-flex !important;
  font-size: 13px !important;
  gap: 6px !important;
  min-height: 28px;
}

.work-billing-check-option input {
  width: auto;
}

.work-billing-danger-action {
  border-color: #c46b6b;
  color: #9b1515;
}

.work-billing-timer-form {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr;
}

.work-billing-import-form {
  display: grid;
  gap: 10px;
}

.work-billing-entry-form {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.work-billing-inline-form label,
.work-billing-entry-form label,
.work-billing-timer-form label,
.work-billing-import-form label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  min-width: 0;
}

.work-billing-import-text-field textarea {
  min-height: 150px;
  resize: vertical;
}

.work-billing-import-preview {
  background: var(--surface-muted);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 10px;
}

.work-billing-import-preview small {
  color: var(--muted);
  grid-column: 1 / -1;
}

.work-billing-import-map {
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr;
}

.work-billing-document-panel {
  display: grid;
  gap: 12px;
}

.work-billing-document-panel h2 {
  margin: 2px 0 0;
}

.work-billing-selection-context {
  background: var(--surface-muted);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
  margin: 0;
  padding: 10px;
}

.work-billing-document-card {
  --document-accent: var(--accent);
  --document-accent-dark: var(--accent-dark);
  --document-border: rgba(164, 19, 19, 0.28);
  --document-soft: var(--accent-soft);
  border: 1px solid var(--document-border);
  border-radius: 8px;
  box-shadow: inset 4px 0 0 var(--document-accent);
  display: grid;
  gap: 10px;
  padding: 12px;
}

.work-billing-document-card.is-offer {
  --document-accent: var(--doc-offer);
  --document-accent-dark: var(--doc-offer-dark);
  --document-border: var(--doc-offer-border);
  --document-soft: var(--doc-offer-soft);
}

.work-billing-document-card.is-invoice {
  --document-accent: var(--doc-invoice);
  --document-accent-dark: var(--doc-invoice-dark);
  --document-border: var(--doc-invoice-border);
  --document-soft: var(--doc-invoice-soft);
}

.work-billing-document-card .button-primary {
  background: var(--document-accent);
  border-color: var(--document-accent);
  width: 100%;
}

.work-billing-document-card .button-primary:hover,
.work-billing-document-card .button-primary:focus-visible {
  background: var(--document-accent-dark);
  border-color: var(--document-accent-dark);
}

.work-billing-document-card-head {
  align-items: start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.work-billing-document-card-head strong {
  display: block;
  font-size: 15px;
}

.work-billing-document-card-head small {
  color: var(--muted);
  display: block;
  font-weight: 650;
  margin-top: 2px;
}

.work-billing-document-layout {
  border: 0;
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr 1fr;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.work-billing-document-layout.is-three-options {
  grid-template-columns: 1fr;
}

.work-billing-range-fields {
  align-items: end;
  background: var(--surface-muted);
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-column: 1 / -1;
  grid-template-columns: auto repeat(4, minmax(110px, 150px));
  padding: 10px 12px;
}

.work-billing-range-fields[hidden] {
  display: none;
}

.work-billing-range-fields > span {
  align-self: center;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}

.work-billing-layout-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  cursor: pointer;
  display: grid;
  gap: 3px;
  min-height: 58px;
  padding: 9px;
  position: relative;
}

.work-billing-layout-card input {
  opacity: 0;
  pointer-events: none;
  position: absolute;
}

.work-billing-layout-card strong {
  display: block;
  font-size: 13px;
}

.work-billing-layout-card small {
  color: var(--muted);
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 2px;
}

.work-billing-layout-card:has(input:checked) {
  background: var(--document-soft);
  border-color: var(--document-border);
  color: var(--document-accent-dark);
}

.work-billing-layout-card:has(input:focus-visible) {
  outline: 2px solid var(--document-accent);
  outline-offset: 2px;
}

.work-billing-document-layout.is-three-options .work-billing-layout-card {
  min-height: 50px;
}

.work-billing-document-layout.is-three-options .work-billing-layout-card > span {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.work-billing-document-layout.is-three-options .work-billing-layout-card small {
  margin-top: 0;
  text-align: right;
}

.work-billing-manual-card {
  display: grid;
  gap: 10px;
}

.work-billing-manual-panel {
  background: var(--surface-muted);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 10px;
}

.work-billing-manual-panel[hidden] {
  display: none !important;
}

.work-billing-manual-panel label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  min-width: 0;
}

.work-billing-manual-panel .sidebar-action-button,
.work-billing-manual-panel input[type="text"] {
  width: 100%;
}

.work-billing-wide-field {
  grid-column: span 2;
  min-width: 0;
}

.work-billing-timer-panel {
  display: grid;
  gap: 12px;
}

.work-billing-clock {
  color: var(--accent-dark);
  display: block;
  font-size: 34px;
  line-height: 1;
  margin: 10px 0;
}

.work-billing-table-wrap {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}

.work-billing-entries-panel {
  overflow: hidden;
}

.work-billing-table-wrap.is-dragging-rows {
  cursor: grabbing;
}

.work-billing-table-wrap table {
  min-width: 960px;
}

.work-billing-entries-panel tr.is-selected td {
  background: #fff9f7;
}

.work-billing-period-group td {
  background: #f5f2ef;
  border-bottom-color: #ded7d1;
  border-top: 2px solid #d8d0ca;
  padding: 9px 12px;
}

.work-billing-period-group div {
  align-items: center;
  display: flex;
  gap: 12px;
}

.work-billing-period-group strong {
  color: var(--accent-dark);
}

.work-billing-period-group span {
  color: var(--muted);
  font-size: 12px;
}

.work-billing-period-group a {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 800;
  margin-left: auto;
}

.work-billing-bulk-form {
  display: grid;
  gap: 12px;
}

.work-billing-bulk-actions {
  align-items: end;
  background: var(--surface-muted);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(140px, 0.55fr) minmax(160px, 0.7fr) minmax(220px, 1fr) auto auto auto;
  padding: 10px;
}

.work-billing-bulk-actions label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  min-width: 0;
}

.work-billing-selected-actions {
  align-items: stretch;
  grid-template-columns: 1fr;
}

.work-billing-selected-actions .sidebar-section-title {
  margin: 0;
}

.work-billing-bulk-selection {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.work-billing-bulk-selection strong {
  color: var(--text);
}

.work-billing-bulk-selection span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.work-billing-invoice-layout {
  border: 0;
  display: grid;
  gap: 8px;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.work-billing-invoice-layout legend {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  margin-bottom: 2px;
}

.work-billing-invoice-layout label {
  align-items: center;
  display: flex;
  gap: 8px;
}

.work-billing-invoice-layout input {
  margin: 0;
}

.work-billing-selected-actions .sidebar-action-button,
.work-billing-selected-actions input[type="text"] {
  width: 100%;
}

.work-billing-select-column {
  text-align: center;
  width: 42px;
}

.work-billing-select-column input {
  accent-color: var(--accent);
  height: 16px;
  margin: 0;
  width: 16px;
}

.work-billing-drag-column {
  text-align: center;
  width: 34px;
}

.work-billing-drag-handle {
  background: transparent;
  border: 0;
  color: var(--muted);
  cursor: grab;
  display: inline-grid;
  height: 28px;
  min-height: 28px;
  padding: 0;
  place-items: center;
  width: 28px;
}

.work-billing-drag-handle:active {
  cursor: grabbing;
}

.work-billing-drag-handle:hover {
  color: var(--accent-dark);
}

[data-work-billing-entry-row] {
  transition: background-color 150ms ease, box-shadow 150ms ease, opacity 150ms ease, transform 150ms ease;
}

[data-work-billing-entry-row] td {
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

.work-billing-retainer-covered-row td {
  background: var(--retainer-coverage-background, transparent);
}

.work-billing-entries-panel tr.work-billing-retainer-covered-row.is-selected td {
  box-shadow: inset 0 2px 0 var(--accent), inset 0 -2px 0 var(--accent);
}

.work-billing-coverage-cell {
  min-width: 140px;
}

.work-billing-coverage-chip {
  background: transparent !important;
  display: block;
  margin: 2px 0;
}

.work-billing-coverage-chip > span {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
}

.work-billing-coverage-chip.is-base {
  background: #f1f4f6;
  color: #52616b;
}

.work-billing-coverage-chip.is-uncovered {
  background: #fff0ed;
  color: #a73527;
}

.work-billing-actions-column {
  text-align: right;
  white-space: nowrap;
  width: 132px;
}

.work-billing-row-actions {
  display: inline-flex;
  gap: 6px;
  justify-content: flex-end;
}

.work-billing-row-action {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  display: inline-grid;
  height: 32px;
  place-items: center;
  padding: 0;
  width: 32px;
}

.work-billing-row-action:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
}

.work-billing-row-action.danger {
  border-color: #d8a1a1;
  color: #9b1515;
}

.work-billing-row-action svg,
.work-billing-icon-submit svg,
.work-billing-drag-handle svg,
.work-billing-row-warning-badge svg {
  fill: none;
  height: 16px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 16px;
}

.work-billing-row-warning {
  background: #fff7f4;
}

.work-billing-row-warning td {
  border-color: #efc6bf;
}

.work-billing-row-warning-badge {
  align-items: center;
  background: #fff;
  border: 1px solid #e3a29a;
  border-radius: 999px;
  color: #a41313;
  display: inline-flex;
  height: 22px;
  justify-content: center;
  margin-left: 6px;
  vertical-align: middle;
  width: 22px;
}

.work-billing-row-warning-badge svg {
  height: 14px;
  width: 14px;
}

.work-billing-time-suggestion-row[hidden] {
  display: none !important;
}

.work-billing-time-suggestion-row td {
  background: #fffaf7;
  border-bottom: 1px solid #efc6bf;
  border-top: 0;
  padding: 8px 14px 14px;
}

.work-billing-time-suggestions {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.work-billing-time-suggestions strong {
  color: #a41313;
  display: block;
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.work-billing-time-suggestions span {
  color: var(--muted);
  font-size: 12px;
}

.work-billing-time-suggestion-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.work-billing-time-suggestion-actions form {
  margin: 0;
}

.work-billing-time-suggestion-actions .button {
  min-height: 32px;
  padding: 6px 10px;
}

.work-billing-time-suggestion-actions .button-ghost {
  background: #fff;
  border: 1px solid var(--line);
  color: var(--text);
}

.work-billing-time-suggestion-actions .button-ghost:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
}

[data-work-billing-entry-row].is-dragging {
  background: #fff;
  box-shadow: 0 14px 32px rgba(28, 22, 18, 0.18);
  opacity: 0.9;
  position: relative;
  transform: scale(1.006);
  z-index: 4;
}

[data-work-billing-entry-row].is-dragging td {
  background: #fff;
  border-color: #e3a29a;
}

.work-billing-drop-marker[hidden] {
  display: none !important;
}

.work-billing-drop-marker td {
  background: transparent;
  border: 0;
  height: 0;
  padding: 0 !important;
  position: relative;
}

.work-billing-drop-marker span {
  animation: work-billing-drop-marker-pulse 900ms ease-in-out infinite;
  background: #a41313;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(164, 19, 19, 0.12);
  display: block;
  height: 3px;
  margin: 0 12px;
}

@keyframes work-billing-drop-marker-pulse {
  0%,
  100% {
    opacity: 0.76;
  }

  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-work-billing-entry-row],
  [data-work-billing-entry-row] td,
  .work-billing-drop-marker span {
    animation: none;
    transition: none;
  }

  [data-work-billing-entry-row].is-dragging {
    transform: none;
  }
}

.work-billing-edit-row[hidden] {
  display: none !important;
}

.work-billing-edit-row td {
  background: var(--surface-muted);
  border-bottom: 1px solid var(--line-soft);
  border-top: 1px solid var(--line-soft);
  padding: 14px;
}

.work-billing-entry-edit-panel {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 12px;
}

.work-billing-entry-edit-panel[hidden] {
  display: none !important;
}

.work-billing-edit-buttons {
  align-items: end;
  display: flex;
  gap: 8px;
}

.work-billing-icon-submit {
  display: inline-grid;
  min-height: 38px;
  min-width: 42px;
  padding: 0;
  place-items: center;
}

.sr-only {
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.work-billing-side .total-box {
  background: var(--accent);
  border-radius: 8px;
  color: #fff;
  display: grid;
  gap: 4px;
  padding: 15px;
}

.work-billing-side .total-box span,
.work-billing-side .total-box small {
  color: rgba(255, 255, 255, 0.84);
  font-weight: 750;
}

.work-billing-side .total-box strong {
  color: #fff;
  font-size: 28px;
  line-height: 1;
}

.work-billing-profile-drawer-backdrop {
  background: rgba(24, 22, 20, 0.24);
  display: none;
  inset: 0;
  position: fixed;
  z-index: 90;
}

.work-billing-import-drawer-backdrop {
  background: rgba(24, 22, 20, 0.28);
  display: none;
  inset: 0;
  position: fixed;
  z-index: 90;
}

.work-billing-retainer-drawer-backdrop {
  background: rgba(24, 22, 20, 0.28);
  display: none;
  inset: 0;
  position: fixed;
  z-index: 90;
}

body.work-billing-drawer-open {
  overflow: hidden;
}

.work-billing-profile-drawer {
  background: var(--surface);
  border-left: 1px solid var(--line);
  box-shadow: -18px 0 42px rgba(24, 22, 20, 0.16);
  display: none;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100vh;
  max-width: min(92vw, 820px);
  overflow: hidden;
  padding: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 820px;
  z-index: 100;
}

.work-billing-import-drawer {
  background: var(--surface);
  border-left: 1px solid var(--line);
  box-shadow: -18px 0 42px rgba(24, 22, 20, 0.18);
  display: none;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100vh;
  max-width: min(92vw, 650px);
  overflow: hidden;
  padding: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 650px;
  z-index: 100;
}

.work-billing-retainer-drawer {
  background: var(--surface);
  border-left: 1px solid var(--line);
  box-shadow: -18px 0 42px rgba(24, 22, 20, 0.18);
  display: none;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100vh;
  max-width: min(92vw, 650px);
  overflow: hidden;
  position: fixed;
  right: 0;
  top: 0;
  width: 650px;
  z-index: 100;
}

body.work-billing-profile-drawer-open .work-billing-profile-drawer-backdrop {
  display: block;
}

body.work-billing-profile-drawer-open .work-billing-profile-drawer {
  display: grid;
}

body.work-billing-import-drawer-open .work-billing-import-drawer-backdrop {
  display: block;
}

body.work-billing-import-drawer-open .work-billing-import-drawer {
  display: grid;
}

body.work-billing-retainer-drawer-open .work-billing-retainer-drawer-backdrop {
  display: block;
}

body.work-billing-retainer-drawer-open .work-billing-retainer-drawer {
  display: grid;
}

.work-billing-retainer-form {
  display: grid;
  gap: 18px;
  min-height: 0;
  overflow-y: auto;
  padding: 20px 24px 24px;
}

.work-billing-retainer-context {
  background: #f4f7f9;
  border: 1px solid #d8e0e5;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 14px;
}

.work-billing-retainer-context span,
.work-billing-retainer-context small { color: var(--muted); }

.work-billing-retainer-context strong { font-size: 24px; }

.work-billing-import-drawer-body {
  display: grid;
  gap: 16px;
  overflow-y: auto;
  padding: 18px 20px 24px;
}

.work-billing-drawer-head {
  align-items: center;
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 18px 20px 14px;
}

.work-billing-drawer-head h2,
.work-billing-drawer-section h3 {
  margin: 0;
}

.work-billing-drawer-section {
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.work-billing-profile-drawer .work-billing-profile-form {
  grid-template-columns: 1fr 1fr;
}

.work-billing-profile-drawer .work-billing-choice-group {
  grid-column: 1 / -1;
}

.work-billing-profile-drawer .work-billing-profile-form > button[type="submit"] {
  justify-self: start;
}

.work-billing-profile-drawer-body {
  display: grid;
  min-height: 0;
  overflow-y: auto;
}

.work-billing-profile-mode-panel[hidden],
.work-billing-annual-settings[hidden],
.work-billing-brand-budget-group[hidden],
.work-billing-brand-help[hidden],
.work-billing-mode-note[hidden] {
  display: none !important;
}

.work-billing-profile-drawer .work-billing-profile-form {
  display: grid;
  gap: 0;
  grid-template-columns: 1fr;
}

.work-billing-profile-form-section {
  border-bottom: 1px solid var(--line-soft);
  display: grid;
  gap: 16px;
  padding: 22px 24px;
}

.work-billing-profile-form-section-head h3 {
  margin: 0;
}

.work-billing-profile-form-section-head p {
  color: var(--muted);
  font-size: 13px;
  margin: 5px 0 0;
}

.work-billing-profile-form-grid {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.work-billing-profile-form-grid > *,
.work-billing-profile-form-grid label {
  min-width: 0;
}

.work-billing-profile-span-2 {
  grid-column: 1 / -1;
}

.work-billing-mode-note,
.work-billing-brand-help {
  background: #f4f7f9;
  border: 1px solid #d8e0e5;
  border-radius: 8px;
  color: #46535d;
  display: grid;
  gap: 3px;
  padding: 12px 14px;
}

.work-billing-mode-note span,
.work-billing-brand-help {
  font-size: 13px;
}

.work-billing-annual-settings {
  display: grid;
  gap: 14px;
}

.work-billing-profile-edit-context {
  align-items: center;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--line-soft);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 14px 24px;
}

.work-billing-profile-edit-context > div {
  display: grid;
  gap: 3px;
}

.work-billing-profile-edit-context span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.work-billing-drawer-actions {
  align-items: center;
  background: var(--surface);
  border-top: 1px solid var(--line);
  bottom: 0;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 14px 24px;
  position: sticky;
  z-index: 2;
}

.work-billing-drawer-actions > div {
  display: flex;
  gap: 8px;
}

.work-billing-profile-form .work-billing-choice-group {
  grid-column: 1 / -1;
}

@media (min-width: 1241px) and (max-width: 1500px) {
  .work-billing-metrics {
    grid-template-columns: repeat(3, minmax(136px, 1fr));
  }
}

@media (max-width: 1240px) {
  .work-billing-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .work-billing-side {
    position: static;
  }

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

  .work-billing-annual-metrics,
  .work-billing-annual-grid,
  .work-billing-annual-dashboard {
    grid-template-columns: 1fr;
  }

  .work-billing-annual-budget-panel {
    position: static;
  }

  .work-billing-bulk-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .work-billing-context-form,
  .work-billing-range-fields,
  .work-billing-inline-form,
  .work-billing-timer-form,
  .work-billing-entry-form,
  .work-billing-annual-tools,
  .work-billing-brand-budget-row {
    grid-template-columns: 1fr;
  }

  .work-billing-choice-group,
  .work-billing-wide-field,
  .work-billing-brand-budget-group {
    grid-column: auto;
  }

  .work-billing-profile-form-grid {
    grid-template-columns: 1fr;
  }

  .work-billing-profile-span-2,
  .work-billing-profile-form .work-billing-choice-group {
    grid-column: 1;
  }

  .work-billing-metrics {
    grid-template-columns: 1fr;
  }

  .work-billing-retainer-billing-totals {
    grid-template-columns: 1fr;
  }

  .work-billing-annual-filter-row {
    justify-content: flex-start;
  }

  .work-billing-annual-month-stack {
    grid-template-columns: repeat(6, minmax(56px, 1fr));
  }

  .work-billing-bulk-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .work-billing-title-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .work-billing-title-actions > *,
  .work-billing-title-actions .button-primary,
  .work-billing-title-actions .button-secondary,
  .work-billing-more-menu summary {
    justify-content: center;
    min-width: 0;
    width: 100%;
  }

  .work-billing-more-popover {
    left: 0;
    min-width: min(280px, calc(100vw - 24px));
    right: auto;
  }

  .work-billing-profile-drawer,
  .work-billing-import-drawer,
  .work-billing-retainer-drawer {
    border-left: 0;
    max-width: 100vw;
    width: 100vw;
  }

  .work-billing-retainer-history-row { display: grid; }

  .work-billing-retainer-history-amount {
    justify-items: start;
    text-align: left;
  }

  .work-billing-profile-form-section {
    padding: 20px 16px;
  }

  .work-billing-drawer-head {
    align-items: flex-start;
    padding: 14px 16px 12px;
  }

  .work-billing-drawer-actions {
    align-items: stretch;
    flex-direction: column;
    padding: 12px 16px;
  }

  .work-billing-drawer-actions > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .work-billing-profile-edit-context {
    align-items: flex-start;
    flex-direction: column;
    padding: 12px 16px;
  }

  .work-billing-workspace,
  .work-billing-main,
  .work-billing-side {
    max-width: 100%;
    min-width: 0;
  }
}
.coordination-start-card,
.coordination-title {
  border-top: 4px solid #17844c;
}

.coordination-start-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.customer-order-next-step {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
  border-top: 4px solid var(--document-accent);
}

.coordination-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 22px;
  align-items: start;
}

.coordination-main,
.coordination-sidebar {
  display: grid;
  gap: 22px;
}

.coordination-sidebar {
  position: sticky;
  top: 18px;
}

.coordination-summary-grid,
.coordination-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

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

.coordination-summary-grid > div {
  display: grid;
  gap: 6px;
}

.coordination-summary-grid span,
.coordination-task small,
.coordination-recipient small,
.coordination-communication-list small {
  color: var(--muted, #746d68);
  font-size: .82rem;
}

.coordination-execution-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #d8d1cb;
  border-radius: 999px;
  background: #f5f2ef;
  color: #4b4540;
  font-size: .78rem;
  font-weight: 800;
}

.coordination-execution-badge--internal_production {
  border-color: #9dcdb1;
  background: #edf8f1;
  color: #16663a;
}

.coordination-execution-badge--supplier {
  border-color: #e8bd7d;
  background: #fff7e9;
  color: #8b5207;
}

.coordination-execution-badge--mixed {
  border-color: #b9a4d9;
  background: #f5f0fb;
  color: #5d358c;
}

.coordination-package-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.coordination-package {
  overflow: clip;
  border: 1px solid #dcd4ce;
  border-radius: 12px;
  background: #fff;
}

.coordination-package[open] {
  border-color: #c9bdb4;
  box-shadow: 0 10px 28px rgba(61, 44, 32, .07);
}

.coordination-package > summary {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 68px;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
  background: linear-gradient(90deg, #fbf8f5 0, #fff 62%);
}

.coordination-package > summary::-webkit-details-marker { display: none; }

.coordination-package > summary::after {
  content: "+";
  grid-column: 4;
  color: var(--accent);
  font-size: 1.25rem;
  font-weight: 900;
}

.coordination-package[open] > summary::after { content: "−"; }

.coordination-package-number {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: var(--accent);
  color: #fff;
  font-size: .84rem;
  font-weight: 900;
}

.coordination-package-heading {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.coordination-package-heading strong {
  overflow: hidden;
  color: #2a211c;
  font-size: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coordination-package-heading small,
.coordination-package-stage small,
.coordination-package-items small,
.coordination-package-tasks > div small {
  color: var(--muted, #746d68);
}

.coordination-package-body {
  display: grid;
  gap: 16px;
  padding: 0 16px 16px 64px;
}

.coordination-package-body .coordination-assets-panel.is-embedded {
  background: #f7fbf8;
  border: 1px solid #c9e1d0;
  border-radius: 10px;
  padding: 14px;
}

.coordination-package-stages {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 14px 0 0;
  list-style: none;
  counter-reset: stage;
}

.coordination-package-stage {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) max-content;
  align-items: start;
  gap: 10px;
  position: relative;
  padding: 10px 12px;
  border-left: 3px solid #8b7c71;
  border-radius: 0 9px 9px 0;
  background: #f8f6f4;
}

.coordination-package-stage--external { border-left-color: #d18316; background: #fff8ec; }
.coordination-package-stage--internal { border-left-color: #218452; background: #f0f8f3; }
.coordination-package-stage--material { border-left-color: #3379b7; background: #f0f6fb; }

.coordination-package-stage > span {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: #62574f;
  font-size: .74rem;
  font-weight: 900;
}

.coordination-package-stage > div { display: grid; gap: 3px; }
.coordination-package-stage p { margin: 2px 0 0; color: #554b45; font-size: .83rem; }
.coordination-package-stage > b { color: #3b312b; font-size: .82rem; white-space: nowrap; }

.coordination-package-items {
  display: grid;
  border-top: 1px solid #ece6e1;
}

.coordination-package-items > span {
  display: grid;
  grid-template-columns: minmax(150px, .75fr) minmax(220px, 1.5fr) max-content;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid #f0ebe7;
  font-size: .85rem;
}

.coordination-package-items > span > b { white-space: nowrap; }

.coordination-package-tasks {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px dashed #d8cec6;
  border-radius: 10px;
  background: #fcfbfa;
}

.coordination-package-tasks > div:first-child { display: grid; gap: 2px; }
.coordination-package-empty { margin: 0; color: var(--muted); font-size: .85rem; }

.coordination-task.coordination-package-task {
  grid-template-columns: minmax(0, 1fr) 118px auto auto auto;
  background: #fff;
}

.coordination-package-task-copy { display: grid; gap: 3px; }
.coordination-package-task .coordination-task-comments { grid-column: 1 / -1; }

.coordination-package-task-create {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) 112px max-content max-content auto;
  align-items: center;
  gap: 8px;
  padding-top: 4px;
}

.coordination-package-task-create > input,
.coordination-package-task-create > select {
  min-height: 38px;
}

.coordination-completion-note,
.coordination-completion-warning {
  display: grid;
  gap: 3px;
  margin-top: 16px;
  padding: 12px 14px;
  border-left: 3px solid #218452;
  background: #f0f8f3;
  color: #315442;
}

.coordination-completion-note span,
.coordination-completion-warning { font-size: .86rem; }

.coordination-completion-warning { margin-bottom: 0; }

@media (max-width: 900px) {
  .coordination-package > summary {
    grid-template-columns: 34px minmax(0, 1fr) auto;
  }
  .coordination-package > summary .coordination-execution-badge {
    grid-column: 2;
    justify-self: start;
  }
  .coordination-package > summary::after {
    grid-column: 3;
    grid-row: 1 / span 2;
  }
  .coordination-package-body { padding-left: 16px; }
  .coordination-package-stage,
  .coordination-package-items > span,
  .coordination-task.coordination-package-task,
  .coordination-package-task-create {
    grid-template-columns: 1fr;
  }
  .coordination-package-stage > span { display: none; }
  .coordination-package-task form,
  .coordination-package-task .coordination-task-comments { grid-column: 1; }
}

.coordination-contact-card {
  border-top: 4px solid #d68618;
}

.coordination-contact-card--customer {
  border-top-color: #3379b7;
}

.coordination-contact-card label,
.coordination-sidebar label,
.coordination-email-dialog label {
  display: grid;
  gap: 7px;
  margin-top: 14px;
  font-weight: 700;
}

.coordination-contact-details,
.coordination-location-details {
  display: grid;
  gap: 5px;
  margin-top: 10px;
  color: var(--muted, #746d68);
  font-size: .9rem;
}

.coordination-contact-details a,
.coordination-location-details a {
  color: inherit;
  text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
  text-underline-offset: 2px;
}

.coordination-location-details {
  border-radius: 9px;
  background: #f7f5f2;
  padding: 11px 12px;
}

.coordination-location-details strong {
  color: var(--text, #211f1d);
}

.coordination-task-list,
.coordination-communication-list {
  display: grid;
  gap: 10px;
}

.coordination-task {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 126px repeat(4, auto);
  align-items: center;
  gap: 12px;
  padding: 13px;
  border: 1px solid #e1dbd6;
  border-radius: 10px;
}

.coordination-task-create {
  align-items: center;
  border-top: 1px solid #e5dfda;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(240px, 1fr) 140px 126px 104px 112px auto;
  margin-top: 16px;
  padding-top: 16px;
}

.coordination-task-priority-form select,
.coordination-task-create > select {
  border: 1px solid #d8d0ca;
  border-radius: 8px;
  min-height: 38px;
  padding: 0 9px;
}

.coordination-task-priority-form select {
  width: 126px;
}

.coordination-task-create label,
.coordination-members label,
.coordination-create-members label,
.coordination-create-task-main,
.coordination-create-task-portal {
  align-items: center;
  display: flex;
  gap: 8px;
  margin: 0;
}

.coordination-check-choice input[type="checkbox"] {
  appearance: none;
  background: #fff;
  border: 1.5px solid var(--accent);
  border-radius: 4px;
  cursor: pointer;
  flex: 0 0 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  position: relative;
  transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
  width: 16px;
}

.coordination-check-choice input[type="checkbox"]::before {
  background: #fff;
  clip-path: polygon(14% 44%, 0 60%, 38% 100%, 100% 18%, 84% 0, 36% 66%);
  content: "";
  height: 9px;
  left: 3px;
  position: absolute;
  top: 2px;
  transform: scale(0);
  transition: transform 120ms ease;
  width: 9px;
}

.coordination-check-choice input[type="checkbox"]:checked {
  background: var(--accent);
  border-color: var(--accent);
}

.coordination-check-choice input[type="checkbox"]:checked::before {
  transform: scale(1);
}

.coordination-check-choice input[type="checkbox"]:focus-visible {
  box-shadow: 0 0 0 3px rgba(164, 19, 19, 0.2);
  outline: 0;
}

.coordination-member-choice {
  justify-content: flex-start;
  width: 100%;
}

.coordination-member-choice span {
  min-width: 0;
  white-space: nowrap;
}

.coordination-task-portal-choice {
  align-items: flex-start;
  justify-self: start;
  line-height: 1.2;
  width: 100%;
}

.coordination-task-portal-choice span {
  max-width: 82px;
}

.coordination-members {
  border: 0;
  display: grid;
  gap: 8px;
  margin: 16px 0 4px;
  padding: 0;
}

.coordination-members legend,
.coordination-create-members legend {
  font-weight: 800;
  margin-bottom: 8px;
}

.production-portal-panel {
  border-top: 4px solid var(--process-work-order, #168a4f);
}

.production-portal-assignment {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(320px, 1.5fr) auto;
  gap: 18px;
  align-items: end;
}

.production-portal-delivery {
  display: grid;
  gap: 18px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.production-portal-supplier {
  display: grid;
  gap: 18px;
  grid-column: 1 / -1;
  grid-template-columns: minmax(220px, .8fr) repeat(2, minmax(0, 1fr));
  padding: 16px;
  border: 1px solid #e3ddd8;
  border-radius: 12px;
  background: #faf8f6;
}

.production-portal-party,
.production-portal-supplier label {
  display: grid;
  gap: 7px;
}

.production-portal-party > span {
  color: var(--muted);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.production-portal-party > small,
.production-portal-supplier label > small {
  color: var(--muted);
  font-weight: 500;
}

.production-portal-delivery label {
  display: grid;
  gap: 7px;
}

.production-portal-delivery label > small {
  color: var(--muted);
  font-weight: 500;
}

.production-portal-members {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  min-width: 0;
}

.production-portal-display {
  background: #faf8f6;
  border: 1px solid #e3ddd8;
  border-radius: 12px;
  display: grid;
  gap: 10px;
  grid-column: 1 / -1;
  margin: 0;
  padding: 14px 16px 16px;
}

.production-portal-display legend {
  font-weight: 800;
  padding: 0 5px;
}

.production-portal-display > p {
  color: var(--muted);
  margin: 0;
}

.production-portal-display > div {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 20px;
}

.production-portal-display label {
  align-items: center;
  display: flex;
  gap: 8px;
  margin: 0;
}

.production-portal-empty {
  padding: 14px 16px;
  border: 1px solid #e3ddd8;
  border-radius: 12px;
  background: #faf8f6;
}

.production-portal-empty p,
.production-portal-empty ol {
  margin: 0;
}

.production-portal-empty ol {
  padding: 8px 0 0 22px;
}

.coordination-create-form {
  display: grid;
  gap: 22px;
}

.coordination-create-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: minmax(280px, .75fr) minmax(420px, 1.25fr);
}

.coordination-create-lead {
  display: grid;
  font-weight: 800;
  gap: 7px;
  margin: 18px 0;
}

.coordination-create-members {
  border: 0;
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
}

.coordination-create-members label span,
.coordination-create-task-main span {
  display: grid;
  gap: 2px;
}

.coordination-create-members small,
.coordination-create-tasks small {
  color: var(--muted);
}

.coordination-create-tasks {
  display: grid;
  gap: 9px;
  margin-top: 16px;
}

.coordination-create-tasks article {
  align-items: center;
  border: 1px solid #e1dbd6;
  border-radius: 10px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 12px;
}

.coordination-create-task-portal {
  color: #14713f;
  flex: 0 0 auto;
  font-size: .84rem;
  font-weight: 800;
}

.coordination-create-actions {
  justify-content: flex-end;
}

.coordination-task.is-done {
  background: #eef8f1;
  border-color: #bfe0ca;
}

.coordination-task-index {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #f0ece8;
  font-weight: 800;
}

.coordination-task.is-done .coordination-task-index {
  color: white;
  background: #17844c;
}

.coordination-task-comments {
  border-top: 1px solid #e7e1dc;
  display: grid;
  gap: 10px;
  grid-column: 2 / -1;
  margin-top: 2px;
  padding-top: 10px;
}

.coordination-task-comment-list {
  display: grid;
  gap: 7px;
}

.coordination-task-comment-list article {
  background: #f7f5f2;
  border-radius: 8px;
  padding: 9px 11px;
}

.coordination-task-comment-list p,
.coordination-task-comment-list small {
  margin: 0;
}

.coordination-task-comment-list p {
  white-space: pre-wrap;
}

.coordination-task-comment-list small {
  color: var(--muted);
}

.coordination-task-comment-form {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.coordination-task-comment-form textarea {
  min-height: 58px;
  resize: vertical;
}

.coordination-task div,
.coordination-recipient {
  display: grid;
  gap: 3px;
}

.coordination-unsaved-message {
  align-items: center;
  color: #9f1717;
  display: flex;
  font-size: 0.82rem;
  font-weight: 700;
  gap: 0.45rem;
  justify-content: center;
  margin: 0.65rem 0 0;
}

.coordination-unsaved-message[hidden] {
  display: none;
}

.coordination-unsaved-message span {
  background: #bd1515;
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(189, 21, 21, 0.1);
  height: 0.48rem;
  width: 0.48rem;
}

.coordination-communication-form {
  display: grid;
  grid-template-columns: 150px 130px minmax(200px, 1fr) auto;
  gap: 9px;
  margin-bottom: 16px;
}

.coordination-communication-list article {
  padding: 12px 14px;
  background: #f8f6f4;
  border-radius: 9px;
}

.coordination-communication-list p {
  margin: 5px 0;
}

.coordination-recipient {
  padding: 12px;
  margin: 13px 0;
  background: #f7f3ef;
  border-radius: 9px;
  overflow-wrap: anywhere;
}

.coordination-assets-panel {
  border-top: 4px solid #17844c;
}

.work-order-item-assets {
  background: #fbfdfb;
  border: 1px solid #c9e1d0;
  border-top: 4px solid #17844c;
  border-radius: 10px;
  overflow: hidden;
}

.work-order-item-assets > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  list-style: none;
  padding: 13px 15px;
}

.work-order-item-assets > summary::-webkit-details-marker {
  display: none;
}

.work-order-item-assets > summary > span:first-child {
  display: grid;
  gap: 3px;
}

.work-order-item-assets > summary > span:first-child::before {
  color: #14713f;
  content: "▸";
  font-size: 0.9rem;
  grid-column: 1;
  grid-row: 1 / span 2;
  margin-right: 8px;
}

.work-order-item-assets[open] > summary > span:first-child::before {
  content: "▾";
}

.work-order-item-assets > summary strong,
.work-order-item-assets > summary small {
  grid-column: 2;
}

.work-order-item-assets > summary small {
  color: var(--muted);
}

.work-order-item-assets-body {
  border-top: 1px solid #d8e7dc;
  padding: 0 15px 15px;
}

.coordination-assets-count {
  background: #eaf6ee;
  border: 1px solid #c5e2ce;
  border-radius: 999px;
  color: #14713f;
  font-size: 0.82rem;
  font-weight: 800;
  padding: 7px 11px;
}

.coordination-asset-placeholder {
  align-items: center;
  background: white;
  border-top: 1px solid #d8e7dc;
  display: grid;
  gap: 5px;
  min-height: 130px;
  padding: 24px;
  text-align: center;
}

.coordination-asset-placeholder span {
  color: var(--muted);
}

.coordination-asset-upload {
  display: grid;
  gap: 14px;
  margin: 18px 0;
}

.coordination-asset-dropzone {
  align-items: center;
  background: #f7fbf8;
  border: 2px dashed #b8d7c1;
  border-radius: 12px;
  cursor: pointer;
  display: grid;
  gap: 4px;
  justify-items: center;
  min-height: 126px;
  padding: 24px;
  position: relative;
  text-align: center;
  transition: background 120ms ease, border-color 120ms ease;
}

.coordination-asset-dropzone:hover,
.coordination-asset-dropzone.is-dragging {
  background: #edf8f0;
  border-color: #17844c;
}

.coordination-asset-dropzone.has-files {
  border-style: solid;
}

.coordination-asset-dropzone input[type="file"] {
  cursor: pointer;
  inset: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
}

.coordination-asset-dropzone span {
  color: var(--muted);
  font-size: 0.84rem;
}

.coordination-asset-fields {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: 180px minmax(240px, 1fr) auto;
}

.coordination-asset-fields > label {
  display: grid;
  font-weight: 700;
  gap: 6px;
}

.coordination-upload-progress {
  background: #f7fbf8;
  border: 1px solid #c5dfcd;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  padding: 11px 13px;
}

.coordination-upload-progress[hidden] {
  display: none;
}

.coordination-upload-progress-copy {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.coordination-upload-progress-copy span {
  color: var(--muted);
  font-size: 0.82rem;
}

.coordination-upload-progress-track {
  background: #dcebe1;
  border-radius: 999px;
  height: 9px;
  overflow: hidden;
}

.coordination-upload-progress-track > span {
  background: #17844c;
  border-radius: inherit;
  display: block;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 120ms ease;
  width: 100%;
}

.coordination-upload-progress.is-error {
  background: #fff5f4;
  border-color: #e4b8b5;
}

.coordination-upload-progress.is-error .coordination-upload-progress-track > span {
  background: var(--accent);
}

.coordination-asset-upload.is-uploading .coordination-asset-dropzone {
  cursor: wait;
  opacity: 0.72;
}

.coordination-asset-list {
  display: grid;
  gap: 9px;
}

.coordination-asset-row {
  align-items: center;
  border: 1px solid #ded8d3;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  padding: 11px;
}

.coordination-asset-row.is-older {
  background: #f7f5f3;
  opacity: 0.72;
}

.coordination-asset-file-icon {
  align-items: center;
  background: #eaf6ee;
  border-radius: 8px;
  color: #14713f;
  display: flex;
  font-size: 0.7rem;
  font-weight: 900;
  height: 42px;
  justify-content: center;
  overflow: hidden;
  padding: 4px;
  text-align: center;
}

.coordination-asset-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.coordination-asset-copy small {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coordination-asset-title-line,
.coordination-asset-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.coordination-asset-title-line > span {
  background: #f1eeeb;
  border-radius: 999px;
  color: #655f5b;
  font-size: 0.7rem;
  font-weight: 800;
  padding: 3px 7px;
}

.coordination-asset-actions {
  justify-content: flex-end;
}

.coordination-asset-actions form {
  margin: 0;
}

.coordination-asset-delete {
  color: #a31919;
}

.button-full {
  width: 100%;
  justify-content: center;
  margin-top: 8px;
}

.coordination-email-dialog {
  width: min(620px, calc(100vw - 32px));
  border: 0;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 24px 70px #0004;
}

.coordination-email-dialog::backdrop {
  background: #211d1999;
}

.coordination-email-dialog form {
  display: grid;
  gap: 12px;
}

@media (max-width: 1050px) {
  .coordination-layout { grid-template-columns: 1fr; }
  .coordination-sidebar { position: static; }
  .coordination-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .coordination-asset-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .coordination-create-grid { grid-template-columns: 1fr; }
  .coordination-task-create { grid-template-columns: 1fr 1fr; }
  .production-portal-assignment,
  .production-portal-supplier,
  .production-portal-delivery { grid-template-columns: 1fr; align-items: stretch; }
}

@media (max-width: 720px) {
  .coordination-start-card,
  .customer-order-next-step,
  .coordination-contact-grid { grid-template-columns: 1fr; display: grid; }
  .coordination-summary-grid { grid-template-columns: 1fr; }
  .coordination-communication-form { grid-template-columns: 1fr; }
  .coordination-task { grid-template-columns: 34px 1fr; }
  .coordination-task form { grid-column: 2; }
  .coordination-task-comments { grid-column: 2; }
  .coordination-task-comment-form { grid-template-columns: 1fr; }
  .coordination-task-create { grid-template-columns: 1fr; }
  .coordination-task-create label { grid-column: auto; }
  .coordination-create-tasks article { align-items: flex-start; flex-direction: column; }
  .coordination-asset-fields { grid-template-columns: 1fr; }
  .coordination-upload-progress-copy { align-items: flex-start; flex-direction: column; gap: 2px; }
  .coordination-asset-row { grid-template-columns: 42px minmax(0, 1fr); }
  .coordination-asset-actions { grid-column: 1 / -1; justify-content: flex-start; }
}

/* Tiskovna kalkulacija: zajednički radni prostor i optimizirani tab Osnovno. */
.calculation-editor-subtitle {
  margin: 6px 0 0;
}

.calculation-editor {
  grid-template-columns: minmax(0, 1fr);
  padding-bottom: 88px;
}

.calculation-sticky-workspace {
  position: sticky;
  top: 10px;
  z-index: 35;
}

.calculation-finance-strip {
  align-items: stretch;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  box-shadow: var(--shadow-subtle);
  display: grid;
  grid-template-columns: minmax(240px, 1.35fr) repeat(4, minmax(112px, 0.7fr)) minmax(92px, auto);
  min-width: 0;
  position: relative;
}

.calculation-finance-title,
.calculation-finance-metric {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 11px 14px;
}

.calculation-finance-title {
  background: linear-gradient(135deg, rgba(164, 19, 19, 0.07), rgba(255, 255, 255, 0));
}

.calculation-finance-title span,
.calculation-finance-metric span,
.calculation-finance-details-grid span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.calculation-finance-title strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calculation-finance-metric {
  border-left: 1px solid var(--line-soft);
}

.calculation-finance-metric strong {
  color: var(--accent-dark);
  font-size: 17px;
  white-space: nowrap;
}

.calculation-finance-metric.is-primary {
  background: var(--accent-soft);
}

.calculation-finance-details-toggle {
  align-items: center;
  background: #fff;
  border: 0;
  border-left: 1px solid var(--line-soft);
  color: var(--accent-dark);
  cursor: pointer;
  display: flex;
  font-weight: 800;
  justify-content: center;
  list-style: none;
  padding: 11px 14px;
}

.calculation-finance-details-toggle:hover,
.calculation-finance-details-toggle:focus-visible {
  background: var(--accent-soft);
  outline: 0;
}

.calculation-finance-details-toggle::after {
  content: " +";
}

.calculation-finance-details-toggle[aria-expanded="true"]::after {
  content: " −";
}

.calculation-finance-details-grid {
  background: #fff;
  border-left: 1px solid var(--line-soft);
  border-right: 1px solid var(--line-soft);
  border-top: 1px solid var(--line-soft);
  display: grid;
  gap: 10px 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 14px;
  width: 100%;
}

.calculation-finance-details-grid[hidden] {
  display: none;
}

.calculation-finance-details-grid div {
  align-items: baseline;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.calculation-finance-details-grid strong {
  text-align: right;
  white-space: nowrap;
}

.calculation-sticky-workspace .calculation-tabs {
  border-color: var(--line-soft);
  border-radius: 0 0 10px 10px;
  box-shadow: var(--shadow-subtle);
}

.calculation-basic-structure {
  align-items: end;
  grid-template-columns: minmax(240px, 1fr) auto minmax(260px, 1.2fr);
}

.calculation-basic-structure .section-hint {
  align-self: center;
  margin: 0;
}

.calculation-editor .calculation-component-card {
  border-radius: 8px;
  display: grid;
  gap: 0;
  overflow: visible;
}

.calculation-editor .calculation-component-card.is-active {
  border-color: var(--button-red);
  box-shadow: inset 4px 0 0 var(--button-red), var(--shadow-subtle);
}

.calculation-editor .calculation-component-card-header {
  display: grid;
  grid-template-columns: minmax(210px, 1.25fr) minmax(260px, 1fr) auto auto;
}

.calculation-component-name {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.calculation-component-name strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calculation-component-inline-summary {
  color: var(--muted);
  font-size: 13px;
  min-width: 0;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calculation-component-body {
  display: grid;
}

.calculation-component-field-group {
  display: grid;
  gap: 13px;
  padding: 18px 20px;
}

.calculation-component-field-group + .calculation-component-field-group {
  border-top: 1px solid var(--line-soft);
}

.calculation-component-field-group h4 {
  color: var(--accent-dark);
  font-size: 13px;
  letter-spacing: 0.025em;
  margin: 0;
  text-transform: uppercase;
}

.calculation-component-identity-grid,
.calculation-component-format-grid,
.calculation-component-production-grid {
  display: grid;
  gap: 14px;
}

.calculation-component-identity-grid {
  grid-template-columns: minmax(260px, 1.5fr) minmax(120px, 0.55fr) minmax(130px, 0.55fr) minmax(150px, 0.65fr);
}

.calculation-component-identity-grid .calculation-field-wide {
  grid-column: auto;
}

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

.calculation-component-production-grid {
  grid-template-columns: minmax(260px, 1.3fr) repeat(2, minmax(180px, 0.8fr));
}

.calculation-component-advanced {
  border-top: 1px dashed var(--line);
  padding-top: 10px;
}

.calculation-component-advanced > summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  list-style: none;
}

.calculation-component-advanced > summary::before {
  content: "+ ";
}

.calculation-component-advanced[open] > summary::before {
  content: "− ";
}

.calculation-component-advanced > .calculation-component-format-grid {
  margin-top: 12px;
}

.calculation-basic-finishing {
  background: #fbfaf8;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 13px;
}

.calculation-basic-finishing-header {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.calculation-basic-finishing-header div {
  display: grid;
  gap: 2px;
}

.calculation-basic-finishing-header small {
  color: var(--muted);
}

.calculation-basic-finishing-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.calculation-basic-finishing-row {
  align-items: center;
  display: flex;
  gap: 6px;
  min-width: min(100%, 300px);
}

.calculation-basic-finishing-row label {
  flex: 1 1 auto;
  min-width: 0;
}

.calculation-basic-finishing-row .combobox-input {
  min-height: 40px;
}

.calculation-basic-finishing-row .button-secondary {
  min-height: 40px;
  padding: 8px 10px;
}

.calculation-component-compact-content {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(120px, 0.72fr)) auto auto;
  padding: 13px 16px;
}

.calculation-component-compact-content > div:not(.calculation-component-name) {
  display: grid;
  gap: 3px;
}

.calculation-component-compact-content > div > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.calculation-component-compact-content > div > strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calculation-component-compact .component-switcher-card {
  display: inline-flex;
  padding: 9px 12px;
}

.calculation-save-dock {
  align-items: center;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--line);
  border-radius: 12px;
  bottom: 18px;
  box-shadow: 0 18px 50px rgba(47, 35, 28, 0.18);
  display: flex;
  max-width: calc(100vw - 32px);
  padding: 9px 10px;
  position: fixed;
  right: 18px;
  z-index: 80;
}

.calculation-save-dock > [hidden],
.calculation-save-dock [hidden] {
  display: none !important;
}

.calculation-save-dock-panel,
.calculation-save-dock-form {
  align-items: center;
  display: flex;
  gap: 9px;
}

.calculation-save-state {
  align-items: center;
  display: flex;
  gap: 9px;
  min-width: 210px;
  padding: 0 8px;
}

.calculation-save-state > span:last-child {
  display: grid;
  gap: 1px;
}

.calculation-save-state small {
  color: var(--muted);
  font-size: 11px;
}

.calculation-save-state-dot {
  background: #8f8883;
  border-radius: 50%;
  height: 10px;
  width: 10px;
}

.calculation-save-state.is-saved .calculation-save-state-dot {
  background: #15915b;
}

.calculation-save-state.is-dirty .calculation-save-state-dot {
  background: #d68a00;
}

.calculation-save-state.is-saving .calculation-save-state-dot {
  animation: calculation-save-pulse 0.9s ease-in-out infinite alternate;
  background: var(--button-red);
}

.coordination-task-comment-list article:target {
  background: #fff7df;
  border-color: #d89a19;
  box-shadow: 0 0 0 3px rgba(216, 154, 25, 0.16);
  scroll-margin-top: 110px;
}

.work-order-view-statuses {
  background: #f7fbf8;
  border: 1px solid #cfe6d8;
  border-radius: 12px;
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  padding: 14px 16px;
}

.work-order-view-statuses > div {
  display: grid;
  gap: 3px;
}

.work-order-view-statuses > div > small,
.work-order-view-statuses li small {
  color: var(--muted);
}

.work-order-view-statuses ul {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.work-order-view-statuses li {
  align-items: center;
  background: #fff;
  border: 1px solid #e4ebe6;
  border-radius: 9px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 10px 12px;
}

.work-order-view-statuses.compact {
  margin: 14px 0;
  padding: 12px;
}

.work-order-view-statuses.compact li {
  align-items: flex-start;
  display: grid;
}

.work-order-view-statuses.compact .work-order-view-status {
  justify-self: start;
  text-align: left;
}

.work-order-view-statuses li > span:first-child {
  display: grid;
  gap: 2px;
}

.work-order-view-status {
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 800;
  padding: 6px 10px;
  text-align: right;
}

.work-order-view-status.is-viewed {
  background: #e2f4e9;
  color: #126b3f;
}

.work-order-view-status.is-pending {
  background: #f4f0ec;
  color: #6f6259;
}

.work-order-view-status time {
  font: inherit;
}

.work-order-email-notification {
  align-items: flex-start;
  background: #fffaf0;
  border: 1px solid #ead7ae;
  border-radius: 12px;
  display: flex;
  gap: 11px;
  grid-column: 1 / -1;
  margin: 0;
  padding: 14px 16px;
}

.work-order-email-notification input {
  flex: 0 0 auto;
  margin-top: 3px;
}

.work-order-email-notification > span {
  display: grid;
  gap: 3px;
}

.work-order-email-notification small {
  color: var(--muted);
}

.work-order-email-notification em {
  font-size: .82rem;
  font-style: normal;
  font-weight: 750;
}

.work-order-email-notification .is-sent {
  color: #126b3f;
}

.work-order-email-notification .is-error {
  color: #9b5a00;
}

.work-order-save-dock .calculation-save-state {
  min-width: 250px;
}

.calculation-save-state.is-error {
  max-width: 360px;
}

.calculation-save-state.is-error .calculation-save-state-dot {
  background: var(--button-red);
}

.calculation-save-state.is-error strong,
.calculation-save-state.is-error small {
  color: var(--button-red);
}

@keyframes calculation-save-pulse {
  to { opacity: 0.35; }
}

@media (max-width: 1280px) {
  .calculation-finance-strip {
    grid-template-columns: minmax(220px, 1.2fr) repeat(4, minmax(105px, 0.7fr)) minmax(80px, auto);
  }

  .calculation-component-identity-grid {
    grid-template-columns: minmax(240px, 1.4fr) repeat(3, minmax(112px, 0.6fr));
  }

  .calculation-component-compact-content {
    grid-template-columns: minmax(210px, 1.3fr) repeat(3, minmax(110px, 0.7fr)) auto auto;
  }

  .calculation-component-compact-content > div:nth-of-type(5) {
    display: none;
  }
}

@media (max-width: 1050px) {
  .calculation-sticky-workspace {
    top: 4px;
  }

  .calculation-finance-strip {
    grid-template-columns: repeat(4, minmax(110px, 1fr)) minmax(80px, auto);
  }

  .calculation-finance-title {
    grid-column: 1 / -1;
  }

  .calculation-basic-structure,
  .calculation-component-identity-grid,
  .calculation-component-production-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calculation-basic-structure .section-hint,
  .calculation-component-identity-grid .calculation-field-wide {
    grid-column: 1 / -1;
  }

  .calculation-editor .calculation-component-card-header {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }

  .calculation-component-inline-summary {
    display: none;
  }

  .calculation-component-compact-content {
    grid-template-columns: minmax(200px, 1.25fr) repeat(2, minmax(105px, 0.7fr)) auto auto;
  }

  .calculation-component-compact-content > div:nth-of-type(4) {
    display: none;
  }
}

@media (max-width: 760px) {
  .calculation-finance-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calculation-finance-title,
  .calculation-finance-details-toggle {
    grid-column: 1 / -1;
  }

  .calculation-finance-metric {
    border-top: 1px solid var(--line-soft);
  }

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

  .calculation-tabs {
    display: flex;
    overflow-x: auto;
  }

  .calculation-tabs a {
    flex: 0 0 auto;
    font-size: 14px;
    min-height: 52px;
    min-width: 132px;
    padding: 14px 12px 11px;
  }

  .calculation-basic-structure,
  .calculation-component-identity-grid,
  .calculation-component-format-grid,
  .calculation-component-production-grid {
    grid-template-columns: 1fr;
  }

  .calculation-basic-structure .section-hint,
  .calculation-component-identity-grid .calculation-field-wide {
    grid-column: auto;
  }

  .calculation-component-compact-content {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }

  .calculation-component-compact-content > div:not(.calculation-component-name) {
    display: none;
  }

  .calculation-save-dock {
    bottom: 8px;
    left: 8px;
    right: 8px;
  }

  .calculation-save-dock-panel,
  .calculation-save-dock-form {
    flex: 1 1 auto;
    width: 100%;
  }

  .calculation-save-state {
    min-width: 0;
  }

  .calculation-save-state small,
  .calculation-save-dock-form > .button-secondary {
    display: none;
  }

  .calculation-save-dock-form > .button-primary {
    margin-left: auto;
  }
}

.numbering-plan-card {
  display: grid;
  gap: 18px;
  margin-top: 18px;
  padding: 20px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--warning, #b7791f);
  border-radius: 12px;
  background: var(--surface);
}

.numbering-plan-card.is-ready {
  border-left-color: #15803d;
}

.numbering-plan-card.is-invalid {
  border-left-color: #b91c1c;
}

.numbering-plan-form-grid,
.numbering-field-grid,
.numbering-plan-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.field-label-with-help {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  width: fit-content;
}

.field-help {
  align-items: center;
  background: #f4e8e6;
  border: 1px solid #d9b7b2;
  border-radius: 50%;
  color: var(--accent-dark);
  cursor: help;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  height: 18px;
  justify-content: center;
  line-height: 1;
  outline: none;
  position: relative;
  width: 18px;
}

.field-help:focus-visible {
  box-shadow: 0 0 0 3px rgba(164, 19, 19, 0.18);
}

.field-help-tooltip {
  background: #241b18;
  border-radius: 7px;
  bottom: auto;
  box-shadow: 0 8px 24px rgba(36, 27, 24, 0.2);
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  left: 50%;
  line-height: 1.4;
  max-width: min(180px, calc(100vw - 32px));
  opacity: 0;
  padding: 8px 10px;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 8px);
  transform: translate(-50%, 4px);
  transition: opacity 120ms ease 420ms, transform 120ms ease 420ms;
  visibility: hidden;
  white-space: normal;
  width: 180px;
  z-index: 30;
}

.field-help:hover .field-help-tooltip,
.field-help:focus .field-help-tooltip,
.field-help:focus-within .field-help-tooltip {
  opacity: 1;
  transform: translate(-50%, 0);
  visibility: visible;
}

.numbering-count-formula {
  background: #f3faf5;
  border-left: 3px solid #15803d;
  color: #245b35;
  margin: 0;
  padding: 10px 12px;
}

.numbering-field-editor {
  display: grid;
  gap: 10px;
}

.numbering-position-workspace {
  display: grid;
  grid-template-columns: minmax(320px, 0.85fr) minmax(380px, 1.15fr);
  gap: 18px;
  align-items: start;
}

.numbering-position-workspace .numbering-field-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.numbering-position-preview {
  position: sticky;
  top: 76px;
  z-index: 4;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 10px 30px rgba(51, 35, 25, 0.08);
}

.numbering-position-preview-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.numbering-position-preview-heading > div {
  display: grid;
  gap: 3px;
}

.numbering-position-preview-heading span {
  color: var(--muted);
  font-size: 0.84rem;
}

.numbering-field-editor h4 {
  margin: 0;
}

.numbering-field-grid article,
.numbering-plan-summary article,
.numbering-pass-card {
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: var(--surface-muted);
}

.numbering-field-grid article {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.numbering-plan-summary article {
  display: grid;
  gap: 4px;
  padding: 12px;
}

.numbering-plan-summary span,
.numbering-pass-heading span {
  color: var(--muted);
  font-size: 0.88rem;
}

.numbering-confirmations,
.numbering-plan-messages,
.numbering-pass-list {
  display: grid;
  gap: 10px;
}

.numbering-pass-card {
  padding: 14px;
}

.numbering-pass-heading {
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
}

.numbering-pass-heading > div {
  display: grid;
  gap: 3px;
}

.numbering-pass-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(360px, 1.2fr);
  gap: 16px;
  align-items: start;
}

.numbering-preview-stage {
  min-width: 0;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
}

.numbering-preview-stage svg {
  display: block;
  width: 100%;
  max-height: 440px;
}

.numbering-preview-stage.is-interactive {
  touch-action: none;
  user-select: none;
}

.numbering-head-drag-handle {
  cursor: grab;
  outline: none;
  touch-action: none;
}

.numbering-head-drag-handle:active {
  cursor: grabbing;
}

.numbering-head-drag-handle:focus-visible .numbering-head-marker {
  stroke: #111827;
  stroke-width: 4;
}

.numbering-head-marker {
  fill: #a41313;
  stroke: #fff;
  stroke-width: 2;
}

.numbering-head-label {
  fill: #fff;
  font-family: Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  dominant-baseline: central;
  text-anchor: middle;
  pointer-events: none;
}

.numbering-spacing-feedback {
  margin: 0;
  padding: 9px 10px;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 700;
}

.numbering-spacing-feedback.is-safe {
  color: #166534;
  background: #ecfdf3;
}

.numbering-spacing-feedback.is-conflict {
  color: #991b1b;
  background: #fef2f2;
}

.numbering-plan-card .warning-text {
  margin: 0;
  color: #9a5b00;
}

.numbering-plan-card .form-error {
  margin: 0;
  color: #b91c1c;
  font-weight: 700;
}

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

  .numbering-pass-layout {
    grid-template-columns: 1fr;
  }

  .numbering-position-workspace {
    grid-template-columns: 1fr;
  }

  .numbering-position-preview {
    order: -1;
    top: 4px;
  }
}

@media (max-width: 720px) {
  .finishing-quantity-panel {
    grid-template-columns: 1fr;
  }

  .finishing-line-summary {
    align-items: start;
    gap: 10px;
    grid-template-columns: 16px minmax(0, 1fr);
    padding: 13px 12px;
  }

  .finishing-line-state {
    grid-column: 2;
    justify-items: start;
    text-align: left;
  }

  .finishing-line-body {
    padding: 12px;
  }

  .finishing-line-body-header {
    align-items: stretch;
    display: grid;
  }

  .finishing-line-body-header .button-secondary {
    width: 100%;
  }

  .numbering-plan-card {
    padding: 14px;
  }

  .numbering-plan-form-grid,
  .numbering-field-grid,
  .numbering-plan-summary {
    grid-template-columns: 1fr;
  }

  .numbering-position-preview {
    margin-inline: -4px;
    padding: 9px;
  }

  .numbering-position-preview .numbering-preview-stage svg {
    max-height: 360px;
  }
}

/* General TODO workspace */
.todo-page-title {
  align-items: flex-end;
}

.todo-title-counts {
  display: flex;
  gap: 8px;
}

.todo-title-counts a {
  align-items: baseline;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  display: flex;
  gap: 6px;
  padding: 9px 12px;
}

.todo-title-counts strong {
  color: var(--accent-dark);
  font-size: 18px;
}

.todo-title-counts span {
  color: var(--muted);
  font-size: 12px;
}

.todo-ai-sync-status {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 5px;
  margin: 8px 0 0;
}

.todo-ai-sync-status > span {
  background: #2f80ed;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgb(47 128 237 / 12%);
  flex: 0 0 auto;
  height: 7px;
  margin-right: 2px;
  width: 7px;
}

.todo-ai-sync-status.is-empty > span {
  background: var(--muted);
  box-shadow: none;
  opacity: 0.5;
}

.todo-ai-sync-status strong {
  color: var(--text);
}

.todo-create-panel {
  margin-bottom: 18px;
  padding: 0;
}

.todo-create-panel > summary {
  color: var(--accent-dark);
  cursor: pointer;
  font-weight: 800;
  list-style-position: inside;
  padding: 16px 18px;
}

.todo-create-panel[open] > summary {
  border-bottom: 1px solid var(--line-soft);
}

.todo-create-form,
.todo-detail-form {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(150px, 1fr));
  padding: 18px;
}

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

.todo-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.todo-field-wide {
  grid-column: span 2;
}

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

.todo-field input,
.todo-field select,
.todo-field textarea,
.todo-filters input,
.todo-filters select {
  width: 100%;
}

.todo-field textarea {
  resize: vertical;
}

.todo-form-actions {
  align-items: end;
  display: flex;
  justify-content: flex-end;
}

.todo-list-panel {
  overflow: hidden;
}

.todo-filters {
  align-items: end;
  border-bottom: 1px solid var(--line-soft);
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(320px, 2fr) minmax(180px, 1fr) repeat(3, minmax(140px, 0.75fr)) auto;
  padding-bottom: 16px;
}

.todo-filters label {
  display: grid;
  gap: 5px;
}

.todo-filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  grid-column: 1 / -1;
}

.todo-filter-tabs a {
  background: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-weight: 750;
  padding: 7px 12px;
}

.todo-filter-tabs a.is-active {
  background: var(--accent-dark);
  border-color: var(--accent-dark);
  color: #fff;
}

.todo-filter-tabs span {
  opacity: 0.8;
}

.todo-list {
  display: grid;
  gap: 10px;
  padding-top: 16px;
}

.todo-card {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  display: grid;
  gap: 0;
  grid-template-columns: 5px minmax(0, 1fr) auto;
  min-width: 0;
  overflow: hidden;
}

.todo-card:hover {
  border-color: var(--line);
  box-shadow: 0 8px 24px rgba(31, 29, 27, 0.06);
}

.todo-card.is-closed {
  opacity: 0.72;
}

.todo-card-marker {
  background: #587aa5;
}

.todo-card.priority-urgent .todo-card-marker { background: #b42318; }
.todo-card.priority-high .todo-card-marker { background: #d97706; }
.todo-card.priority-normal .todo-card-marker { background: #3b6ea8; }
.todo-card.priority-low .todo-card-marker { background: #8a8f98; }

.todo-card-main {
  min-width: 0;
  padding: 14px 16px;
}

.todo-card-main h2 {
  font-size: 16px;
  margin: 7px 0 4px;
}

.todo-card-main h2 a:hover {
  color: var(--accent-dark);
}

.todo-card-main > p {
  color: var(--muted);
  margin: 0 0 9px;
  max-width: 90ch;
}

.todo-card-kickers,
.todo-card-meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}

.todo-priority,
.todo-status,
.todo-source {
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
}

.todo-priority.priority-urgent { background: #fee4e2; color: #912018; }
.todo-priority.priority-high { background: #fff0d8; color: #9a4b05; }
.todo-priority.priority-normal { background: #e8f1fb; color: #2c5c92; }
.todo-priority.priority-low { background: #eef0f2; color: #5f6570; }
.todo-status { background: #f2efe9; color: #5f554a; }
.todo-status.status-done { background: #e5f5ec; color: #17633e; }
.todo-status.status-proposed { background: #f2eafb; color: #694193; }
.todo-source { background: #eef0f2; color: #525965; }

.todo-card-meta {
  color: var(--muted);
  font-size: 12px;
}

.todo-card-meta a {
  color: #315f91;
  font-weight: 700;
}

.todo-card-meta .is-overdue {
  color: #a32318;
  font-weight: 800;
}

.todo-source-context {
  background: #f8f7f4;
  border-left: 3px solid #c8bdd6;
  border-radius: 0 8px 8px 0;
  display: grid;
  gap: 2px;
  margin-top: 10px;
  max-width: 95ch;
  padding: 8px 11px;
}

.todo-source-context span,
.todo-source-context p {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}

.todo-card-actions {
  align-content: center;
  border-left: 1px solid var(--line-soft);
  display: grid;
  gap: 7px;
  min-width: 130px;
  padding: 12px;
}

.todo-card-actions form,
.todo-card-actions button,
.todo-card-actions a {
  width: 100%;
}

.todo-empty-state {
  color: var(--muted);
  padding: 36px 18px;
  text-align: center;
}

.todo-empty-state strong {
  color: var(--text);
  display: block;
  font-size: 17px;
}

.todo-detail-layout {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 0.8fr);
}

.todo-detail-side {
  align-content: start;
  display: grid;
  gap: 18px;
}

.todo-source-quote {
  background: var(--surface-soft);
  border-left: 3px solid #c8bdd6;
  color: var(--muted);
  margin: 12px 0;
  padding: 10px 12px;
}

.todo-ai-reason {
  background: #f4eefb;
  border: 1px solid #ded0ed;
  border-radius: 10px;
  margin-top: 14px;
  padding: 12px;
}

.todo-ai-reason span {
  color: #694193;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.todo-ai-reason p {
  margin: 6px 0;
}

.todo-event-list {
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}

.todo-event-list li {
  border-left: 2px solid var(--line);
  display: grid;
  padding-left: 10px;
}

.todo-event-list span,
.todo-event-list small {
  color: var(--muted);
}

@media (max-width: 1050px) {
  .todo-create-form,
  .todo-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

@media (max-width: 720px) {
  .todo-page-title {
    align-items: stretch;
  }

  .todo-title-counts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .todo-title-counts a {
    align-items: flex-start;
    display: grid;
  }

  .todo-create-form,
  .todo-detail-form,
  .todo-filters {
    grid-template-columns: 1fr;
  }

  .todo-field-wide,
  .todo-field-full,
  .todo-filter-tabs {
    grid-column: 1;
  }

  .todo-card {
    grid-template-columns: 5px minmax(0, 1fr);
  }

  .todo-card-actions {
    border-left: 0;
    border-top: 1px solid var(--line-soft);
    grid-column: 2;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .job-calculation-coverage-row {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .job-calculation-coverage-action .button-primary,
  .job-calculation-coverage-action .button-secondary {
    text-align: center;
    width: 100%;
  }

  .calculation-request-status {
    align-items: flex-start;
  }
}

/* Job command center: compact workflow and progressive disclosure. */
.calculation-job-context-heading {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.calculation-job-context-heading small {
  color: var(--context-color);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: 0.03em;
  line-height: 1;
  text-transform: uppercase;
}

.calculation-job-context-card.is-active {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--context-color) 34%, transparent);
}

.calculation-job-context-card.is-complete .calculation-job-context-count {
  background: var(--context-color);
  color: #fff;
}

.calculation-job-context-card.is-skipped {
  opacity: 0.72;
}

.calculation-job-context-count:is(a):hover,
.calculation-job-context-count:is(a):focus-visible {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--context-color);
}

.job-items-panel {
  padding: 0;
  scroll-margin-top: 16px;
}

.job-items-header {
  margin: 0;
  padding: 18px 20px;
}

.job-items-list {
  border-top: 1px solid var(--line);
  display: grid;
}

.job-item-row {
  align-items: center;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, 1fr) minmax(150px, auto);
  min-width: 0;
  padding: 18px 20px 18px 24px;
  position: relative;
  scroll-margin-top: 16px;
}

.job-item-row + .job-item-row {
  border-top: 1px solid var(--line);
}

.job-item-row::before {
  background: var(--muted);
  content: "";
  inset: 14px auto 14px 0;
  position: absolute;
  width: 4px;
}

.job-item-row.is-covered::before {
  background: #2f7d59;
}

.job-item-row.is-missing {
  background: linear-gradient(90deg, rgba(180, 25, 25, 0.04), transparent 32%);
}

.job-item-row.is-missing::before {
  background: var(--red);
}

.job-item-main,
.job-item-calculation {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.job-item-kicker,
.job-item-calculation > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.job-item-main h3 {
  font-size: 16px;
  line-height: 1.25;
  margin: 0;
}

.job-item-main > p,
.job-item-calculation > small {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}

.job-item-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 4px;
}

.job-item-facts > span {
  background: #f4f0ec;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  display: grid;
  gap: 1px;
  min-width: 88px;
  padding: 5px 8px;
}

.job-item-facts small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.job-item-facts strong {
  font-size: 11px;
  line-height: 1.25;
}

.job-item-calculation {
  border-left: 1px solid var(--line);
  padding-left: 18px;
}

.job-item-calculation > strong {
  font-size: 14px;
}

.job-item-calculation-meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.job-item-calculation-meta b {
  font-size: 13px;
}

.job-item-financial-grid {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(3, minmax(92px, 1fr));
  margin-top: 3px;
}

.job-item-financial-grid > span {
  background: #f7f3ef;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 6px 7px;
}

.job-item-financial-grid small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  text-transform: uppercase;
}

.job-item-financial-grid strong {
  font-size: 11px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.job-item-financial-grid em {
  color: #236345;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
}

.job-item-financial-grid .is-profit {
  background: #f3faf6;
  border-color: rgba(47, 125, 89, 0.24);
}

.job-item-financial-grid .is-profit strong {
  color: #236345;
}

.job-item-action {
  justify-self: end;
}

.job-item-action .button-secondary {
  min-width: 148px;
  text-align: center;
}

.job-collapsible-panel {
  padding: 0;
  scroll-margin-top: 16px;
}

.job-collapsible-details,
.job-sidebar-more-actions {
  margin: 0;
}

.job-collapsible-summary,
.job-sidebar-more-actions > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  list-style: none;
  padding: 15px 18px;
}

.job-collapsible-summary::-webkit-details-marker,
.job-sidebar-more-actions > summary::-webkit-details-marker {
  display: none;
}

.job-collapsible-summary > span:first-child {
  display: grid;
  gap: 3px;
}

.job-collapsible-summary strong {
  color: var(--text);
  font-size: 14px;
}

.job-collapsible-summary small {
  color: var(--muted);
  font-size: 11px;
}

.job-collapsible-toggle {
  color: var(--red);
  font-size: 11px;
  font-weight: 850;
}

.job-collapsible-details[open] .job-collapsible-toggle::before {
  content: "Sakrij";
}

.job-collapsible-details[open] .job-collapsible-toggle {
  font-size: 0;
}

.job-collapsible-details[open] .job-collapsible-toggle::before {
  font-size: 11px;
}

.job-collapsible-content {
  border-top: 1px solid var(--line);
  padding: 18px;
}

.job-documents-collapsible-content {
  overflow-x: auto;
  padding: 0;
}

.job-documents-collapsible-content .job-documents-unified {
  margin: 0;
}

.job-save-panel {
  display: grid;
  gap: 10px;
}

.job-sidebar-more-actions {
  border-top: 1px solid var(--line);
  padding-top: 2px;
}

.job-sidebar-more-actions > summary {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  padding: 9px 2px;
}

.job-sidebar-more-actions[open] > summary {
  color: var(--red);
}

.job-sidebar-more-actions .detail-action-buttons,
.job-sidebar-more-actions .form-actions {
  margin-top: 8px;
}

@media (max-width: 1120px) {
  .job-item-row {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.85fr);
  }

  .job-item-action {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .job-item-action .button-secondary {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .job-items-header,
  .job-item-row {
    padding-left: 14px;
    padding-right: 14px;
  }

  .job-item-row {
    align-items: stretch;
    gap: 14px;
    grid-template-columns: 1fr;
  }

  .job-item-calculation {
    border-left: 0;
    border-top: 1px solid var(--line);
    padding-left: 0;
    padding-top: 12px;
  }

  .job-item-financial-grid {
    grid-template-columns: 1fr;
  }

  .job-item-action {
    grid-column: auto;
  }

  .job-collapsible-content {
    padding: 14px;
  }
}

/* Dodavanje klijenta bez napuštanja otvorenog obrasca. */
.inline-client-field { display: flex; align-items: center; gap: 8px; min-width: 0; }
.inline-client-field > .combobox, .inline-client-field > select { flex: 1; min-width: 0; }
.inline-client-add { flex: 0 0 auto; white-space: nowrap; }
.inline-client-dialog { width: min(640px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; border: 1px solid #ddd2cb; border-radius: 12px; padding: 24px; color: #25211f; background: #fff; }
.inline-client-dialog::backdrop { background: rgb(25 20 18 / 45%); }
.inline-client-dialog [hidden] { display: none !important; }
.inline-client-dialog h2 { margin-top: 0; }
.inline-client-dialog [data-inline-client-error] { color: #a41111; }
@media (max-width: 600px) {
  .inline-client-field { flex-wrap: wrap; }
  .inline-client-field > .combobox, .inline-client-field > select { flex-basis: 100%; }
  .inline-client-add { order: -1; }
  .inline-client-dialog { padding: 18px; }
  .inline-client-dialog .form-grid { grid-template-columns: 1fr; }
  .inline-client-dialog .form-actions { flex-wrap: wrap; }
  .inline-client-dialog .form-actions button { flex: 1 1 100%; }
}

/* Compact document navigation used only on the job detail. */
.job-document-strip { margin-bottom: 18px; }
.job-document-strip-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.job-document-strip-row { display: grid; grid-template-columns: minmax(90px, .65fr) minmax(0, 1fr) auto; align-items: start; gap: 10px; border-top: 1px solid var(--line-soft); padding: 11px 0; min-width: 0; }
.job-document-strip-row h3 { margin: 0; font-size: 13px; line-height: 1.5; }
.job-document-strip-row h3 a { color: inherit; text-decoration: none; }
.job-document-strip-row h3 small { display: block; font-weight: normal; color: var(--muted); }
.job-document-strip-links { display: grid; gap: 6px; min-width: 0; }
.job-document-strip-links a { overflow-wrap: anywhere; }
.job-document-strip-links summary, .job-description-panel summary { cursor: pointer; color: var(--accent); font-size: 13px; font-weight: 600; }
.job-document-strip-links details a { display: block; margin-top: 7px; }
.job-document-strip-action { background: none; border: 0; padding: 0; color: var(--accent); font: inherit; font-size: 12px; text-decoration: none; cursor: pointer; }
.job-document-strip-action:disabled { color: var(--muted); cursor: default; }
.job-document-strip-action:hover:not(:disabled) { text-decoration: underline; }
.job-description-preview { margin: 0 0 12px; overflow-wrap: anywhere; }
.job-description-full { margin-top: 12px; overflow-wrap: anywhere; }
@media (max-width: 900px) { .job-document-strip-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) {
 .job-document-strip-row { grid-template-columns: minmax(80px, .6fr) minmax(0, 1fr); }
 .job-document-strip-action, .job-document-strip-row > form { grid-column: 2; justify-self: start; }
}

@media (min-width: 901px) and (max-width: 1200px) { .job-command-overview-grid { grid-template-columns: minmax(0, 1fr); } }

.offer-document-text { border-top: 1px solid var(--line-soft); padding-top: 12px; }
.offer-document-text > summary { cursor: pointer; color: var(--accent); font-size: 14px; font-weight: 600; }
.offer-document-text[open] > summary { margin-bottom: 14px; }
.offer-document-text > label { display: grid; gap: 5px; margin-bottom: 12px; }
.manual-offer-history[hidden], [data-offer-previous-count][hidden] { display: none; }

.offer-form-simple { grid-template-columns: minmax(0, 1fr); }
.offer-form-simple > .job-side-column { position: static; justify-self: end; width: min(100%, 320px); }

/* Client detail: business overview first, occasional settings on demand. */
.client-settings { display: grid; gap: 12px; margin-top: 24px; }
.client-settings > h2 { margin: 0; }
.client-setting > summary { cursor: pointer; font-weight: 700; }
.client-setting-body { margin-top: 20px; }
.client-notice { margin-bottom: 20px; }
.client-notice p { margin-bottom: 0; white-space: pre-wrap; }

/* Final formats after shared press-sheet processing. */
.final-cut-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.final-cut-input-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 12px 0; }
.final-cut-plan { min-width: 0; padding: 14px; }
.final-cut-svg { width: 100%; height: 260px; }
@media (max-width: 800px) { .final-cut-plan-grid { grid-template-columns: 1fr; } }

.mobile-app-bar {
  display: none;
}

@media (max-width: 760px) {
  .mobile-app-bar {
    align-items: center;
    background: #fbfaf8;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 12px;
    height: 58px;
    justify-content: space-between;
    left: 0;
    padding: 0 12px;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 30;
  }

  .mobile-app-bar a {
    color: inherit;
    font-weight: 700;
  }

  .mobile-app-bar button {
    min-height: 44px;
  }

  .app-sidebar,
  .app-sidebar:hover,
  .sidebar-pinned .app-sidebar {
    display: none;
    flex-direction: column;
    gap: 8px;
    height: auto;
    max-height: calc(100dvh - 58px);
    overflow: auto;
    overscroll-behavior: contain;
    padding: 10px 12px max(10px, env(safe-area-inset-bottom));
    top: 58px;
  }

  .mobile-menu-open .app-sidebar {
    display: flex;
  }

  .app-sidebar .sidebar-top {
    display: none;
  }

  .app-sidebar .sidebar-nav,
  .app-sidebar .sidebar-user {
    align-self: stretch;
    display: grid;
    flex: none;
    grid-auto-rows: minmax(44px, auto);
    overflow: visible;
  }

  .app-sidebar .sidebar-link {
    grid-template-columns: 40px minmax(0, 1fr);
    min-height: 44px;
    padding-right: 10px;
  }

  .app-sidebar .sidebar-link:has(.sidebar-count-badge) {
    grid-template-columns: 40px minmax(0, 1fr) auto;
  }

  .app-sidebar .sidebar-link .sidebar-label {
    display: block;
    opacity: 1;
  }
}