/* Subset: Cyrillic */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	src: local("IBM Plex Sans"), local("IBMPlexSans"), url("/assets/IBMPlexSans-Regular-Cyrillic-C5X9L19Z.woff2") format("woff2");
	unicode-range: U+0400-045F, U+0462-0463, U+046A-046B, U+0472-0475, U+0490-04C2, U+04CF-04D9, U+04DC-04E9, U+04EE-04F9, U+0524-0525
}
/* Subset: Greek */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	src: local("IBM Plex Sans"), local("IBMPlexSans"), url("/assets/IBMPlexSans-Regular-Greek-DUFCzuy2.woff2") format("woff2");
	unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE
}
/* Subset: Latin1 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	src: local("IBM Plex Sans"), local("IBMPlexSans"), url("/assets/IBMPlexSans-Regular-Latin1-BUjEsRx4.woff2") format("woff2");
	unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02
}
/* Subset: Latin2 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	src: local("IBM Plex Sans"), local("IBMPlexSans"), url("/assets/IBMPlexSans-Regular-Latin2-DVrf9P05.woff2") format("woff2");
	unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF
}
/* Subset: Latin3 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	src: local("IBM Plex Sans"), local("IBMPlexSans"), url("/assets/IBMPlexSans-Regular-Latin3-B7f3PIUA.woff2") format("woff2");
	unicode-range: U+0102-0103, U+01CD-01DC, U+1EA0-1EF9, U+20AB
}
/* Subset: Pi */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	src: local("IBM Plex Sans"), local("IBMPlexSans"), url("/assets/IBMPlexSans-Regular-Pi-CkmElvWW.woff2") format("woff2");
	unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD
}
/* Subset: Cyrillic */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 500;
	src: local("IBM Plex Sans Medm"), local("IBMPlexSans-Medm"), url("/assets/IBMPlexSans-Medium-Cyrillic-BeQhuxaN.woff2") format("woff2");
	unicode-range: U+0400-045F, U+0462-0463, U+046A-046B, U+0472-0475, U+0490-04C2, U+04CF-04D9, U+04DC-04E9, U+04EE-04F9, U+0524-0525
}
/* Subset: Greek */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 500;
	src: local("IBM Plex Sans Medm"), local("IBMPlexSans-Medm"), url("/assets/IBMPlexSans-Medium-Greek-D5pQRu7O.woff2") format("woff2");
	unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE
}
/* Subset: Latin1 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 500;
	src: local("IBM Plex Sans Medm"), local("IBMPlexSans-Medm"), url("/assets/IBMPlexSans-Medium-Latin1-B2CuUu4P.woff2") format("woff2");
	unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02
}
/* Subset: Latin2 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 500;
	src: local("IBM Plex Sans Medm"), local("IBMPlexSans-Medm"), url("/assets/IBMPlexSans-Medium-Latin2-2D3n_XVv.woff2") format("woff2");
	unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF
}
/* Subset: Latin3 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 500;
	src: local("IBM Plex Sans Medm"), local("IBMPlexSans-Medm"), url("/assets/IBMPlexSans-Medium-Latin3-Ckmkfk4j.woff2") format("woff2");
	unicode-range: U+0102-0103, U+01CD-01DC, U+1EA0-1EF9, U+20AB
}
/* Subset: Pi */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 500;
	src: local("IBM Plex Sans Medm"), local("IBMPlexSans-Medm"), url("/assets/IBMPlexSans-Medium-Pi-ZL5WuB4_.woff2") format("woff2");
	unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD
}
/* Subset: Cyrillic */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 600;
	src: local("IBM Plex Sans SmBld"), local("IBMPlexSans-SmBld"), url("/assets/IBMPlexSans-SemiBold-Cyrillic-92PWFvQi.woff2") format("woff2");
	unicode-range: U+0400-045F, U+0462-0463, U+046A-046B, U+0472-0475, U+0490-04C2, U+04CF-04D9, U+04DC-04E9, U+04EE-04F9, U+0524-0525
}
/* Subset: Greek */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 600;
	src: local("IBM Plex Sans SmBld"), local("IBMPlexSans-SmBld"), url("/assets/IBMPlexSans-SemiBold-Greek-D_DqphAc.woff2") format("woff2");
	unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE
}
/* Subset: Latin1 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 600;
	src: local("IBM Plex Sans SmBld"), local("IBMPlexSans-SmBld"), url("/assets/IBMPlexSans-SemiBold-Latin1-CIhZjzyK.woff2") format("woff2");
	unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02
}
/* Subset: Latin2 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 600;
	src: local("IBM Plex Sans SmBld"), local("IBMPlexSans-SmBld"), url("/assets/IBMPlexSans-SemiBold-Latin2-B0f1M9rs.woff2") format("woff2");
	unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF
}
/* Subset: Latin3 */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 600;
	src: local("IBM Plex Sans SmBld"), local("IBMPlexSans-SmBld"), url("/assets/IBMPlexSans-SemiBold-Latin3-b1rxH0LD.woff2") format("woff2");
	unicode-range: U+0102-0103, U+01CD-01DC, U+1EA0-1EF9, U+20AB
}
/* Subset: Pi */
@font-face {
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 600;
	src: local("IBM Plex Sans SmBld"), local("IBMPlexSans-SmBld"), url("/assets/IBMPlexSans-SemiBold-Pi-CG8jxtIB.woff2") format("woff2");
	unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD
}
:root {
  font-family: "IBM Plex Sans", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #1e2922;
  background: #f4f6f1;
  font-synthesis: none;
  line-height: 1.5;
}

/* Client conversation */
html:has(.clientChatPage),
body:has(.clientChatPage),
#root:has(.clientChatPage) {
  width: 100%;
  height: 100%;
  min-width: 0;
  overflow: hidden;
}

.appPage:has(.clientChatPage) {
  width: 100%;
  height: 100dvh;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.appPage:has(.clientChatPage) > .appContent {
  width: 100%;
  min-width: 0;
  min-height: 0;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.clientChatPage,
.clientChatHeading,
.chatFeed,
.chatMessage,
.chatSemanticCard,
.chatSummaryPart,
.chatSummaryItems,
.chatResultOrders,
.chatComposer,
.chatComposerRow,
.chatAttachmentComposer,
.chatAttachmentSelection,
.chatAttachmentSelection li,
.chatAttachmentSelectionName {
  min-width: 0;
  max-width: 100%;
}

.clientChatPage {
  width: min(100%, 920px);
  height: 100%;
  margin: 0 auto;
  padding: 14px clamp(10px, 3vw, 28px) max(10px, env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

.clientChatHeading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.clientChatHeading .eyebrow { margin-bottom: 2px; }
.clientChatHeading h1 { font-size: clamp(25px, 5vw, 34px); }

.chatConnectionState,
.chatStateBadge,
.chatDeliveryState {
  width: fit-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  color: #315d3f;
  font-size: 12px;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.chatConnectionState,
.chatStateBadge {
  min-height: 32px;
  padding: 5px 11px;
  background: #eaf2eb;
  border-radius: 999px;
}

.chatConnectionState-offline {
  color: #76551b;
  background: #fff1ce;
}

.chatConnectionState-reconnecting {
  color: #31516b;
  background: #e8f0f6;
}

.chatLoadOlder,
.chatNewMessages {
  min-height: 44px;
  align-self: center;
  padding: 8px 16px;
  color: #315d3f;
  font-size: 13px;
  background: #eef3ee;
  border: 1px solid #d7e1d8;
}

.chatFeed {
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  background: rgba(236, 241, 235, .72);
  border: 1px solid rgba(55, 99, 69, .12);
  border-radius: 20px;
}

.chatEmptyState {
  width: min(100%, 520px);
  margin: auto;
  padding: 24px 18px;
  color: #617067;
  text-align: center;
  overflow-wrap: anywhere;
}

.chatEmptyState h2 { margin: 0; font-size: 22px; }
.chatEmptyState p { margin: 10px 0 0; }

.chatMessage {
  width: min(86%, 690px);
  padding: 12px 14px;
  align-self: flex-start;
  color: #233027;
  overflow-wrap: anywhere;
  word-break: break-word;
  background: rgba(255, 255, 255, .96);
  border: 1px solid #dce5dc;
  border-radius: 6px 18px 18px 18px;
  box-shadow: 0 8px 22px rgba(27, 49, 34, .05);
}

.chatMessage-client {
  align-self: flex-end;
  background: #e7f1e8;
  border-color: #cddfce;
  border-radius: 18px 6px 18px 18px;
}

.chatMessage-summary,
.chatMessage-submission_result { width: min(100%, 760px); }

.chatMessageMeta,
.chatCardHeading,
.chatSummaryPartHeading {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.chatMessageMeta { margin-bottom: 7px; }
.chatMessageMeta strong { font-size: 13px; }
.chatMessageMeta time { color: #6d786f; font-size: 11px; }
.chatMessageBody, .chatSemanticCard > p { margin: 0; white-space: pre-wrap; }

.chatSemanticCard { display: grid; gap: 10px; }
.chatSemanticCard h3, .chatSemanticCard h4 { margin: 0; line-height: 1.3; }
.chatSemanticCard h3 { font-size: 17px; }
.chatSemanticCard h4 { font-size: 14px; }

.chatIssueList,
.chatSummaryParts,
.chatSummaryItems,
.chatResultOrders,
.chatAttachments,
.chatDuplicateWarning ul {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  list-style: none;
}

.chatIssueList { padding-left: 20px; list-style: disc; }
.chatChoiceGroup { display: flex; flex-wrap: wrap; gap: 8px; }
.chatChoice {
  min-height: 44px;
  padding: 8px 13px;
  color: #315d3f;
  background: #f5f8f4;
  border: 1px solid #bdd0c0;
}

.chatChoice:hover { color: #244a32; background: #e9f1e9; }
.chatStateBadge.isStale { color: #76551b; background: #fff1ce; }
.chatSummaryParts { gap: 10px; }
.chatSummaryPart {
  padding: 12px;
  display: grid;
  gap: 5px;
  background: #f7f9f6;
  border-radius: 12px;
}

.chatSummaryPartHeading span { color: #315d3f; font-size: 13px; font-weight: 750; }
.chatSummaryMeta, .chatSummaryComment { margin: 0; color: #5e6c62; font-size: 13px; }
.chatSummaryItems { margin-top: 6px; }
.chatSummaryItems li {
  padding-top: 8px;
  display: grid;
  gap: 2px;
  border-top: 1px solid #dfe7df;
}

.chatSummaryItems span { font-size: 13px; }
.chatConfirmationHint { padding: 10px 12px; color: #244c31; background: #e6f1e7; border-radius: 10px; }
.chatStaleNote { padding: 10px 12px; color: #6b4d17; background: #fff3d6; border-radius: 10px; }
.chatDuplicateWarning { padding: 10px 12px; color: #6b4d17; background: #fff7df; border-radius: 10px; }
.chatDuplicateWarning ul { margin-top: 6px; padding-left: 18px; list-style: disc; }

.chatResultOrders li {
  padding: 10px 12px;
  display: grid;
  gap: 2px;
  background: #edf5ee;
  border-radius: 10px;
}

.chatResultOrders span { font-size: 13px; }
.chatOrderStatus > strong { font-size: 18px; }
.chatOrderStatus time { color: #637067; font-size: 12px; }
.chatRefusal { color: #5e4b2c; }
.chatTechnicalError { color: #772c2c; }

.chatAttachments { margin-top: 10px; }
.chatAttachmentStub a {
  min-height: 44px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  color: #315d3f;
  background: rgba(255, 255, 255, .7);
  border: 1px solid #cfdbd0;
  border-radius: 10px;
  text-decoration: none;
}

.chatAttachmentStub span { overflow-wrap: anywhere; }
.chatAttachmentStub small { color: #6b776e; }
.chatDeliveryState { margin-top: 8px; color: #617067; }
.chatDeliveryState-rejected { color: #772c2c; }
.chatDeliveryState-retry_wait { color: #76551b; }
.chatMessage-local { border-style: dashed; }
.chatLocalAction {
  min-height: 44px;
  margin-top: 9px;
  padding: 8px 12px;
  color: #315d3f;
  background: rgba(255, 255, 255, .72);
  border: 1px solid #bdd0c0;
}

.chatOutboxNotice,
.chatAssistantProgress {
  min-width: 0;
  margin: 0;
  color: #5e6c62;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.chatUpdateNotice {
  min-width: 0;
  padding: 9px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #31516b;
  background: #eaf2f8;
  border: 1px solid #cbdde9;
  border-radius: 12px;
}

.chatUpdateNotice p { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.chatUpdateNotice button { min-height: 44px; flex: 0 0 auto; }

.chatError {
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #772c2c;
  background: #faeceb;
  border: 1px solid #edcfca;
  border-radius: 12px;
  overflow-wrap: anywhere;
}

.chatError p { min-width: 0; margin: 0; }
.chatError button { min-height: 44px; flex: 0 0 auto; }

.chatPwaTools {
  min-width: 0;
  padding: 7px 10px;
  color: #526158;
  background: rgba(255, 255, 255, .76);
  border: 1px solid #d5dfd6;
  border-radius: 12px;
  overflow-wrap: anywhere;
}

.chatPwaTools summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-weight: 700;
}

.chatPwaTools p { margin: 5px 0 9px; }
.chatPwaTools button { min-height: 44px; }

.chatComposer {
  flex: 0 0 auto;
  gap: 5px;
  padding: 9px;
  background: rgba(255, 255, 255, .96);
  border: 1px solid #d5dfd6;
  border-radius: 17px;
  box-shadow: 0 -8px 26px rgba(27, 49, 34, .05);
}

.chatComposer > label { margin: 0 5px; }
.chatComposerRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
}

.chatComposer textarea {
  min-height: 48px;
  max-height: 132px;
  padding: 11px 13px;
  resize: none;
  overflow-y: auto;
}

.chatComposer button {
  min-width: 112px;
  min-height: 48px;
  margin: 0;
  padding-inline: 14px;
}

.chatAttachmentComposer {
  display: grid;
  gap: 5px;
  padding: 7px 8px;
  color: #526158;
  background: #f7f9f6;
  border: 1px solid #dbe4dc;
  border-radius: 12px;
}

.chatAttachmentActions {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.chatAttachmentActions h2 {
  margin: 0;
  color: #31453a;
  font-size: 14px;
  letter-spacing: 0;
}

.chatAttachmentComposer button {
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 7px 11px;
  font-size: 13px;
}

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

.chatAttachmentLimits,
.chatAttachmentRecognitionNote,
.chatAttachmentProgress,
.chatAttachmentError {
  min-width: 0;
  margin: 0;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.chatAttachmentRecognitionNote { color: #68766d; }
.chatAttachmentProgress { color: #31516b; font-weight: 700; }
.chatAttachmentError {
  padding: 7px 9px;
  color: #772c2c;
  background: #faeceb;
  border: 1px solid #edcfca;
  border-radius: 9px;
}

.chatAttachmentSelection {
  max-height: 112px;
  margin: 2px 0 0;
  padding: 0;
  display: grid;
  gap: 5px;
  overflow-x: hidden;
  overflow-y: auto;
  list-style: none;
}

.chatAttachmentSelection li {
  padding: 5px 6px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 9px;
  background: #fff;
  border-radius: 9px;
}

.chatAttachmentSelectionName {
  flex: 1 1 150px;
  display: grid;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.chatAttachmentSelectionName strong { font-size: 12px; }
.chatAttachmentSelectionName small,
.chatAttachmentSelectionState { color: #68766d; font-size: 11px; }
.chatAttachmentSelectionState { flex: 0 1 auto; }

@media (max-width: 480px) {
  .appPage:has(.clientChatPage) .appHeader { padding-top: max(10px, env(safe-area-inset-top)); }
  .clientChatPage { padding-inline: 8px; }
  .clientChatHeading { padding-inline: 3px; }
  .chatFeed { padding: 8px; border-radius: 15px; }
  .chatMessage { width: 94%; padding: 11px; }
  .chatMessage-summary,
  .chatMessage-submission_result { width: 100%; }
  .chatCardHeading,
  .chatSummaryPartHeading { flex-direction: column; gap: 5px; }
  .chatComposerRow { grid-template-columns: minmax(0, 1fr); }
  .chatComposer button { width: 100%; min-width: 0; }
  .chatAttachmentActions button { width: auto; flex: 0 0 auto; }
  .chatAttachmentSelection button { width: 100%; }
  .chatError { align-items: stretch; flex-direction: column; }
  .chatError button { width: 100%; }
  .chatUpdateNotice { align-items: stretch; flex-direction: column; }
  .chatUpdateNotice button { width: 100%; }
}

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

/* Feature 010: canonical dense journal hierarchy from the approved prototype. */
.orderJournalPage {
  --journal-control-height: var(--staff-control-height);
  --journal-row-padding-block: var(--staff-row-padding-block);
  width: 100%;
  height: calc(100dvh - var(--staff-topbar-height));
  min-height: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--staff-background);
}

.staffApp.density-compact .orderJournalPage {
  --journal-control-height: 30px;
  --journal-row-padding-block: 5px;
}

.orderJournalPageHeader { flex: 0 0 var(--staff-page-header-height); }
.orderJournalPageHeader .staffPageHeader__text {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.orderJournalPageHeader .staffPageHeader__description {
  margin: 0;
  white-space: nowrap;
}

.journalColumnPicker { position: relative; }
.journalColumnPicker > summary {
  min-height: var(--journal-control-height);
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  color: var(--staff-secondary);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  cursor: pointer;
  list-style: none;
}

.journalColumnPicker > summary::-webkit-details-marker { display: none; }
.journalColumnPicker > summary::after { margin-left: 7px; content: "▾"; color: var(--staff-muted); }
.journalColumnPicker[open] > summary { color: var(--staff-accent); background: var(--staff-selected); }
.journalColumnPicker fieldset {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  right: 0;
  width: max-content;
  min-width: 210px;
  margin: 0;
  padding: 10px;
  display: grid;
  gap: 4px;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: 0 10px 26px rgba(27, 30, 28, .12);
}

.journalColumnPicker legend { padding-inline: 4px; color: var(--staff-muted); font-size: 12px; }
.journalColumnPicker .checkboxLabel { min-height: 32px; margin: 0; font-size: 13px; }

.orderJournalPage > .staffFilterBarSurface {
  position: relative;
  z-index: 12;
  flex: 0 0 auto;
  margin: 0;
  padding: 8px 16px;
  background: var(--staff-surface);
  border-width: 0 0 1px;
  border-radius: 0;
}

.orderJournalFilters { align-items: center; gap: 8px; }
.orderJournalFilters .staffFilterBar__fields { align-items: center; flex-wrap: nowrap; gap: 8px; }
.orderJournalFilters .staffFilterBar__actions { margin-left: auto; }
.orderJournalFilters .journalSearchFilter { min-width: 150px; max-width: 260px; flex: 1 1 200px; }
.orderJournalFilters .journalSearchFilter input {
  min-height: var(--journal-control-height);
  padding: 0 9px;
  font-size: 13px;
  border-radius: var(--staff-radius);
}

.orderJournalPage .journalViewSwitch {
  margin: 0;
  padding: 0;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 0;
  overflow: hidden;
  background: #fff;
  border-radius: var(--staff-radius);
}

.orderJournalPage .journalViewSwitch button {
  min-height: var(--journal-control-height);
  padding-inline: 12px;
  color: var(--staff-secondary);
  font-size: 13px;
  font-weight: 400;
  white-space: nowrap;
  border: 0;
  border-right: 1px solid var(--staff-border);
  border-radius: 0;
}

.orderJournalPage .journalViewSwitch button:last-of-type { border-right: 0; }
.orderJournalPage .journalViewSwitch button[aria-pressed="true"] {
  color: #fff;
  background: var(--staff-accent);
  border-color: var(--staff-accent);
  box-shadow: none;
}

.orderJournalPage .journalViewSwitch > span { padding: 0 8px; font-size: 12px; white-space: nowrap; }
.orderJournalPage .journalStatusDisclosure summary,
.orderJournalPage .journalMoreFilters summary,
.orderJournalPage .orderJournalFilters .staffFilterBar__actions button {
  min-height: var(--journal-control-height);
  padding-inline: 10px;
  color: var(--staff-secondary);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border-color: var(--staff-border);
  border-radius: var(--staff-radius);
}

.orderJournalPage .journalStatusDisclosure[open] > summary,
.orderJournalPage .journalMoreFilters[open] > summary { color: var(--staff-accent); background: var(--staff-selected); }
.orderJournalPage .journalFilterLabel,
.orderJournalPage .journalTableCaption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.orderJournalPage > .formError,
.orderJournalPage > .errorPanel,
.orderJournalPage > .pageState { flex: 0 0 auto; margin: 8px 16px; }
.orderJournalTable {
  min-width: 0;
  min-height: 0;
  flex: 1 1 auto;
  background: var(--staff-surface);
  border: 0;
  border-radius: 0;
}

.orderJournalTable .staffDataTable { min-width: 1180px; }
.orderJournalPage .orderJournalTable .staffDataTable thead th {
  height: 32px;
  padding: 0 10px;
  font-size: 12px;
}

.orderJournalPage .orderJournalTable .staffDataTable thead th button { min-height: 32px; }
.orderJournalPage .orderJournalTable .staffDataTable tbody th,
.orderJournalPage .orderJournalTable .staffDataTable tbody td {
  height: 40px;
  padding: var(--journal-row-padding-block) 10px;
  line-height: 1.2;
  white-space: nowrap;
}

.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable tbody th,
.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable tbody td { height: 32px; }
.orderJournalNumberLink { color: var(--staff-text); font-weight: 500; text-decoration: none; }
.orderJournalNumberLink:hover { color: var(--staff-accent); text-decoration: underline; }
.orderJournalNumericColumn { text-align: right !important; font-variant-numeric: tabular-nums; }
.orderJournalActionColumn { width: 42px; text-align: center !important; }
.orderJournalRowActions { justify-content: center; }
.orderJournalPage .orderJournalRowActions .secondaryButton {
  width: 28px;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  color: var(--staff-muted);
  font-size: 18px;
  line-height: 1;
  background: transparent;
  border-color: transparent;
  border-radius: 5px;
}

.orderJournalPage .orderJournalRowActions .secondaryButton:hover { color: var(--staff-accent); background: var(--staff-selected); }
.orderJournalPagination { flex: 0 0 40px; border-radius: 0; }

@media (max-width: 820px), (pointer: coarse) {
  .orderJournalPage { height: auto; min-height: calc(100dvh - var(--staff-topbar-height)); overflow: visible; }
  .orderJournalPageHeader { flex-basis: auto; }
  .orderJournalPageHeader .staffPageHeader__text { align-items: flex-start; flex-direction: column; gap: 4px; }
  .orderJournalPageHeader .staffPageHeader__description { white-space: normal; }
  .journalColumnPicker,
  .journalColumnPicker > summary,
  .orderJournalPageHeader .primaryLink { width: 100%; }
  .journalColumnPicker > summary,
  .orderJournalPageHeader .primaryLink { min-height: 44px; justify-content: center; }
  .journalColumnPicker fieldset { position: static; width: 100%; min-width: 0; margin-top: 6px; box-shadow: none; }
  .journalColumnPicker .checkboxLabel { min-height: 44px; }
  .orderJournalPage > .staffFilterBarSurface { padding: 10px 14px; }
  .orderJournalFilters,
  .orderJournalFilters .staffFilterBar__fields { width: 100%; align-items: stretch; flex-direction: column; }
  .orderJournalFilters .journalSearchFilter { width: 100%; max-width: none; flex: 0 0 auto; }
  .orderJournalPage .journalViewSwitch { width: 100%; }
  .orderJournalPage .journalViewSwitch button { min-height: 44px; flex: 1 1 120px; }
  .orderJournalPage .journalStatusDisclosure,
  .orderJournalPage .journalMoreFilters,
  .orderJournalPage .journalStatusDisclosure summary,
  .orderJournalPage .journalMoreFilters summary { width: 100%; }
  .orderJournalPage .journalStatusDisclosure summary,
  .orderJournalPage .journalMoreFilters summary,
  .orderJournalPage .orderJournalFilters .staffFilterBar__actions button { min-height: 44px; }
  .orderJournalTable { flex: none; max-height: calc(100dvh - 220px); }
  .orderJournalPagination { flex-basis: auto; }
  .orderJournalPage .orderJournalRowActions .secondaryButton { width: 44px; min-width: 44px; min-height: 44px; }
}

* { box-sizing: border-box; }

html { min-width: 320px; min-height: 100%; }
body { margin: 0; min-width: 320px; min-height: 100vh; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

a { color: #315d3f; }

:focus-visible {
  outline: 3px solid #2f6a43;
  outline-offset: 3px;
}

.loginPage {
  min-height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 24px 32px;
  background: #f5f6f5;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #1e2922;
  font-weight: 750;
  letter-spacing: -.02em;
  text-decoration: none;
}

.brandMark {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  color: white;
  background: #376345;
  border-radius: 14px;
}

.loginPage .brand { font-weight: 600; letter-spacing: 0; }
.loginPage .brandMark { width: 24px; height: 24px; background: #1f7a4d; border-radius: 5px; }

.brandLink { min-height: 48px; }

.loginCard {
  align-self: center;
  width: min(100%, 420px);
  margin: 32px auto;
  padding: 20px 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.eyebrow {
  margin: 0 0 10px;
  color: #52705b;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.loginCard h1 {
  color: #1b1e1c;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}

.loginCard .subtitle {
  margin: 8px 0 20px;
  color: #6b716d;
  font-size: 13px;
  line-height: 1.45;
}

.loginCard label {
  margin-top: 4px;
  color: #6b716d;
  font-size: 12px;
  font-weight: 500;
}

.loginCard input {
  min-height: 34px;
  height: 34px;
  padding: 0 10px;
  color: #1b1e1c;
  font-size: 13px;
  background: #fff;
  border: 1px solid #e2e5e3;
  border-radius: 6px;
}

.loginCard form > button {
  min-height: 34px;
  margin-top: 10px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 500;
  background: #1f7a4d;
  border-radius: 6px;
}

.loginCard form > button:not(:disabled):hover { background: #155a39; }
.loginCard form > button:disabled { color: #6b716d; background: #dfe5e1; cursor: wait; }
.loginCard :is(input, button):focus-visible {
  border-color: #1f7a4d;
  outline: 2px solid #1f7a4d;
  outline-offset: 2px;
  box-shadow: none;
}

.loginCard :is(.notice, .formError) {
  padding: 8px 0;
  font-size: 12px;
  background: transparent;
  border-block: 1px solid #e2e5e3;
  border-radius: 0;
}

h1, h2 { color: #1e2922; letter-spacing: -.04em; overflow-wrap: anywhere; }
h1 { margin: 0; font-size: clamp(34px, 7vw, 48px); line-height: 1.08; }
h2 { margin: 0; font-size: clamp(22px, 4vw, 30px); line-height: 1.2; }
.subtitle { margin: 16px 0 30px; color: #68736b; line-height: 1.55; }
.lead { max-width: 720px; margin: 18px 0 0; color: #5f6d63; font-size: clamp(17px, 2vw, 20px); }

form { display: grid; gap: 10px; }
label { margin-top: 8px; font-size: 14px; font-weight: 700; }

input {
  width: 100%;
  min-height: 52px;
  padding: 0 16px;
  color: #1e2922;
  font-size: 16px;
  background: #fbfcfa;
  border: 1px solid #d2dad3;
  border-radius: 14px;
}

input:focus { border-color: #527a5e; box-shadow: 0 0 0 4px rgba(82, 122, 94, .12); outline: none; }
input:disabled { color: #6f7b72; background: #edf0ec; cursor: wait; }

select,
textarea {
  width: 100%;
  padding: 12px 16px;
  color: #1e2922;
  font-size: 16px;
  background: #fbfcfa;
  border: 1px solid #d2dad3;
  border-radius: 14px;
}

select { min-height: 52px; }
textarea { min-height: 104px; resize: vertical; }
select:focus, textarea:focus { border-color: #527a5e; box-shadow: 0 0 0 4px rgba(82, 122, 94, .12); outline: none; }
select:disabled, textarea:disabled { color: #6f7b72; background: #edf0ec; cursor: not-allowed; }
input[type="checkbox"], input[type="radio"] { width: 21px; min-height: 21px; margin: 0; accent-color: #376345; }

button,
.primaryLink {
  min-height: 48px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 750;
  background: #376345;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
  text-decoration: none;
}

form > button { min-height: 54px; margin-top: 14px; }
button:hover, .primaryLink:hover { background: #2f583c; }
button:disabled { color: #e0e6e1; background: #688071; cursor: wait; }

.notice,
.successMessage,
.formError {
  margin: 8px 0 0;
  padding: 11px 13px;
  border-radius: 12px;
  font-size: 14px;
}

.inlineFieldError {
  display: block;
  margin-top: 0.35rem;
  color: var(--danger, #9b2c2c);
  font-size: 0.82rem;
  font-weight: 600;
}

.notice { color: #52625a; background: #f0f3ef; }
.successMessage { color: #204e31; background: #e8f4eb; }
.formError, .globalError { color: #772c2c; background: #faeceb; }
.footer { margin: 0; color: #78877d; font-size: 13px; text-align: center; }

.loadingPage {
  min-height: 100vh;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 16px;
  background: #f5f6f5;
}

.loadingPage p { margin: 0; color: #627066; }
.loadingMark {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  color: white;
  font-weight: 600;
  background: #1f7a4d;
  border-radius: 5px;
  animation: gentlePulse 1.4s ease-in-out infinite;
}

.appPage {
  min-height: 100vh;
  background:
    radial-gradient(circle at 92% 2%, rgba(143, 176, 147, .22), transparent 28%),
    #f4f6f1;
}

.appPage.isSigningOut {
  cursor: progress;
}

.appPage.isSigningOut .appHeader,
.appPage.isSigningOut .sectionNav,
.appPage.isSigningOut .appContent {
  opacity: .72;
}

.skipLink {
  position: fixed;
  z-index: 10;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  color: white;
  background: #1f3c29;
  border-radius: 10px;
  transform: translateY(-160%);
}

.skipLink:focus { transform: translateY(0); }

.appHeader {
  min-height: 84px;
  padding: 18px clamp(20px, 5vw, 64px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  background: rgba(255, 255, 255, .82);
  border-bottom: 1px solid rgba(55, 99, 69, .12);
  backdrop-filter: blur(16px);
}

.accountArea { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.accountIdentity { display: grid; margin-right: 8px; text-align: right; }
.accountIdentity strong { font-size: 14px; }
.accountIdentity span { color: #66746a; font-size: 13px; }

.secondaryAction,
.secondaryButton {
  min-height: 44px;
  padding: 0 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #315d3f;
  font-size: 14px;
  font-weight: 700;
  background: #eef3ee;
  border: 1px solid #d7e1d8;
  border-radius: 12px;
  text-decoration: none;
}

.secondaryAction:hover,
.secondaryButton:hover { color: #244a32; background: #e2ebe3; }
.secondaryButton:disabled { color: #6f7b72; background: #edf0ec; }

.globalError {
  width: min(calc(100% - 40px), 760px);
  margin: 16px auto 0;
  padding: 12px 16px;
  border-radius: 12px;
  text-align: center;
}

.appContent { width: min(100%, 1160px); margin: 0 auto; padding: clamp(40px, 7vw, 84px) clamp(20px, 5vw, 48px); }
.landing { min-width: 0; display: grid; align-content: start; }
.narrowLanding { width: min(100%, 680px); }

.sectionNav {
  width: 100%;
  min-height: 52px;
  padding: 7px clamp(20px, 5vw, 64px);
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  background: rgba(248, 250, 247, .92);
  border-bottom: 1px solid rgba(55, 99, 69, .1);
}

.sectionNav a {
  min-height: 38px;
  padding: 8px 13px;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  color: #536359;
  font-size: 14px;
  font-weight: 700;
  border-radius: 10px;
  text-decoration: none;
}

.sectionNav a:hover, .sectionNav a.active { color: #284d35; background: #e5ede6; }

.dashboardGrid {
  margin-top: 38px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 14px;
}

.dashboardCard {
  min-height: 126px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 18px;
  color: #1e2922;
  background: rgba(255, 255, 255, .9);
  border: 1px solid rgba(55, 99, 69, .14);
  border-radius: 20px;
  box-shadow: 0 14px 36px rgba(27, 49, 34, .06);
  text-decoration: none;
}

.dashboardCard:hover { border-color: #9cb5a2; transform: translateY(-1px); }
.dashboardCard strong { font-size: 19px; }
.dashboardCard span { color: #69776e; font-size: 14px; }

.pageTitleRow {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
}

.pageTitleRow > button, .pageTitleRow > .primaryLink { flex: 0 0 auto; }

.filterBar {
  margin-top: 30px;
  padding: 16px;
  display: grid;
  grid-template-columns: minmax(190px, 1fr) minmax(150px, .45fr) auto;
  align-items: end;
  gap: 12px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid rgba(55, 99, 69, .12);
  border-radius: 18px;
}

.filterBar label { margin: 0; }
.filterBar button { min-height: 52px; }
.auditFilters { grid-template-columns: repeat(3, minmax(180px, 1fr)); }
.auditFilters button { align-self: end; }

.scrollRegion { min-width: 0; max-width: 100%; margin-top: 18px; overflow-x: auto; border-radius: 18px; }
.referenceList { min-width: 560px; margin: 0; padding: 0; display: grid; gap: 10px; list-style: none; }
.referenceRow {
  min-height: 82px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: rgba(255, 255, 255, .9);
  border: 1px solid #dde5dd;
  border-radius: 16px;
}

.referenceDetails { min-width: 0; display: grid; gap: 3px; }
.referenceDetails strong { overflow-wrap: anywhere; }
.referenceDetails span, .referenceDetails address { color: #647168; font-size: 14px; font-style: normal; overflow-wrap: anywhere; }
.rowActions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; flex: 0 0 auto; }
.inactiveBadge { color: #6d5652; background: #f3e9e6; }
.pagination { margin-top: 18px; display: flex; align-items: center; justify-content: flex-end; gap: 14px; }
.pagination span, .resultCount { color: #6b786f; font-size: 14px; }
.resultCount { margin: 16px 0 0; }

.hierarchyToggle {
  min-width: 0;
  padding: 4px 8px;
  flex: 1;
  justify-content: flex-start;
  gap: 12px;
  color: #1e2922;
  text-align: left;
  background: transparent;
}

.hierarchyToggle:hover { color: #244b31; background: #eef4ee; }
.hierarchyChevron { flex: 0 0 auto; color: #53705b; font-size: 30px; line-height: 1; transition: transform .16s ease; }
.hierarchyToggle[aria-expanded="true"] .hierarchyChevron { transform: rotate(90deg); }

.nestedEmptyState { margin: 0; background: white; }
.hierarchyChildError {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #772c2c;
  background: #faeceb;
  border-radius: 14px;
}

.childPagination { margin-top: 14px; }
.routeErrorPage { min-height: 100vh; padding: 24px; display: grid; place-items: center; background: #f4f6f1; }
.routeErrorActions { margin-top: 24px; }

.dictionaryList { margin-top: 18px; }
.dictionaryRow {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: end;
  gap: 10px 16px;
}
.dictionaryRow > label { margin: 0; }
.dictionaryRow > .errorPanel,
.dictionaryRow > .rowActions { grid-column: 1 / -1; }
.dictionaryProduct { display: grid; align-content: start; gap: 6px; }
.dictionaryProduct > span { color: #6b786f; font-size: 14px; }
.dictionaryProductSearch { margin-bottom: 14px; }
.dictionaryMatchedAliases { margin: 0; padding: 0; display: grid; gap: 3px; list-style: none; }
.dictionaryMatchedAliases li { color: #526259; font-size: 12px; overflow-wrap: anywhere; }
.dictionaryGroupTable tbody th > button {
  min-height: 36px;
  padding: 0;
  justify-content: flex-start;
  color: #235c3c;
  text-align: left;
  background: transparent;
}
.dictionaryGroupTable tbody th > button:hover { color: #173d28; background: transparent; text-decoration: underline; }
#expanded-alias-group { margin-top: 16px; }

.editorPanel { scroll-margin-top: 20px; }
.editorForm { margin-top: 22px; }
.twoColumnForm { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; }
.wideField { grid-column: 1 / -1; }
.checkboxLabel, .radioLabel {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.radioLabel { margin: 0; font-size: 13px; }
.pageMessage { width: fit-content; max-width: 100%; margin-top: 18px; }
.inlineLoading { margin: 26px 0 0; color: #627066; }

.errorPanel {
  margin-top: 18px;
  padding: 16px 18px;
  color: #772c2c;
  background: #faeceb;
  border: 1px solid #edcfca;
  border-radius: 14px;
}

.errorPanel p { margin: 8px 0; }
.errorPanel ul { margin: 7px 0 0; padding-left: 20px; }
.errorField { font-weight: 750; }
.dependencyList { display: grid; gap: 6px; }
.dependencyList li { display: flex; flex-wrap: wrap; gap: 7px; }
.dependencyList small { color: #8b5f58; }

.accessFieldset {
  min-width: 0;
  margin: 14px 0;
  padding: 16px;
  display: grid;
  gap: 10px;
  border: 1px solid #dce5dc;
  border-radius: 16px;
}

.accessFieldset legend { padding: 0 7px; font-weight: 750; }
.accessOption {
  min-height: 58px;
  padding: 9px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: #f7f9f6;
  border-radius: 12px;
}

.accessOption .checkboxLabel { margin: 0; }
.accessOption .checkboxLabel span { display: grid; }
.accessOption small { color: #68766d; font-weight: 400; }
.dangerPanel { border-color: #e6cfca; }
.dangerPanel > button { margin-top: 16px; }

.auditList { margin: 0; padding: 0; list-style: none; }
.auditEvent { margin-top: 16px; }
.auditHeading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.auditHeading > div { display: grid; gap: 3px; }
.auditHeading span, .auditHeading time, .auditActor, .auditEvent > small { color: #66746a; font-size: 13px; }
.auditActor { margin: 12px 0; }
.auditStates { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.auditState { padding: 12px; background: #f7f9f6; border-radius: 12px; }
.auditState h3 { margin: 0 0 8px; font-size: 14px; }
.auditState dl { margin: 0; display: grid; gap: 6px; }
.auditState dl div { display: grid; grid-template-columns: minmax(70px, .7fr) 1fr; gap: 8px; }
.auditState dt { color: #68766d; font-size: 12px; overflow-wrap: anywhere; }
.auditState dd { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.agentDecisionSection { min-width: 0; margin-top: 48px; }
.agentDecisionSection > h2 { margin-top: 6px; }
.agentDecisionTable { width: 100%; min-width: 980px; border-collapse: collapse; background: rgba(255, 255, 255, .9); }
.agentDecisionTable th, .agentDecisionTable td { padding: 12px 14px; border-bottom: 1px solid #e0e7e0; text-align: left; font-size: 13px; vertical-align: top; }
.agentDecisionTable th { color: #526158; background: #f4f7f3; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.agentDecisionTable td:nth-child(4) { max-width: 220px; overflow-wrap: anywhere; }

.panel {
  margin-top: 38px;
  padding: clamp(24px, 4vw, 34px);
  background: rgba(255, 255, 255, .9);
  border: 1px solid rgba(55, 99, 69, .12);
  border-radius: 24px;
  box-shadow: 0 18px 50px rgba(27, 49, 34, .07);
}

.compactPanel { max-width: 720px; }
.compactPanel p { margin: 12px 0 0; color: #617067; }
.sectionHeading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.countBadge, .statusBadge, .capability {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 4px 11px;
  color: #315d3f;
  font-size: 13px;
  font-weight: 750;
  background: #eaf2eb;
  border-radius: 999px;
}

.countBadge { min-width: 32px; justify-content: center; }
.capability { width: fit-content; margin: 22px 0 0; }
.objectList { margin: 24px 0 0; padding: 0; display: grid; gap: 12px; list-style: none; }
.objectCard {
  min-height: 76px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: #f7f9f6;
  border: 1px solid #e1e7e1;
  border-radius: 16px;
}

.objectCard strong { display: block; }
.objectCard address { margin-top: 3px; color: #647068; font-size: 14px; font-style: normal; }
.stageNote { margin: 24px 0 0; color: #718077; font-size: 14px; }
.emptyState { margin: 24px 0 0; padding: 18px; color: #617067; background: #f7f9f6; border-radius: 14px; }

.formActions { margin-top: 14px; display: flex; justify-content: flex-end; gap: 12px; }
.formActions button { margin: 0; }

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

.catalogPage,
.catalogDetail,
.catalogSection,
.catalogImportPanel,
.catalogRow,
.catalogRowMain,
.catalogEditorRow,
.catalogInlineEditor,
.unitKindEditor { min-width: 0; }

.catalogStatus {
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.catalogStatus > div {
  min-width: 0;
  padding: 18px;
  display: grid;
  gap: 3px;
  background: rgba(255, 255, 255, .82);
  border: 1px solid rgba(55, 99, 69, .12);
  border-radius: 16px;
}

.catalogStatus strong { overflow-wrap: anywhere; font-size: 20px; }
.catalogStatus span { color: #69776e; font-size: 13px; }
.catalogHelp { margin: 16px 0 0; color: #617067; }

.catalogImportPanel .sectionHeading > div,
.catalogSection .sectionHeading > div { min-width: 0; }

.catalogImportReport {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid #dce5dc;
}

.catalogImportReport h3 { margin: 0; font-size: 18px; }
.importStatus-failed { color: #772c2c; background: #faeceb; }
.importStatus-running, .importStatus-queued { color: #6e5414; background: #fff4d4; }

.catalogMetaGrid,
.catalogCounters,
.catalogDefinitionList {
  margin: 20px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: 10px;
}

.catalogMetaGrid > div,
.catalogCounters > div,
.catalogDefinitionList > div {
  min-width: 0;
  padding: 12px 14px;
  background: #f7f9f6;
  border-radius: 12px;
}

.catalogMetaGrid dt,
.catalogCounters dt,
.catalogDefinitionList dt { color: #68766d; font-size: 12px; }

.catalogMetaGrid dd,
.catalogCounters dd,
.catalogDefinitionList dd { margin: 4px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.catalogCounters dd { font-size: 20px; }

.catalogWarning {
  margin: 16px 0 0;
  padding: 13px 15px;
  color: #654d11;
  background: #fff7df;
  border: 1px solid #ecdca9;
  border-radius: 12px;
}

.catalogWarning ul { margin: 8px 0 0; padding-left: 20px; }
.catalogImportHistory { margin-top: 22px; }
.catalogImportHistory h3 { margin: 0; font-size: 16px; }
.catalogImportHistory ul {
  margin: 12px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  list-style: none;
}
.catalogImportHistory button {
  width: 100%;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 12px;
  color: #31453a;
  text-align: left;
  background: #f7f9f6;
  border: 1px solid #dce5dc;
  border-radius: 12px;
}
.catalogImportHistory button:hover { background: #eef4ee; }
.catalogImportHistory button.isSelected { border-color: #5e8069; box-shadow: 0 0 0 2px rgba(55, 99, 69, .1); }
.catalogImportHistory button:disabled { cursor: not-allowed; opacity: .62; }
.catalogImportHistory strong,
.catalogImportHistory small { overflow-wrap: anywhere; }
.catalogImportHistory span { color: #45604d; font-weight: 700; }
.catalogImportHistory small { grid-column: 1 / -1; color: #68766d; }
.catalogFilters { grid-template-columns: minmax(220px, 1.4fr) repeat(2, minmax(150px, .65fr)); }
.catalogFilters button { grid-column: -2 / -1; }
.unitFilters { grid-template-columns: minmax(220px, 1.2fr) minmax(170px, .6fr) minmax(220px, .8fr) auto; }
.catalogFilterCheck { align-self: center; margin-top: 20px; }

.catalogList,
.catalogEditorList,
.catalogReadList {
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  list-style: none;
}

.catalogRow {
  padding: 17px 18px;
  display: grid;
  grid-template-columns: minmax(210px, 1.3fr) minmax(120px, .55fr) minmax(150px, .8fr) auto;
  align-items: center;
  gap: 16px;
  background: rgba(255, 255, 255, .9);
  border: 1px solid #dde5dd;
  border-radius: 16px;
}

.catalogRowMain { display: grid; gap: 3px; }
.catalogRowMain strong,
.catalogRowMain span,
.catalogRowMain small { overflow-wrap: anywhere; }
.catalogRowMain span, .catalogRowMain small { color: #647168; font-size: 13px; }
.catalogRowFacts { min-width: 0; display: grid; gap: 4px; color: #56675b; font-size: 13px; }
.catalogBadges { min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.warningBadge { color: #6e5414; background: #fff1c7; }

.backLink {
  width: fit-content;
  margin-bottom: 24px;
  font-weight: 700;
  text-decoration: none;
}

.technicalValue { overflow-wrap: anywhere; word-break: break-word; }
.catalogLocalForm { margin-top: 18px; align-items: start; }
.catalogLocalForm > button { width: fit-content; }

.catalogCreateForm {
  margin-top: 20px;
  padding: 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  background: #f7f9f6;
  border-radius: 16px;
}

.catalogCreateForm label { margin: 0; }
.catalogCreateForm > button { margin: 0; min-height: 52px; }
.conversionCreateForm { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
.conversionCreateForm .conversionEquation { grid-column: 1 / -1; }

.catalogEditorRow,
.catalogReadList > li {
  min-width: 0;
  padding: 15px;
  background: #f7f9f6;
  border: 1px solid #e1e7e1;
  border-radius: 14px;
}

.catalogEditorRow.isInactive { background: #f3f3f0; }
.catalogInlineEditor { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.catalogInlineEditor label { margin: 0; }
.catalogEditorRow .rowActions { margin-top: 12px; flex-wrap: wrap; }
.catalogEditorRow .errorPanel { margin-top: 12px; }
.catalogConversionHeading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.catalogEditorRow > label { display: block; margin-top: 12px; }
.conversionEquation { margin: 10px 0 0; color: #315d3f; font-weight: 750; overflow-wrap: anywhere; }

.catalogReadList > li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.unitRow { grid-template-columns: minmax(220px, 1.2fr) minmax(160px, .7fr) minmax(220px, .8fr); align-items: start; }
.unitKindEditor { display: grid; gap: 8px; }
.unitKindEditor label { margin: 0; }
.unitKindEditor .errorPanel { margin-top: 4px; }

@keyframes gentlePulse {
  50% { transform: scale(.94); opacity: .82; }
}

@media (max-width: 720px) {
  .loginPage { padding: 16px; }
  .loginCard { padding: 16px 0; }
  .loginCard input,
  .loginCard form > button { min-height: 44px; height: 44px; font-size: 16px; }
  .appHeader { align-items: flex-start; }
  .accountArea { max-width: 220px; flex-wrap: wrap; }
  .accountIdentity { width: 100%; margin: 0; }
  .secondaryAction, .secondaryButton { flex: 1 1 auto; }
  .pageTitleRow { align-items: stretch; flex-direction: column; }
  .pageTitleRow > button, .pageTitleRow > .primaryLink { width: 100%; }
  .filterBar, .auditFilters { grid-template-columns: 1fr; }
  .filterBar button { width: 100%; }
  .twoColumnForm { grid-template-columns: 1fr; }
  .wideField { grid-column: auto; }
  .catalogStatus { grid-template-columns: 1fr; }
  .catalogImportPanel .sectionHeading,
  .catalogSection .sectionHeading { align-items: stretch; flex-direction: column; }
  .catalogImportPanel .sectionHeading > button { width: 100%; }
  .catalogFilters, .unitFilters { grid-template-columns: 1fr; }
  .catalogFilters button { grid-column: auto; }
  .catalogFilterCheck { margin-top: 4px; }
  .catalogRow, .unitRow { grid-template-columns: 1fr; align-items: stretch; }
  .catalogRow > .secondaryAction { width: 100%; }
  .catalogCreateForm, .conversionCreateForm { grid-template-columns: 1fr; }
  .catalogCreateForm > button { width: 100%; }
  .conversionCreateForm .conversionEquation { grid-column: auto; }
}

@media (max-width: 480px) {
  h1 { font-size: clamp(28px, 9vw, 34px); }
  .appHeader { min-height: auto; padding: 14px 16px; gap: 12px; }
  .brandLink > span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .accountArea { max-width: none; flex: 1; gap: 8px; }
  .accountIdentity { text-align: left; }
  .secondaryAction, .secondaryButton { padding-inline: 10px; font-size: 13px; }
  .appContent { padding-top: 42px; }
  .panel { margin-top: 28px; padding: 22px 18px; border-radius: 20px; }
  .objectCard { align-items: flex-start; flex-direction: column; gap: 10px; }
  .formActions { align-items: stretch; flex-direction: column-reverse; }
  .formActions > * { width: 100%; }
  .sectionNav { padding-inline: 12px; }
  .dashboardGrid { margin-top: 28px; grid-template-columns: 1fr; }
  .dashboardCard { min-height: 108px; }
  .referenceList { min-width: 500px; }
  .hierarchyChildError { align-items: stretch; flex-direction: column; }
  .routeErrorPage { padding: 14px; }
  .routeErrorActions { align-items: stretch; }
  .dictionaryRow { grid-template-columns: 1fr; }
  .pagination { align-items: stretch; flex-wrap: wrap; justify-content: center; }
  .pagination button { flex: 1; }
  .accessOption, .auditHeading { align-items: flex-start; flex-direction: column; }
  .catalogInlineEditor,
  .catalogReadList > li,
  .catalogConversionHeading { align-items: stretch; grid-template-columns: 1fr; flex-direction: column; }
  .catalogEditorRow .rowActions { align-items: stretch; flex-direction: column; }
  .catalogEditorRow .rowActions > * { width: 100%; }
  .dictionaryRow { grid-template-columns: 1fr; align-items: stretch; }
  .dictionaryRow > * { grid-column: 1; }
  .catalogDefinitionList, .catalogMetaGrid, .catalogCounters { grid-template-columns: 1fr; }
}

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

/* Order intake */
.orderPage,
.orderFormShell,
.orderForm,
.orderCommonFields,
.orderParts,
.orderPart,
.orderLine,
.productPicker,
.productSearchRow,
.orderJournalFilters,
.orderJournalList,
.orderJournalCard,
.orderDetail,
.orderCurrent,
.orderComposition,
.orderHistory,
.historicalVersion,
.statusActions,
.inlineActionPanel { min-width: 0; }

.orderFormShell { margin-top: 30px; }

.orderForm {
  gap: 22px;
}

.orderFormFields {
  min-width: 0;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 22px;
  border: 0;
}

.orderCommonFields,
.orderReview {
  padding: clamp(18px, 4vw, 28px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 18px;
  background: rgba(255, 255, 255, .88);
  border: 1px solid rgba(55, 99, 69, .13);
  border-radius: 22px;
  box-shadow: 0 12px 34px rgba(27, 49, 34, .05);
}

.orderCommonFields h2,
.orderReview h2 { grid-column: 1 / -1; }
.orderCommonFields label { margin: 0; }

.readOnlyField {
  min-width: 0;
  margin-top: 8px;
  display: grid;
  align-content: start;
  gap: 7px;
  font-size: 14px;
  font-weight: 700;
}

.readOnlyField output {
  min-height: 52px;
  padding: 13px 16px;
  display: block;
  color: #425248;
  font-size: 16px;
  font-weight: 500;
  background: #edf0ec;
  border: 1px solid #d2dad3;
  border-radius: 14px;
  overflow-wrap: anywhere;
}

.orderParts { display: grid; gap: 20px; }

.orderPart,
.orderLine {
  margin: 0;
  border: 1px solid #d8e2d9;
}

.orderPart {
  padding: clamp(16px, 4vw, 26px);
  background: rgba(255, 255, 255, .9);
  border-radius: 22px;
  box-shadow: 0 14px 36px rgba(27, 49, 34, .055);
}

.orderPart > legend,
.orderLine > legend {
  max-width: 100%;
  padding: 0 9px;
  color: #274b33;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.orderPart > legend { font-size: 18px; }

.orderPart--compact,
.orderLine--compact { padding: 0; overflow: hidden; }

.orderPart__legend,
.orderLine__legend {
  width: calc(100% - 28px);
  min-width: 0;
  margin-inline: 14px;
  padding: 9px 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 12px;
}

.orderPart__title,
.orderLine__title { min-width: 0; overflow-wrap: anywhere; }

.orderPart__summary,
.orderLine__summary {
  min-width: 0;
  color: #617067;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.orderPart__toggle,
.orderLine__toggle {
  min-width: 92px;
  min-height: 38px;
  grid-column: 2;
  grid-row: 1 / span 2;
  padding: 6px 10px;
  color: #315d3f;
  font-size: 12px;
  background: #edf3ee;
  border: 1px solid #d4ded6;
  border-radius: 9px;
}

.orderPart__toggle:hover,
.orderLine__toggle:hover { color: #173d28; background: #e4ece6; }
.orderPart__body { padding: 12px clamp(16px, 3vw, 22px) clamp(16px, 3vw, 22px); }
.orderLine__body { padding: 10px 14px 14px; }
.orderPart__legend + .orderPart__body,
.orderLine__legend + .orderLine__body { border-top: 1px solid #e2e8e3; }

.orderPartHeader {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr) minmax(0, .72fr);
  gap: 12px 16px;
}

.orderPartHeader label,
.orderPartHeader .readOnlyField { margin-top: 0; }

.orderLines { margin-top: 22px; display: grid; gap: 14px; }

.orderLine {
  padding: 16px;
  background: #f7f9f6;
  border-radius: 16px;
}

.orderLineFields {
  margin-top: 12px;
  display: grid;
  grid-template-columns: minmax(130px, .55fr) minmax(180px, 1fr);
  align-items: start;
  gap: 14px;
}

.orderLineFields label { margin: 0; }

.selectedProduct {
  margin: 0 0 10px;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 5px 12px;
}

.selectedProduct strong,
.selectedProduct span { overflow-wrap: anywhere; }
.selectedProduct span { color: #66746a; font-size: 13px; }

.productPicker > label { display: block; margin-top: 0; }
.productSearchRow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
.productSearchRow button { min-height: 52px; }

.productSearchResults {
  margin-top: 9px;
  padding: 7px;
  display: grid;
  gap: 6px;
  background: #edf3ed;
  border: 1px solid #d8e3d9;
  border-radius: 14px;
}

.productResult {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 10px 12px;
  display: grid;
  justify-items: start;
  gap: 2px;
  color: #253a2d;
  text-align: left;
  background: white;
  border: 1px solid #d9e1da;
  border-radius: 10px;
}

.productResult:hover { color: #1f3527; background: #f4f8f4; }
.productPicker__option[aria-selected="true"] {
  color: #173d28;
  background: #e7f1e9;
  border-color: #83aa91;
  box-shadow: inset 3px 0 #397451;
}
.productResult strong,
.productResult span { max-width: 100%; overflow-wrap: anywhere; }
.productResult span { color: #65746a; font-size: 12px; }
.pickerEmpty { margin: 8px 0 0; color: #66746a; font-size: 13px; }

.quantityPreview {
  margin: 12px 0 0;
  padding: 10px 12px;
  color: #244f32;
  font-weight: 800;
  background: #e8f3ea;
  border-radius: 11px;
  overflow-wrap: anywhere;
}

.inlineOrderError,
.lineEligibilityError {
  margin: 10px 0 0;
  padding: 10px 12px;
  color: #772c2c;
  background: #faeceb;
  border-radius: 10px;
}

.partActions {
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.dangerTextButton,
.dangerButton {
  min-height: 44px;
  color: #8a302d;
  background: #faeceb;
  border: 1px solid #edcfca;
}

.dangerTextButton { padding: 8px 13px; }
.dangerTextButton:hover,
.dangerButton:hover { color: #6f2422; background: #f5dedb; }
.dangerTextButton:disabled { color: #8c827f; background: #f1efed; }
.addPartButton { width: fit-content; }

.orderReview {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.orderReview h2 { grid-column: 1 / -1; }
.orderReview p { margin: 0; color: #5f6d63; }
.orderReview button { min-width: 190px; }

.orderErrorSummary,
.orderSuccess {
  margin: 0 0 20px;
  padding: clamp(17px, 4vw, 24px);
  border-radius: 18px;
  scroll-margin-top: 18px;
}

.orderErrorSummary {
  color: #772c2c;
  background: #faeceb;
  border: 1px solid #edcfca;
}

.orderErrorSummary ul,
.orderSuccess ul { margin: 10px 0 0; padding-left: 22px; }
.orderErrorSummary a { color: inherit; }

.orderSuccess h2 { margin: 0; }
.orderSuccess p { margin: 9px 0 0; }

.orderSuccess {
  color: #204e31;
  background: #e8f4eb;
  border: 1px solid #c8dfce;
}

.orderJournalFilters {
  margin-top: 28px;
  padding: 18px;
  display: grid;
  grid-template-columns: minmax(190px, 1.15fr) minmax(210px, 1fr) repeat(2, minmax(160px, .8fr));
  align-items: end;
  gap: 12px;
  background: rgba(255, 255, 255, .82);
  border: 1px solid rgba(55, 99, 69, .13);
  border-radius: 20px;
}

.orderJournalFilters > label { margin: 0; }

.journalStatusFilter {
  min-width: 0;
  margin: 0;
  padding: 8px 11px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 11px;
  border: 1px solid #d2dad3;
  border-radius: 14px;
}

.journalStatusFilter legend { padding: 0 4px; font-size: 13px; font-weight: 800; }
.journalStatusFilter .checkboxLabel { min-height: 34px; margin: 0; font-size: 13px; }

.journalMoreFilters { grid-column: 1 / -1; min-width: 0; }
.journalMoreFilters summary {
  min-height: 44px;
  padding: 10px 13px;
  color: #315d3f;
  font-weight: 750;
  background: #eef3ee;
  border-radius: 12px;
  cursor: pointer;
}

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

.journalMoreGrid label { margin: 0; }
.journalFilterActions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.orderJournalList {
  margin: 16px 0 0;
  padding: 0;
  display: grid;
  gap: 11px;
  list-style: none;
}

.orderJournalCard {
  padding: 17px 18px;
  display: grid;
  grid-template-columns: minmax(145px, .45fr) minmax(0, 2fr) auto;
  align-items: center;
  gap: 18px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid #dce5dd;
  border-left: 5px solid #799882;
  border-radius: 17px;
}

.orderJournalCard.status-accepted { border-left-color: #3d7750; }
.orderJournalCard.status-cancelled { border-left-color: #a36a65; background: rgba(249, 246, 244, .94); }
.orderCardHeading { min-width: 0; display: grid; justify-items: start; gap: 7px; }
.orderCardHeading strong { font-size: 19px; overflow-wrap: anywhere; }

.orderStatus {
  min-height: 30px;
  padding: 4px 10px;
  display: inline-flex;
  align-items: center;
  color: #4f5f55;
  font-size: 13px;
  font-weight: 800;
  background: #edf1ed;
  border-radius: 999px;
}

.orderStatus.status-accepted { color: #245135; background: #e3f1e7; }
.orderStatus.status-cancelled { color: #792f2c; background: #f8e8e6; }

.orderFacts {
  min-width: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr));
  gap: 10px 14px;
}

.orderFacts > div { min-width: 0; }
.orderFacts dt { color: #6b776f; font-size: 12px; }
.orderFacts dd { margin: 2px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.orderFacts dd small { margin-top: 2px; display: block; color: #68766d; font-weight: 400; }

.orderDetailHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
}

.orderDetailHeader > div:first-child { min-width: 0; display: grid; justify-items: start; gap: 10px; }
.orderDetailHeader .eyebrow { margin: 0; }
.orderDetailActions { min-width: min(100%, 330px); display: grid; justify-items: end; gap: 10px; }
.statusActions { width: 100%; display: grid; gap: 10px; }
.statusActionButtons { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 9px; }
.statusActionMessage { margin: 0; padding: 10px 12px; color: #204e31; background: #e8f4eb; border-radius: 11px; }
.terminalOrderNote { margin: 0; padding: 10px 12px; color: #792f2c; background: #f8e8e6; border-radius: 11px; }

.inlineActionPanel {
  width: min(100%, 520px);
  padding: 17px;
  color: #263b2e;
  text-align: left;
  background: white;
  border: 1px solid #d3dfd5;
  border-radius: 16px;
  box-shadow: 0 14px 34px rgba(27, 49, 34, .09);
}

.inlineActionPanel h2 { font-size: 20px; }
.inlineActionPanel p { margin: 8px 0 0; color: #5f6d63; }
.inlineActionPanel label { display: block; }
.inlineActionPanel .formActions { flex-wrap: wrap; }

.orderDetailFacts { margin-top: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.orderDetailFacts .wideFact { grid-column: 1 / -1; }

.cancelledEvidence {
  margin-top: 20px;
  padding: 14px 16px;
  color: #702e2b;
  background: #f8e8e6;
  border-radius: 13px;
}
.cancelledEvidence p { margin: 6px 0; overflow-wrap: anywhere; }

.orderComposition h2 { margin-bottom: 16px; }
.orderCompositionList,
.siblingOrders ul,
.historyList {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
  list-style: none;
}

.orderCompositionList > li {
  min-width: 0;
  padding: 15px;
  background: #f7f9f6;
  border: 1px solid #e1e7e1;
  border-radius: 14px;
}

.compositionHeading { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.compositionHeading strong,
.compositionHeading span { overflow-wrap: anywhere; }
.compositionHeading span { color: #68766d; font-size: 12px; }
.quantityFacts { margin: 12px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.quantityFacts > div { min-width: 0; padding: 9px 11px; background: white; border-radius: 10px; }
.quantityFacts dt { color: #68766d; font-size: 12px; }
.quantityFacts dd { margin: 3px 0 0; font-weight: 800; overflow-wrap: anywhere; }
.manualMarker { margin-top: 10px; display: inline-block; color: #604a10; font-size: 12px; font-weight: 700; }

.siblingOrders ul { margin-top: 16px; }
.siblingOrders li a {
  min-width: 0;
  min-height: 52px;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: minmax(100px, .5fr) minmax(150px, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  color: #2c4935;
  background: #f7f9f6;
  border: 1px solid #e1e7e1;
  border-radius: 12px;
  text-decoration: none;
}
.siblingOrders li a > * { min-width: 0; overflow-wrap: anywhere; }

.historyList { margin-top: 16px; }
.historyEvent { padding: 16px; background: #f7f9f6; border-left: 4px solid #75917c; border-radius: 12px; }
.historyHeading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.historyHeading time { color: #68766d; font-size: 12px; }
.historyEvent > p { margin: 7px 0 0; color: #5d6c62; }
.historyEvent > button { margin-top: 12px; }
.historyChanges { margin: 10px 0 0; padding-left: 20px; }
.historyChanges li { margin-top: 5px; }
.historyChanges span { margin-left: 7px; overflow-wrap: anywhere; }

.historicalVersion {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid #dce5dc;
}
.historicalVersion > p { color: #627066; }
.historicalVersion .orderFacts { margin-top: 14px; }
.historicalVersion .orderComposition { margin-top: 22px; }

@media (max-width: 900px) {
  .orderJournalFilters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .journalMoreGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .orderJournalCard { grid-template-columns: minmax(130px, .45fr) minmax(0, 1.5fr); }
  .orderJournalCard > .secondaryAction { grid-column: 1 / -1; width: 100%; }
  .orderDetailFacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .orderCommonFields,
  .orderPartHeader,
  .orderJournalFilters,
  .journalMoreGrid,
  .orderDetailFacts { grid-template-columns: 1fr; }
  .orderCommonFields h2,
  .orderDetailFacts .wideFact { grid-column: auto; }
  .orderReview { grid-template-columns: 1fr; }
  .orderReview h2 { grid-column: auto; }
  .orderReview button,
  .addPartButton { width: 100%; }
  .orderJournalCard { grid-template-columns: 1fr; align-items: stretch; }
  .orderJournalCard > .secondaryAction { grid-column: auto; }
  .orderDetailHeader { flex-direction: column; }
  .orderDetailActions { width: 100%; min-width: 0; justify-items: stretch; }
  .orderDetailActions > .secondaryAction { width: 100%; }
  .statusActionButtons { justify-content: stretch; }
  .statusActionButtons > button { flex: 1 1 180px; }
  .inlineActionPanel { width: 100%; }
  .siblingOrders li a { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  .orderFormShell { margin-top: 24px; }
  .orderCommonFields,
  .orderPart,
  .orderReview,
  .orderJournalFilters { padding: 15px; border-radius: 17px; }
  .orderLine { padding: 13px; }
  .orderPart--compact,
  .orderLine--compact { padding: 0; }
  .orderPart__legend,
  .orderLine__legend { width: calc(100% - 20px); margin-inline: 10px; }
  .orderPart__body,
  .orderLine__body { padding: 10px 12px 14px; }
  .orderPart__summary,
  .orderLine__summary { grid-column: 1 / -1; }
  .orderPart__toggle,
  .orderLine__toggle { min-width: 44px; grid-row: 1; }
  .orderLineFields,
  .productSearchRow,
  .quantityFacts { grid-template-columns: 1fr; }
  .productSearchRow button,
  .partActions > *,
  .journalFilterActions > *,
  .duplicateActions > * { width: 100%; }
  .partActions,
  .journalFilterActions { align-items: stretch; flex-direction: column; }
  .orderJournalCard { padding: 14px; }
  .compositionHeading,
  .historyHeading { align-items: flex-start; flex-direction: column; }
  .siblingOrders li a { grid-template-columns: 1fr; }
  .historyChanges span { margin: 3px 0 0; display: block; }
  .statusActionButtons { flex-direction: column; }
  .statusActionButtons > button { width: 100%; flex-basis: auto; }
}

/* Dynamic report previews */
.reportPage,
.reportPreview,
.reportMatrixShell { min-width: 0; max-width: 100%; }

.reportPage { display: grid; align-content: start; gap: 20px; }
.reportPageHeader .lead { max-width: 820px; }

.reportFilters {
  margin-top: 10px;
  padding: 18px;
  gap: 16px;
  background: rgba(255, 255, 255, .84);
  border: 1px solid rgba(55, 99, 69, .14);
  border-radius: 20px;
  box-shadow: 0 12px 34px rgba(27, 49, 34, .05);
}

.reportFilterGrid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: 14px;
}

.reportFilterGrid > label,
.reportReferenceGrid label { min-width: 0; margin: 0; display: grid; gap: 7px; }

.reportChoiceGroup {
  min-width: 0;
  min-height: 92px;
  margin: 0;
  padding: 9px 12px;
  display: flex;
  align-content: flex-start;
  flex-wrap: wrap;
  gap: 5px 15px;
  border: 1px solid #d2dad3;
  border-radius: 14px;
}

.reportChoiceGroup legend { padding: 0 5px; font-size: 13px; font-weight: 800; }
.reportChoiceGroup .checkboxLabel { min-height: 44px; margin: 0; display: flex; align-items: center; gap: 8px; }

.reportReferenceFilters { grid-column: 1 / -1; min-width: 0; }
.reportReferenceFilters summary {
  min-height: 44px;
  padding: 10px 13px;
  color: #315d3f;
  font-weight: 750;
  background: #eef3ee;
  border-radius: 12px;
  cursor: pointer;
}

.reportReferenceGrid {
  min-width: 0;
  margin-top: 13px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.reportActions,
.reportPreviewActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.reportActions button,
.reportPreviewActions button { margin: 0; }
.loadingSheetFilters .reportFilterGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.reportValidation,
.reportWarnings {
  padding: 14px 16px;
  color: #762e2b;
  background: #faeceb;
  border: 1px solid #eed3d0;
  border-radius: 14px;
}

.reportStaleAlert {
  padding: 14px 16px;
  color: #6d420d;
  background: #fff3d9;
  border: 1px solid #e8c982;
  border-radius: 14px;
}

.reportStaleAlert p { margin: 5px 0 0; }
.reportActionHint { margin: 0; color: #695820; font-size: 14px; }

.reportWarnings strong { display: block; }
.reportWarnings ul { margin: 8px 0 0; padding-left: 20px; }
.reportWarnings li + li { margin-top: 5px; }
.reportPrompt { margin: 0; padding: 15px 17px; color: #59685e; background: #eef3ee; border-radius: 14px; }

.reportPreview { display: grid; gap: 16px; }
.reportMetadata {
  min-width: 0;
  padding: 14px 16px;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px 24px;
  color: #59675e;
  background: rgba(255, 255, 255, .78);
  border: 1px solid #dce5dd;
  border-radius: 15px;
}

.reportMetadata span { min-width: 0; overflow-wrap: anywhere; }
.reportEmptyResult { display: grid; justify-items: start; gap: 12px; }
.reportEmptyResult .emptyState { width: 100%; margin: 0; }

.reportScrollHint { margin: 0 0 8px; color: #627066; font-size: 13px; }
.reportMatrixRegion {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  background: rgba(255, 255, 255, .94);
  border: 1px solid #d8e2d9;
  border-radius: 17px;
  box-shadow: 0 13px 34px rgba(27, 49, 34, .06);
}

.reportMatrixRegion:focus-visible { outline-offset: 4px; }
.reportMatrix {
  width: max-content;
  min-width: 100%;
  border-spacing: 0;
  border-collapse: separate;
  color: #25342a;
  font-variant-numeric: tabular-nums;
}

.reportMatrix caption {
  padding: 14px 16px;
  color: #405448;
  font-weight: 800;
  text-align: left;
  caption-side: top;
}

.reportMatrix th,
.reportMatrix td {
  min-width: 118px;
  padding: 12px 14px;
  text-align: right;
  vertical-align: top;
  border-top: 1px solid #e2e8e2;
  border-left: 1px solid #edf1ed;
}

.reportMatrix thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  min-height: 48px;
  color: #294535;
  text-align: center;
  background: #eef3ee;
}

.reportMatrix th > span,
.reportMatrix th > small { display: block; }
.reportMatrix th > small { margin-top: 3px; color: #69776e; font-size: 12px; font-weight: 500; }
.reportMatrix .reportRowHeading {
  position: sticky;
  z-index: 1;
  left: 0;
  min-width: 190px;
  max-width: 260px;
  color: #26392d;
  text-align: left;
  background: #fbfcfa;
  border-left: 0;
  overflow-wrap: anywhere;
}

.reportMatrix thead .reportRowHeading { z-index: 3; background: #e8efe9; }
.reportMatrix .reportChildColumn { background: #f4f7f4; }
.reportMatrix .reportGrandTotal { color: #1f4d30; font-weight: 850; background: #edf5ef; }
.reportMatrix tfoot th,
.reportMatrix tfoot td { font-weight: 850; background: #f1f5f1; }
.reportMatrix tfoot .reportRowHeading { z-index: 1; background: #e8efe9; }
.reportMatrix .reportPackagingRow th,
.reportMatrix .reportPackagingRow td { color: #506158; background: #f7f8f5; }
.reportMatrix .reportCashRow th { color: #694614; }

.reportGroupToggle {
  min-height: 44px;
  margin: 8px auto 0;
  padding: 7px 10px;
  color: #315d3f;
  font-size: 12px;
  line-height: 1.2;
  background: white;
  border: 1px solid #cbd8cd;
  border-radius: 10px;
}

.reportGroupToggle:hover { color: #244a32; background: #e2ebe3; }

@media (max-width: 760px) {
  .reportFilterGrid,
  .reportReferenceGrid { grid-template-columns: 1fr; }
  .loadingSheetFilters .reportFilterGrid { grid-template-columns: 1fr; }
  .reportMetadata { align-items: stretch; flex-direction: column; gap: 6px; }
}

@media (max-width: 480px) {
  .reportFilters { padding: 14px; border-radius: 17px; }
  .reportActions,
  .reportPreviewActions { align-items: stretch; flex-direction: column-reverse; }
  .reportActions > *,
  .reportPreviewActions > * { width: 100%; }
  .reportChoiceGroup { flex-direction: column; }
  .reportMatrix .reportRowHeading { min-width: 155px; max-width: 190px; }
  .reportMatrix thead .reportRowHeading {
    left: auto;
    z-index: 2;
  }
  .reportMatrix th,
  .reportMatrix td { min-width: 105px; padding: 10px 11px; }
}

/* Staff notification queue and client Push settings */
.notificationBadge {
  min-width: 22px;
  height: 22px;
  margin-left: 7px;
  padding: 0 6px;
  display: inline-grid;
  place-items: center;
  color: white;
  font-size: 12px;
  line-height: 1;
  background: #b2453f;
  border-radius: 999px;
}

.notificationPageHeader {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.notificationPageHeader .lead { margin-bottom: 0; }
.notificationUnreadFilter {
  min-height: 44px;
  margin: 0;
  padding: 10px 13px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: #f7f9f6;
  border: 1px solid #d6e0d7;
  border-radius: 12px;
}

.notificationUnreadFilter input { width: 18px; height: 18px; margin: 0; }
.notificationList {
  margin: 28px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
  list-style: none;
}

.notificationCard {
  padding: 20px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid #dce4dc;
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(34, 61, 42, .05);
}

.notificationCard.isUnread {
  background: #f4f9f4;
  border-color: #9dbca5;
  box-shadow: inset 4px 0 #477553, 0 8px 24px rgba(34, 61, 42, .06);
}

.notificationCardHeading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 18px;
}

.notificationCardHeading h2 { margin: 5px 0 0; font-size: 21px; }
.notificationCardHeading time { color: #68756d; white-space: nowrap; }
.notificationState { color: #376345; font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.notificationFacts {
  margin: 18px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.notificationFacts div { min-width: 0; }
.notificationFacts dt { color: #718078; font-size: 12px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.notificationFacts dd { margin: 4px 0 0; color: #24372c; overflow-wrap: anywhere; }
.notificationActions { margin-top: 18px; justify-content: flex-start; }
.notificationActions a { min-height: 44px; padding: 10px 15px; display: inline-flex; align-items: center; color: white; font-weight: 750; background: #376345; border-radius: 11px; text-decoration: none; }
.notificationEmpty { text-align: center; }
.notificationLoadMore { margin: 20px auto 0; display: block; }

.pushSettingsError { color: #772c2c; }
.pushSubscriptionList { margin: 10px 0 0; padding: 0; display: grid; gap: 8px; list-style: none; }
.pushSubscriptionList li { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pushSubscriptionList span { min-width: 0; overflow-wrap: anywhere; }

@media (max-width: 640px) {
  .notificationPageHeader,
  .notificationCardHeading,
  .pushSubscriptionList li { align-items: stretch; flex-direction: column; }
  .notificationCardHeading time { white-space: normal; }
  .notificationUnreadFilter { width: 100%; }
  .notificationFacts { grid-template-columns: 1fr; }
  .pushSubscriptionList button { width: 100%; }
}

/* Feature 010: canonical staff shell and reusable dense surfaces. */
.staffApp {
  --staff-background: #f5f6f5;
  --staff-surface: #fff;
  --staff-text: #1b1e1c;
  --staff-secondary: #3e443f;
  --staff-muted: #6b716d;
  --staff-border: #e2e5e3;
  --staff-row-divider: #f0f2f0;
  --staff-accent: #1f7a4d;
  --staff-accent-strong: #155a39;
  --staff-accent-soft: #eef5f0;
  --staff-selected: #eef5f0;
  --staff-radius: 6px;
  --staff-topbar-height: 52px;
  --staff-page-header-height: 48px;
  --staff-row-padding-block: 9px;
  --staff-control-height: 32px;
  color: var(--staff-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  background: var(--staff-background);
}

.staffApp.density-compact {
  --staff-row-padding-block: 5px;
}

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

.staffApp .staffTopbar {
  position: sticky;
  z-index: 40;
  top: 0;
  height: var(--staff-topbar-height);
  min-height: var(--staff-topbar-height);
  padding: 0 16px;
  gap: 16px;
  background: var(--staff-surface);
  border-color: var(--staff-border);
  box-shadow: inset 0 -1px var(--staff-border);
}

.staffUpdateNotice {
  min-height: 40px;
  margin: 0;
  padding: 6px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #5a4512;
  font-size: 12px;
  background: #fff8dc;
  border-bottom: 1px solid #eadca5;
}

.staffUpdateNotice p { margin: 0; }
.staffUpdateNotice button {
  min-height: 30px;
  margin: 0;
  padding: 0 10px;
  flex: 0 0 auto;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  background: var(--staff-accent);
  border: 1px solid var(--staff-accent);
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffUpdateNotice button:hover:not(:disabled) { background: var(--staff-accent-strong); }
.staffUpdateNotice button:disabled { cursor: wait; opacity: .65; }

.staffTopbar__leading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.staffTopbar .brandMark {
  width: 24px;
  height: 24px;
  border-radius: 5px;
  background: var(--staff-accent);
}

.staffTopbar .brandLink { min-height: 30px; font-size: 14px; font-weight: 600; }

.staffMenuButton,
.staffDensityButton {
  min-height: 30px;
  padding: 0 10px;
  color: var(--staff-secondary);
  font-weight: 500;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.staffMenuButton:hover,
.staffDensityButton:hover { color: #183d29; background: #e7eee8; }
.staffMenuButton { display: none; font-size: 20px; }
.staffDensityButton { font-size: 13px; }

.staffTopbar__leading { flex: 0 0 auto; }
.staffPrimaryNavigation {
  min-width: 0;
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  gap: 2px;
  overflow: hidden;
}

.staffPrimaryNavigation a {
  min-height: 30px;
  padding: 6px 9px;
  display: inline-flex;
  align-items: center;
  color: var(--staff-muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  border-radius: var(--staff-radius);
  text-decoration: none;
}

.staffPrimaryNavigation a:hover { color: var(--staff-secondary); background: #f4f7f5; }
.staffPrimaryNavigation a.active { color: var(--staff-accent); background: var(--staff-selected); }

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

.staffMenu { position: relative; }
.staffTopbarMenuButton,
.staffAccountButton {
  min-height: 30px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--staff-secondary);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.staffTopbarMenuButton:hover,
.staffAccountButton:hover { color: var(--staff-accent); background: #f4f7f5; }
.staffAccountButton {
  min-width: 42px;
  padding-inline: 6px;
  border-color: transparent;
}

.staffAccountButton > span:first-child {
  width: 26px;
  height: 26px;
  display: inline-grid;
  place-items: center;
  color: #315c43;
  font-size: 11px;
  font-weight: 500;
  background: #dbe5df;
  border-radius: 50%;
}

.staffPopupMenu {
  position: absolute;
  z-index: 90;
  top: calc(100% + 6px);
  right: 0;
  width: max-content;
  min-width: 210px;
  padding: 6px;
  display: grid;
  gap: 2px;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: 0 10px 26px rgba(27, 30, 28, .12);
}

.staffPopupMenu a,
.staffPopupMenu button[role="menuitem"] {
  width: 100%;
  min-height: 32px;
  padding: 6px 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--staff-secondary);
  font: inherit;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 4px;
  text-decoration: none;
}

.staffPopupMenu a:hover,
.staffPopupMenu button[role="menuitem"]:hover,
.staffPopupMenu a.active { color: var(--staff-accent); background: var(--staff-selected); }
.staffAccountMenu__identity {
  padding: 8px 9px 10px;
  display: grid;
  gap: 2px;
  border-bottom: 1px solid var(--staff-border);
}

.staffAccountMenu__identity strong { font-size: 13px; font-weight: 500; }
.staffAccountMenu__identity span { color: var(--staff-muted); font-size: 12px; }

.staffWorkspace {
  min-height: calc(100dvh - var(--staff-topbar-height));
  display: block;
}

.staffSidebar {
  overflow-y: auto;
  background: #f8faf8;
  border-right: 1px solid var(--staff-border);
}

.staffMobileNavHeader {
  min-height: 52px;
  padding: 4px 10px 4px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--staff-text);
  background: #fff;
  border-bottom: 1px solid var(--staff-border);
}

.staffMobileNavHeader strong { font-size: 14px; font-weight: 600; }
.staffMobileNavClose {
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  color: var(--staff-secondary);
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
  background: transparent;
  border: 0;
  border-radius: var(--staff-radius);
  box-shadow: none;
}
.staffMobileNavClose:hover { color: var(--staff-accent); background: var(--staff-selected); }

.staffApp .sectionNav {
  width: auto;
  min-height: 0;
  padding: 18px 12px 28px;
  display: grid;
  align-content: start;
  gap: 20px;
  overflow: visible;
  background: transparent;
  border: 0;
}

.staffMobileAccountActions {
  margin: 0 12px max(18px, env(safe-area-inset-bottom));
  padding: 16px 10px 0;
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--staff-border);
}

.staffApp .staffMobileAccountActions .staffNavGroupLabel { margin: 0 2px 2px; }
.staffMobileAccountActions .staffDensityButton,
.staffMobileAccountActions .secondaryAction {
  width: 100%;
  min-height: 44px;
}

.staffApp .staffNavGroupLabel {
  margin: 0 10px 6px;
  color: #68756d;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  line-height: 1.3;
  text-transform: uppercase;
}

.staffApp .sectionNav a {
  min-height: var(--staff-control-height);
  padding: 9px 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #48574d;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
  border-radius: 9px;
  text-decoration: none;
}

.staffApp .sectionNav a:hover { color: #183d29; background: #edf2ee; }
.staffApp .sectionNav a.active {
  color: #124b30;
  background: var(--staff-accent-soft);
  box-shadow: inset 3px 0 var(--staff-accent);
}

.staffContent {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.staffContent > .globalError { width: 100%; margin: 0 0 18px; }
.staffNavBackdrop { display: none; }

.staffPageHeader {
  min-height: var(--staff-page-header-height);
  margin: 0;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--staff-surface);
  border-bottom: 1px solid var(--staff-border);
}

.staffPageHeader h1 {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}
.staffPageHeader__description {
  max-width: 780px;
  margin: 2px 0 0;
  color: var(--staff-muted);
  font-size: 12px;
  line-height: 1.3;
}

.staffPageHeader__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }

.staffFilterBarSurface {
  margin: 0;
  padding: 8px 16px;
  background: var(--staff-surface);
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.staffFilterBar { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.staffFilterBar__fields { min-width: 0; display: flex; align-items: end; flex: 1; flex-wrap: wrap; gap: 10px; }
.staffFilterBar__fields > label { min-width: min(210px, 100%); flex: 1 1 210px; margin: 0; }
.staffFilterBar__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.staffFilterBar__summary { margin-top: 10px; color: var(--staff-muted); font-size: 13px; }
.staffApp .staffFilterBar button,
.staffApp .staffFilterBar input,
.staffApp .staffFilterBar select { min-height: var(--staff-control-height); }

.staffDataTableScroll {
  max-width: 100%;
  overflow: auto;
  background: var(--staff-surface);
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.staffDataTable { width: 100%; border-spacing: 0; border-collapse: separate; font-size: 13px; }
.staffDataTable caption { padding: 8px 10px; color: var(--staff-secondary); font-weight: 500; text-align: left; }
.staffDataTable thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  padding: 8px 10px;
  color: var(--staff-muted);
  font-size: 12px;
  font-weight: 500;
  text-align: left;
  background: #fafbfa;
  border-bottom: 1px solid var(--staff-border);
}

.staffDataTable thead th button {
  min-height: 32px;
  padding: 0;
  justify-content: flex-start;
  color: inherit;
  font: inherit;
  background: transparent;
  border-radius: 5px;
}

.staffDataTable thead th button:hover { color: #17462e; background: transparent; }
.staffDataTable tbody th,
.staffDataTable tbody td {
  padding: var(--staff-row-padding-block) 10px;
  color: var(--staff-text);
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--staff-row-divider);
}

.staffDataTable tbody th { font-weight: 500; }
.staffDataTable tbody tr:last-child > * { border-bottom: 0; }
.staffDataTable :is(button, a)[data-row-primary-action] {
  width: auto;
  min-width: 0;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 0;
  display: inline;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-align: inherit;
  text-decoration: none;
  background: transparent;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  appearance: none;
}

.staffDataTable :is(button, a)[data-row-primary-action]:hover {
  color: var(--staff-accent);
  text-decoration: underline;
  background: transparent;
}

.staffDataTable :is(button, a)[data-row-primary-action]:focus-visible {
  color: var(--staff-accent);
  outline: 2px solid var(--staff-accent);
  outline-offset: 2px;
  background: transparent;
}

@media (max-width: 820px), (pointer: coarse) {
  .staffDataTable :is(button, a)[data-row-primary-action] {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

.staffDataTable tbody tr.staffDataTable__interactiveRow { cursor: pointer; }
.staffDataTable tbody tr.staffDataTable__interactiveRow:hover > *,
.staffDataTable tbody tr.staffDataTable__interactiveRow:focus-within > * { background: #f8faf8; }
.staffDataTable__empty { padding: 30px !important; color: var(--staff-muted) !important; text-align: center !important; }
.staffTableMuted { color: var(--staff-muted); font-size: 13px; }

.journalViewSwitch {
  width: fit-content;
  max-width: 100%;
  margin-bottom: 14px;
  padding: 4px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  background: #e8ede9;
  border: 1px solid var(--staff-border);
  border-radius: 12px;
}

.journalViewSwitch button {
  min-height: var(--staff-control-height);
  padding-inline: 15px;
  color: #45554a;
  font-size: 14px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 9px;
}

.journalViewSwitch button:hover { color: #173d28; background: rgba(255, 255, 255, .6); }
.journalViewSwitch button[aria-pressed="true"] {
  color: #174b31;
  background: #fff;
  border-color: #cfd9d1;
  box-shadow: 0 2px 7px rgba(27, 56, 36, .07);
}

.journalViewSwitch > span { padding: 8px 10px; color: var(--staff-muted); font-size: 13px; }
.orderJournalPage {
  position: relative;
}

.staffApp.density-compact .orderJournalPage {
  --journal-control-height: 30px;
}

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

.orderJournalFilters {
  min-width: 0;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  gap: 6px;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.orderJournalFilters .staffFilterBar__fields {
  min-width: 0;
  align-items: center;
  flex-wrap: nowrap;
  gap: 6px;
}

.orderJournalFilters .journalSearchFilter {
  min-width: 94px;
  margin: 0;
  flex: 1 1 126px;
}

.orderJournalFilters .journalSearchFilter input {
  min-height: var(--journal-control-height);
  padding-inline: 10px;
  font-size: 13px;
  border-radius: 8px;
}

.journalStatusDisclosure,
.journalMoreFilters {
  position: relative;
  min-width: 0;
  padding: 0;
  flex: 0 0 auto;
}

.journalStatusDisclosure summary,
.journalMoreFilters summary {
  width: fit-content;
  min-height: var(--journal-control-height);
  padding: 0 8px;
  display: flex;
  align-items: center;
  color: #315d3f;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.1;
  white-space: nowrap;
  background: #eef3ee;
  border: 1px solid #d5ddd6;
  border-radius: 8px;
  cursor: pointer;
}

.journalStatusDisclosure[open] > summary,
.journalMoreFilters[open] > summary { color: #173d28; background: #e3ede5; }

.orderJournalFilters .journalStatusFilter {
  position: absolute;
  z-index: 14;
  top: calc(100% + 6px);
  left: 0;
  width: max-content;
  min-width: 220px;
  margin: 0;
  padding: 10px;
  display: grid;
  gap: 4px;
  background: #fff;
  border: 1px solid #cfd9d1;
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.orderJournalFilters .journalStatusFilter legend { padding-inline: 4px; color: #58665d; font-size: 12px; font-weight: 500; }
.orderJournalFilters .journalStatusFilter label { min-width: 0; min-height: 30px; margin: 0; font-size: 13px; font-weight: 500; }
.orderJournalFilters .journalStatusFilter input { width: 19px; min-height: 19px; }

.journalMoreGrid {
  position: absolute;
  z-index: 14;
  top: calc(100% + 6px);
  left: 50%;
  width: min(780px, calc(100vw - 32px));
  margin: 0;
  padding: 12px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  background: #fff;
  border: 1px solid #cfd9d1;
  border-radius: var(--staff-radius);
  box-shadow: none;
  transform: translateX(-50%);
}

.journalMoreGrid label { min-width: 0; margin: 0; font-size: 12px; }
.journalMoreGrid input,
.journalMoreGrid select {
  min-height: 40px;
  padding: 7px 10px;
  font-size: 13px;
  border-radius: 9px;
}

.orderJournalFilters .staffFilterBar__actions {
  flex-wrap: nowrap;
  gap: 5px;
}

.orderJournalFilters .staffFilterBar__actions button {
  min-height: var(--journal-control-height);
  padding-inline: 9px;
  font-size: 12px;
  white-space: nowrap;
  border-radius: 8px;
}

.orderJournalPage .orderJournalTable .staffDataTable thead th {
  line-height: 1.1;
  white-space: nowrap;
}

.orderJournalPage .orderJournalTable .staffDataTable thead th button {
  white-space: nowrap;
}

.orderJournalPage .orderJournalTable .staffDataTable tbody th,
.orderJournalPage .orderJournalTable .staffDataTable tbody td {
  line-height: 1.2;
  white-space: nowrap;
}

.orderJournalPage .staffStatusBadge {
  min-height: 24px;
  padding: 3px 7px;
  font-size: 11px;
}

.orderJournalRowActions { display: flex; align-items: center; flex-wrap: nowrap; gap: 6px; }
.orderJournalPage .orderJournalRowActions .secondaryButton {
  white-space: nowrap;
  border-radius: 7px;
}

.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable { font-size: 12px; }
.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable thead th { height: 24px; }
.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable thead th button { min-height: 24px; }
.staffApp.density-compact .orderJournalPage .staffStatusBadge { min-height: 22px; padding-block: 2px; }
.staffApp.density-compact .orderJournalPage .orderJournalRowActions .secondaryButton,
.staffApp.density-compact .orderJournalPage .orderJournalRowActions .secondaryAction { min-height: 24px; }

.orderJournalTable .staffDataTable tbody tr.status-cancelled > * { background: #fffafa; }
.orderJournalQuickDetail .orderFacts { margin-top: 0; display: block; }
.orderJournalQuickDetail .orderFacts > div {
  padding: 7px 0;
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 10px;
  border-bottom: 1px solid var(--staff-row-divider);
}
.orderJournalQuickDetail .orderFacts dt { align-self: start; }
.orderJournalQuickDetail .orderFacts dd { margin: 0; font-weight: 500; }
.orderJournalQuickDetail h3 { margin: 24px 0 10px; font-size: 17px; }
.orderJournalQuickDetail ol { margin: 0; padding-left: 22px; display: grid; gap: 8px; }
.orderJournalQuickDetail li span { color: var(--staff-muted); font-size: 13px; }

@media (max-width: 820px), (pointer: coarse) {
  .orderJournalPage {
    --journal-control-height: 44px;
    --journal-row-padding-block: 8px;
    margin-top: 0;
  }

  .journalFilterLabel {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
    clip-path: none;
    white-space: normal;
  }

  .orderJournalFilters,
  .orderJournalFilters .staffFilterBar__fields {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
    flex-wrap: nowrap;
  }

  .orderJournalFilters .journalSearchFilter { width: 100%; flex: 0 0 auto; }
  .orderJournalFilters .journalSearchFilter input { min-height: 44px; margin-top: 5px; font-size: 16px; }
  .journalStatusDisclosure,
  .journalMoreFilters { width: 100%; }
  .journalStatusDisclosure summary,
  .journalMoreFilters summary { width: 100%; min-height: 44px; font-size: 14px; }

  .orderJournalFilters .journalStatusFilter,
  .journalMoreGrid {
    position: static;
    width: 100%;
    min-width: 0;
    max-width: none;
    margin-top: 6px;
    transform: none;
    box-shadow: none;
  }

  .orderJournalFilters .journalStatusFilter label { min-height: 44px; }
  .journalMoreGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .journalMoreGrid input,
  .journalMoreGrid select { min-height: 44px; font-size: 16px; }
  .orderJournalFilters .staffFilterBar__actions { width: 100%; }
  .orderJournalFilters .staffFilterBar__actions button { min-height: 44px; flex: 1 1 120px; font-size: 14px; }

  .orderJournalPage .orderJournalTable .staffDataTable tbody th,
  .orderJournalPage .orderJournalTable .staffDataTable tbody td { padding-block: 8px; }
  .orderJournalPage .staffStatusBadge { min-height: 26px; padding: 4px 9px; font-size: 12px; }
  .staffApp.density-compact .orderJournalPage .orderJournalRowActions .secondaryButton,
  .staffApp.density-compact .orderJournalPage .orderJournalRowActions .secondaryAction,
  .orderJournalPage .orderJournalRowActions .secondaryButton,
  .orderJournalPage .orderJournalRowActions .secondaryAction { min-height: 44px; }
}

@media (max-width: 480px) {
  .journalMoreGrid { grid-template-columns: minmax(0, 1fr); }
  .orderJournalFilters .staffFilterBar__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .orderJournalFilters .staffFilterBar__actions button {
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    white-space: normal;
  }
}

.staffStatusBadge {
  min-height: 26px;
  padding: 4px 9px;
  display: inline-flex;
  align-items: center;
  color: #435047;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  background: #edf0ed;
  border-radius: 999px;
}

.staffStatusBadge--info { color: #174a6c; background: #e6f2f8; }
.staffStatusBadge--success { color: #1a5938; background: #e3f3e8; }
.staffStatusBadge--warning { color: #6c4b0b; background: #f8efcf; }
.staffStatusBadge--danger { color: #7d302e; background: #f8e5e3; }

.staffPagination {
  min-height: 40px;
  margin: 0;
  padding: 6px 16px;
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto minmax(170px, 1fr);
  align-items: center;
  gap: 12px;
  background: var(--staff-surface);
  border-top: 1px solid var(--staff-border);
}

.staffPagination__range { margin: 0; color: var(--staff-muted); font-size: 13px; }
.staffPagination__pages { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px; }
.staffPagination__pages button {
  min-width: 26px;
  min-height: 26px;
  padding: 0 8px;
  color: #315d3f;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.staffPagination__pages button:hover { color: #173d28; background: #edf3ee; }
.staffPagination__pages button[aria-current="page"] { color: white; background: var(--staff-accent); border-color: var(--staff-accent); }
.staffPagination__pages button:disabled { color: #849087; background: #edf0ed; }
.staffPagination__ellipsis { padding: 0 3px; color: var(--staff-muted); }
.staffPagination__pageSize { margin: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--staff-muted); font-size: 13px; }
.staffPagination__pageSize select { width: auto; min-height: 26px; padding: 0 28px 0 8px; }

.staffDetailDrawerBackdrop {
  position: fixed;
  z-index: 80;
  inset: 0;
  display: flex;
  justify-content: flex-end;
  background: rgba(18, 31, 23, .34);
}

.staffDetailDrawer {
  width: min(420px, 100%);
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  color: #26352c;
  overflow: hidden;
  background: #fff;
  border: 0;
  border-left: 1px solid var(--staff-border);
  box-shadow: none;
}

.staffDetailDrawer__header,
.staffDetailDrawer__footer { padding: 0 16px; display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; gap: 16px; border-bottom: 1px solid var(--staff-border); }
.staffDetailDrawer__header { min-height: 48px; }
.staffDetailDrawer__header h2 { font-size: 15px; font-weight: 600; letter-spacing: 0; }
.staffDetailDrawer__header button {
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  color: var(--staff-muted);
  font-size: 24px;
  font-weight: 400;
  background: transparent;
  border: 0;
  border-radius: 5px;
  box-shadow: none;
}
.staffDetailDrawer__description { margin: 0; padding: 14px 16px 0; flex: 0 0 auto; color: var(--staff-muted); }
.staffDetailDrawer__content { min-width: 0; min-height: 0; padding: 14px 16px; flex: 1 1 auto; overflow-y: auto; }
.staffDetailDrawer__footer { min-height: 52px; justify-content: flex-end; border-block: 1px solid var(--staff-border) 0; }
.staffDetailDrawer__footer :is(button, a) {
  min-height: 32px;
  margin: 0;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 6px;
  box-shadow: none;
}

.referenceEditorDrawer { width: min(400px, 100%); }
.referenceEditorDrawer .staffDetailDrawer__content { padding-top: 14px; }
.referenceEditorDrawer__body { display: grid; gap: 14px; }
.referenceEditorDrawer__body .editorForm,
.referenceEditorDrawer__body .formGrid { margin-top: 0; }
.referenceEditorDrawer__body .formActions {
  position: sticky;
  bottom: -14px;
  margin: 8px -16px -14px;
  padding: 14px 16px max(14px, env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, .98);
  border-top: 1px solid var(--staff-border);
}

.tradeObjectHierarchy__objectTable { min-width: 760px; }
.tradeObjectHierarchy__objectTable address { color: inherit; font-style: normal; overflow-wrap: anywhere; }
.tradeObjectHierarchy__objectTable td:nth-child(2) { max-width: 330px; }
.tradeObjectHierarchy__objectTable td:last-child { width: 1%; white-space: nowrap; }
.tradeObjectHierarchy__childPagination { margin-top: 12px; }

.staffAuditPage__eventTable { min-width: 920px; }
.staffAuditPage__eventTable td:nth-child(2) { min-width: 310px; }
.staffAuditPage__eventTable td:last-child { width: 1%; white-space: nowrap; }
.staffAuditPage__eventIdentity,
.staffAuditPage__eventContext { display: grid; gap: 4px; }
.staffAuditPage__eventIdentity span,
.staffAuditPage__eventContext span { color: var(--staff-muted); font-size: 12px; overflow-wrap: anywhere; }
.staffAuditPage__unchanged { color: var(--staff-muted); font-size: 12px; }
.staffAuditPage__eventRow--selected > * { background: #eef5ef !important; }
.staffAuditPage__safeDetails { box-shadow: none; }
.staffAuditPage__requestContext {
  margin: 14px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.staffAuditPage__requestContext div { min-width: 0; }
.staffAuditPage__requestContext dt { color: var(--staff-muted); font-size: 12px; }
.staffAuditPage__requestContext dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.staffAuditPage__decisionTable { min-width: 980px; }
.staffAuditPage__decisionTable td:nth-child(4) { max-width: 240px; overflow-wrap: anywhere; }

@media (max-width: 820px) {
  .staffApp.density-compact { --staff-control-height: 44px; }
  .staffMenuButton { display: inline-flex; }
  .staffSidebar {
    position: fixed;
    z-index: 70;
    top: 0;
    left: 0;
    width: min(320px, 88vw);
    height: 100dvh;
    display: block;
    padding-top: max(10px, env(safe-area-inset-top));
    visibility: hidden;
    transform: translateX(-105%);
    pointer-events: none;
    transition: transform .18s ease;
    box-shadow: 18px 0 40px rgba(16, 35, 22, .16);
  }
  .staffNavOpen .staffSidebar {
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;
  }
  .staffNavBackdrop {
    position: fixed;
    z-index: 60;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0;
    display: block;
    visibility: hidden;
    opacity: 0;
    background: rgba(18, 31, 23, .36);
    border: 0;
    border-radius: 0;
    pointer-events: none;
    transition: opacity .18s ease, visibility .18s ease;
  }
  .staffNavOpen .staffNavBackdrop { visibility: visible; opacity: 1; pointer-events: auto; }
  .staffContent { width: 100%; padding: 20px clamp(14px, 4vw, 24px); }
  .staffPageHeader { align-items: stretch; flex-direction: column; }
  .staffFilterBar { align-items: stretch; flex-direction: column; }
  .staffPagination { grid-template-columns: 1fr; justify-items: stretch; }
  .staffPagination__range { text-align: center; }
  .staffPagination__pageSize { justify-content: center; }
  .orderJournalTable .staffDataTable { min-width: 560px; }
  .orderJournalTable th:nth-child(3),
  .orderJournalTable td:nth-child(3),
  .orderJournalTable th:nth-child(6),
  .orderJournalTable td:nth-child(6),
  .orderJournalTable th:nth-child(7),
  .orderJournalTable td:nth-child(7) { display: none; }
}

@media (max-width: 820px), (pointer: coarse) {
  .staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable thead th button,
  .staffApp .orderJournalPage .orderJournalTable .staffDataTable thead th button,
  .staffApp .staffMenuButton,
  .staffApp .brandLink,
  .staffApp .staffDensityButton,
  .staffApp .staffDataTable thead th button,
  .staffApp .dictionaryGroupTable tbody th > button,
  .staffApp .orderPart__toggle,
  .staffApp .orderLine__toggle,
  .staffApp .journalStatusFilter .checkboxLabel,
  .staffApp .orderJournalRowActions .secondaryAction {
    min-width: 44px;
    min-height: 44px;
  }

  .staffApp .sectionNav a { min-height: 44px; }
}

@media (max-width: 600px) {
  .staffTopbar .staffDensityButton,
  .staffTopbar .secondaryAction { display: none; }
  .staffTopbar .brand > span:last-child { display: none; }
  .staffTopbar .secondaryButton { min-height: 44px; padding-inline: 12px; }
  .staffPageHeader__actions > * { width: 100%; }
  .staffFilterBar__actions > * { flex: 1 1 auto; }
  .staffDataTable { min-width: 720px; }
  .orderJournalTable .staffDataTable { min-width: 430px; }
  .orderJournalTable th:nth-child(5),
  .orderJournalTable td:nth-child(5) { display: none; }
  .journalViewSwitch { width: 100%; }
  .journalViewSwitch button { flex: 1 1 130px; }
  .orderJournalRowActions { align-items: stretch; flex-direction: column; }
  .orderJournalRowActions .secondaryButton,
  .orderJournalRowActions .secondaryAction { min-height: 44px; }
  .staffDetailDrawer { width: 100%; border: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .staffSidebar,
  .staffNavBackdrop { transition: none; }
}

@page { size: landscape; margin: 10mm; }

@media print {
  html,
  body { min-width: 0; color: #111; background: white; }

  .appPage { min-height: 0; background: white; }
  .appHeader,
  .sectionNav,
  .staffSidebar,
  .staffNavBackdrop,
  .skipLink,
  .globalError,
  .reportPage .reportFilters,
  .reportPage .reportPreviewActions,
  .loadingSheetPage .reportScrollHint,
  .reportPage .reportActionHint,
  .reportPage .successMessage { display: none !important; }

  .staffWorkspace { min-height: 0; display: block; }
  .staffContent { width: 100%; max-width: none; margin: 0; padding: 0; }

  .appContent {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .loadingSheetPage,
  .loadingSheetPage .reportPreview { display: block; }
  .loadingSheetPage .reportPageHeader .eyebrow,
  .loadingSheetPage .reportPageHeader .lead { display: none; }
  .loadingSheetPage .reportPageHeader { margin-bottom: 4mm; }
  .loadingSheetPage h1 { font-size: 20pt; }

  .loadingSheetPage .reportMetadata,
  .loadingSheetPage .reportWarnings {
    margin: 0 0 3mm;
    padding: 0;
    color: #111;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .loadingSheetPage .reportMetadata { display: flex; gap: 2mm 7mm; }
  .loadingSheetPage .reportMatrixShell,
  .loadingSheetPage .reportMatrixRegion {
    width: 100%;
    max-width: none;
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .loadingSheetPage .reportMatrix {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 8pt;
  }

  .loadingSheetPage .reportMatrix caption {
    padding: 0 0 2mm;
    color: #111;
    font-size: 11pt;
  }

  .loadingSheetPage .reportMatrix thead { display: table-header-group; }
  .loadingSheetPage .reportMatrix tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .loadingSheetPage .reportMatrix th,
  .loadingSheetPage .reportMatrix td,
  .loadingSheetPage .reportMatrix .reportRowHeading {
    position: static;
    z-index: auto;
    min-width: 0;
    max-width: none;
    padding: 1.5mm;
    color: #111;
    background: transparent;
    border: 1px solid #777;
  }

  .loadingSheetPage .reportMatrix .reportRowHeading { width: 25%; }
}

/* Canonical chat state styling layered over the shared conversation primitives. */
.clientChatSurface .clientChatToolbar {
  flex: 0 0 auto;
}

.clientChatSurface .clientChatIdentity {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.clientChatSurface .clientChatIdentityMark {
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 14px;
  background: var(--client-chat-accent);
}

.clientChatSurface .clientChatHeading .eyebrow {
  letter-spacing: .01em;
  text-transform: none;
}

.clientChatSurface .clientChatHeading h1 {
  margin: 0;
  line-height: 1.2;
}

.clientChatSurface .chatConnectionState {
  position: relative;
  color: #245c3e;
  border: 1px solid #d7e7db;
}

.clientChatSurface .chatConnectionState::before {
  position: absolute;
  left: 11px;
  width: 7px;
  height: 7px;
  content: "";
  background: #2d8158;
  border-radius: 50%;
}

.clientChatSurface .chatConnectionState-offline::before { background: #a66b16; }
.clientChatSurface .chatConnectionState-reconnecting::before { background: #376e96; }

.clientChatSurface .clientChatTimeline {
  gap: 13px;
  scrollbar-gutter: stable;
}

.clientChatSurface .chatMessage {
  color: #242a26;
  background: var(--client-chat-surface);
  border-color: var(--client-chat-border);
}

.clientChatSurface .chatMessage-client {
  color: white;
  background: var(--client-chat-accent);
  border-color: var(--client-chat-accent);
  box-shadow: none;
}

.clientChatSurface .chatMessageMeta time { color: var(--client-chat-muted); }
.clientChatSurface .chatMessage-client .chatMessageMeta time,
.clientChatSurface .chatMessage-client .chatDeliveryState { color: rgba(255, 255, 255, .88); }

.clientChatSurface .chatMessage-local {
  color: #26352c;
  background: #e7f1e9;
  border-color: #83aa91;
}

.clientChatSurface .chatMessage-local .chatMessageMeta time,
.clientChatSurface .chatMessage-local .chatDeliveryState { color: #4e6556; }

.clientChatSurface .chatSummaryPart {
  background: #f7f8f7;
  border: 1px solid #e7ebe8;
}

.clientChatSurface .chatChoice {
  color: #205d3d;
  background: #f6faf7;
  border-color: #b8d0c0;
}

.clientChatSurface .chatChoice:hover { color: #153e29; background: #e9f2ec; }
.clientChatSurface .chatConfirmationHint { color: #1d5337; background: #e9f3ec; }
.clientChatSurface .chatResultOrders li { background: #eef5f0; border: 1px solid #dce9e0; }

.clientChatSurface .chatAttachmentStub a {
  color: #1c5b3a;
  background: rgba(255, 255, 255, .94);
  border-color: #d3dfd7;
}

.clientChatSurface .chatDeliveryState {
  gap: 6px;
}

.clientChatSurface .chatDeliveryState::before {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  content: "";
  background: currentColor;
  border-radius: 50%;
}

.clientChatSurface .chatLoadOlder,
.clientChatSurface .chatNewMessages {
  z-index: 2;
  margin: 8px auto;
  color: #245c3e;
  background: white;
  border-color: var(--client-chat-border);
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(27, 33, 29, .07);
}

.clientChatSurface .chatOutboxNotice,
.clientChatSurface .chatAssistantProgress { padding: 5px 14px; background: var(--client-chat-canvas); }

.clientChatSurface .chatUpdateNotice,
.clientChatSurface .chatError,
.clientChatSurface .chatPwaTools { margin: 8px 14px 0; }

.clientChatSurface .clientChatComposer {
  position: relative;
  flex: 0 0 auto;
  gap: 7px;
  border: 0;
  border-radius: 0;
}

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

.clientChatSurface .chatAttachmentActions { justify-content: flex-start; }
.clientChatSurface .chatAttachmentTrigger {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #3e4a42;
  background: white;
  border: 1px solid #dce3de;
}

.clientChatSurface .chatAttachmentTrigger > span:first-child {
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

.clientChatSurface .chatAttachmentLimits,
.clientChatSurface .chatAttachmentRecognitionNote { font-size: 12px; line-height: 1.35; }

.clientChatSurface .chatComposer textarea {
  background: #fafbfa;
  border: 1px solid #dce3de;
}

.clientChatSurface .chatComposer textarea:focus {
  background: white;
  border-color: #6fa184;
}

.clientChatSurface .chatSendButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: white;
  background: var(--client-chat-accent);
}

.clientChatSurface .chatSendButton:hover { background: var(--client-chat-accent-strong); }
.clientChatSurface .chatSendButtonIcon { font-size: 20px; line-height: 1; }

@media (min-width: 821px) and (pointer: fine) {
  .staffApp .orderJournalPage > .staffFilterBarSurface { padding: 5px 16px; }
}

@media (max-width: 360px) {
  .clientChatSurface .clientChatIdentityMark { display: none; }
  .clientChatSurface .chatAttachmentTrigger > span:last-child { display: none; }
  .clientChatSurface .chatAttachmentTrigger { width: 44px; padding: 0; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .clientChatSurface *,
  .clientChatSurface *::before,
  .clientChatSurface *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Feature 010 final cascade: approved dense journal and agent-chat prototypes. */
.orderJournalPage {
  --journal-control-height: 32px;
  --journal-row-padding-block: 6px;
  width: 100%;
  height: calc(100dvh - var(--staff-topbar-height));
  min-height: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.staffApp.density-compact .orderJournalPage { --journal-row-padding-block: 3px; }

.orderJournalPage > .orderJournalPageHeader { flex: 0 0 var(--staff-page-header-height); }
.orderJournalPage > .staffFilterBarSurface {
  flex: 0 0 auto;
  margin: 0;
  padding: 5px 16px;
  background: var(--staff-surface);
  border-width: 0 0 1px;
  border-radius: 0;
}

.orderJournalPage .orderJournalFilters,
.orderJournalPage .orderJournalFilters .staffFilterBar__fields {
  min-width: 0;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 8px;
}

.orderJournalPage .journalViewSwitch { margin: 0; padding: 0; gap: 0; border-radius: var(--staff-radius); }
.orderJournalPage .journalViewSwitch button {
  min-height: var(--journal-control-height);
  padding-inline: 12px;
  color: var(--staff-secondary);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border-radius: 0;
}

.orderJournalPage .journalViewSwitch button[aria-pressed="true"] {
  color: #fff;
  background: var(--staff-accent);
  border-color: var(--staff-accent);
  box-shadow: none;
}

.orderJournalPage .journalStatusDisclosure summary,
.orderJournalPage .journalMoreFilters summary,
.orderJournalPage .orderJournalFilters .staffFilterBar__actions button {
  min-height: var(--journal-control-height);
  padding-inline: 10px;
  color: var(--staff-secondary);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border-color: var(--staff-border);
  border-radius: var(--staff-radius);
}

.orderJournalPage .orderJournalTable {
  min-width: 0;
  min-height: 0;
  flex: 1 1 auto;
  background: var(--staff-surface);
  border: 0;
  border-radius: 0;
}

.orderJournalPage .orderJournalTable .staffDataTable { min-width: 1180px; font-size: 13px; }
.orderJournalPage .orderJournalTable .staffDataTable thead th {
  height: 32px;
  padding: 0 10px;
  font-size: 12px;
}

.orderJournalPage .orderJournalTable .staffDataTable thead th button { min-height: 32px; }
.orderJournalPage .orderJournalTable .staffDataTable tbody th,
.orderJournalPage .orderJournalTable .staffDataTable tbody td {
  height: auto;
  padding: var(--journal-row-padding-block) 10px;
}

.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable tbody th,
.staffApp.density-compact .orderJournalPage .orderJournalTable .staffDataTable tbody td { height: auto; }
.orderJournalPage .orderJournalRowActions { align-items: center; justify-content: center; flex-direction: row; }
.orderJournalPage .orderJournalRowActions .secondaryButton {
  width: 24px;
  min-width: 24px;
  min-height: 20px;
  height: 20px;
  padding: 0;
  color: var(--staff-muted);
  font-size: 18px;
  background: transparent;
  border-color: transparent;
}

.orderJournalPage > .orderJournalPagination { flex: 0 0 40px; }

.appPage:has(.clientChatPage) { grid-template-rows: minmax(0, 1fr); }
.appPage:has(.clientChatPage) > .appContent { grid-row: 1; }
.clientChatSurface {
  --client-chat-accent: #1f7a4d;
  --client-chat-accent-strong: #155a39;
  --client-chat-canvas: #f5f6f5;
  --client-chat-surface: #fff;
  --client-chat-border: #e2e5e3;
  --client-chat-muted: #6b716d;
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 0;
  gap: 0;
  background: var(--client-chat-canvas);
  border: 0;
}

.clientChatSurface .clientChatToolbar {
  min-height: 60px;
  padding: 0 24px;
  background: #fff;
  border-bottom: 1px solid var(--client-chat-border);
  box-shadow: none;
}

.clientChatSurface .clientChatIdentity { flex: 0 1 auto; }
.clientChatSurface .clientChatIdentityMark {
  width: 32px;
  height: 32px;
  flex-basis: 32px;
  font-weight: 600;
  border-radius: 50%;
}

.clientChatSurface .clientChatHeading h1 { font-size: 15px; font-weight: 600; }
.clientChatSurface .clientChatHeading .eyebrow {
  margin: 2px 0 0;
  font-size: 11px;
  font-weight: 400;
}

.clientChatHeaderActions { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.clientChatSurface .chatConnectionState {
  min-height: 28px;
  padding: 4px 9px 4px 23px;
  font-size: 12px;
  background: #eef5f0;
  border-color: #dce8df;
  border-radius: 999px;
}

.chatAccountMenu { position: relative; }
.chatDeviceTools { position: relative; }
.chatDeviceTools > summary {
  width: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--client-chat-muted);
  font-size: 13px;
  letter-spacing: 1px;
  background: #fff;
  border: 1px solid var(--client-chat-border);
  border-radius: 50%;
  cursor: pointer;
  list-style: none;
}
.chatDeviceTools > summary::-webkit-details-marker { display: none; }
.chatDeviceTools[open] > summary { color: var(--client-chat-accent); background: #eef5f0; }
.chatDevicePopup {
  position: absolute;
  z-index: 50;
  top: calc(100% + 6px);
  right: 0;
  width: min(360px, calc(100vw - 24px));
  padding: 6px;
  display: grid;
  gap: 4px;
  background: #fff;
  border: 1px solid var(--client-chat-border);
  border-radius: 8px;
  box-shadow: 0 10px 26px rgba(27, 30, 28, .12);
}
.chatDevicePopup .chatPwaTools { margin: 0; border: 0; box-shadow: none; }
.chatDevicePopup .chatPwaTools + .chatPwaTools { border-top: 1px solid var(--client-chat-border); }
.chatAccountButton {
  min-width: 34px;
  min-height: 34px;
  padding: 0 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: var(--client-chat-accent);
  background: #eef5f0;
  border: 1px solid #dce8df;
  border-radius: 50%;
}

.chatAccountPopup {
  position: absolute;
  z-index: 50;
  top: calc(100% + 6px);
  right: 0;
  min-width: 210px;
  padding: 6px;
  display: grid;
  gap: 2px;
  background: #fff;
  border: 1px solid var(--client-chat-border);
  border-radius: 6px;
  box-shadow: 0 10px 26px rgba(27, 30, 28, .12);
}

.chatAccountPopup p { margin: 0; padding: 7px 9px; color: var(--client-chat-muted); font-size: 12px; border-bottom: 1px solid var(--client-chat-border); }
.chatAccountPopup a,
.chatAccountPopup button {
  width: 100%;
  min-height: 34px;
  padding: 6px 9px;
  display: flex;
  align-items: center;
  color: #3e443f;
  font-size: 13px;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 4px;
  text-decoration: none;
}

.chatAccountPopup a:hover,
.chatAccountPopup button:hover { color: var(--client-chat-accent); background: #eef5f0; }
.clientChatSurface .clientChatTimeline {
  margin: 0;
  padding: 24px;
  background: var(--client-chat-canvas);
  border: 0;
  border-radius: 0;
}

.chatFeedContent {
  width: min(100%, 760px);
  min-height: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.clientChatSurface .chatMessage { width: min(80%, 608px); border-radius: 4px 12px 12px; box-shadow: none; }
.clientChatSurface .chatMessage-client { width: min(76%, 578px); border-radius: 12px 4px 12px 12px; }
.clientChatSurface .chatMessage-summary,
.clientChatSurface .chatMessage-submission_result { width: min(96%, 730px); }
.clientChatSurface .clientChatComposer {
  padding: 10px 24px max(10px, env(safe-area-inset-bottom));
  background: #fff;
  border-top: 1px solid var(--client-chat-border);
  box-shadow: none;
}

.clientChatSurface .chatComposerRow {
  position: relative;
  width: min(100%, 760px);
  margin: 0 auto;
  grid-template-columns: 34px minmax(0, 1fr) 38px;
  align-items: end;
  gap: 8px;
}

.clientChatSurface .chatRecognitionNotice {
  width: min(100%, 760px);
  margin: 0 auto 6px;
  color: var(--client-chat-muted);
  font-size: 11px;
  line-height: 1.35;
}

.clientChatSurface .chatComposer textarea {
  min-height: 38px;
  max-height: 120px;
  padding: 8px 12px;
  font-size: 14px;
  border-radius: 8px;
}

.clientChatSurface .chatSendButton {
  width: 38px;
  min-width: 38px;
  min-height: 38px;
  padding: 0;
  border-radius: 8px;
}

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

.clientChatSurface .chatAttachmentComposer { position: relative; padding: 0; display: block; background: transparent; border: 0; }
.clientChatSurface .chatAttachmentToggle {
  width: 34px;
  min-width: 34px;
  min-height: 38px;
  padding: 0;
  color: #3e443f;
  font-size: 21px;
  line-height: 1;
  background: #fff;
  border: 1px solid var(--client-chat-border);
  border-radius: 8px;
}

.clientChatSurface .chatAttachmentMenu {
  position: absolute;
  z-index: 40;
  bottom: calc(100% + 8px);
  left: 0;
  width: min(380px, calc(100vw - 32px));
  padding: 10px;
  display: grid;
  gap: 6px;
  background: #fff;
  border: 1px solid var(--client-chat-border);
  border-radius: 8px;
  box-shadow: 0 10px 26px rgba(27, 30, 28, .12);
}

.clientChatSurface .chatAttachmentActions h2 {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  color: #3e443f;
  font-size: 13px;
  white-space: normal;
}

.clientChatSurface .chatAttachmentTrigger { min-height: 34px; border-radius: 6px; }

@media (max-width: 820px), (pointer: coarse) {
  .orderJournalPage { height: auto; min-height: calc(100dvh - var(--staff-topbar-height)); overflow: visible; }
  .orderJournalPage > .orderJournalPageHeader { flex-basis: auto; }
  .orderJournalPage .orderJournalFilters,
  .orderJournalPage .orderJournalFilters .staffFilterBar__fields { width: 100%; align-items: stretch; flex-direction: column; }
  .orderJournalPage .journalViewSwitch,
  .orderJournalPage .journalStatusDisclosure,
  .orderJournalPage .journalMoreFilters,
  .orderJournalPage .journalStatusDisclosure summary,
  .orderJournalPage .journalMoreFilters summary { width: 100%; }
  .orderJournalPage .journalStatusDisclosure > summary { min-height: 44px; }
  .orderJournalPage .journalMoreFilters > summary { min-height: 44px; }
  .orderJournalPage .journalViewSwitch button { min-height: 44px; flex: 1 1 120px; }
  .orderJournalPage .orderJournalTable { flex: none; max-height: calc(100dvh - 220px); }
  .orderJournalPage .orderJournalTable th,
  .orderJournalPage .orderJournalTable td { display: table-cell; }
  .orderJournalPage .orderJournalRowActions .secondaryButton { width: 44px; min-width: 44px; min-height: 44px; }
  .orderJournalPage > .orderJournalPagination { flex-basis: auto; }
}

@media (max-width: 600px) {
  .clientChatSurface .clientChatToolbar { min-height: 56px; padding: 0 12px; }
  .clientChatSurface .clientChatIdentityMark { width: 30px; height: 30px; flex-basis: 30px; }
  .clientChatSurface .clientChatHeading h1 { font-size: 14px; }
  .clientChatSurface .clientChatHeading .eyebrow { font-size: 10px; }
  .clientChatSurface .chatConnectionState { max-width: 116px; font-size: 11px; }
  .clientChatSurface .clientChatTimeline { padding: 14px 12px; }
  .clientChatSurface .chatMessage { width: 86%; padding: 10px 12px; }
  .clientChatSurface .chatMessage-summary,
  .clientChatSurface .chatMessage-submission_result { width: 96%; }
  .clientChatSurface .clientChatComposer { padding: 8px 12px max(8px, env(safe-area-inset-bottom)); }
  .clientChatSurface .chatComposerRow { grid-template-columns: 44px minmax(0, 1fr) 44px; }
  .clientChatSurface .chatAttachmentToggle,
  .clientChatSurface .chatSendButton { width: 44px; min-width: 44px; min-height: 44px; }
  .clientChatSurface .chatAttachmentToggle,
  .clientChatSurface .chatSendButton { border-radius: 50%; }
  .clientChatSurface .chatComposer textarea {
    min-height: 44px;
    padding-inline: 14px;
    font-size: 16px;
    border-radius: 22px;
  }
  .chatAccountButton { min-width: 44px; min-height: 44px; }
  .chatAccountPopup a,
  .chatAccountPopup button { min-height: 44px; }
}

/* Feature 010 canonical route surfaces: flat, dense and function-first. */
.staffListPage,
.staffFormPage,
.canonicalReportPage,
[data-order-layout="canonical-detail"],
[data-order-layout="canonical-conversation"] {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  gap: 0;
  background: var(--staff-surface, #fff);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.staffListPage {
  min-height: calc(100dvh - var(--staff-topbar-height));
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.staffListPage > .staffPageHeader,
.staffFormPage > .staffPageHeader,
.canonicalReportPage > .canonicalReportPageHeader {
  flex: 0 0 var(--staff-page-header-height);
}

.staffListPage > .staffFilterBarSurface,
.staffListPage > form.staffFilterBarSurface {
  margin: 0;
  padding: 8px 16px;
  flex: 0 0 auto;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

.staffListPage > .staffDataTableScroll {
  min-height: 0;
  flex: 1 1 auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.staffListPage > .staffPagination { margin-top: auto; flex: 0 0 40px; }
.staffListPage > .globalError,
.staffListPage > .errorPanel,
.staffListPage > .loadingState,
.staffListPage > .emptyState { margin: 10px 16px; }

.staffListSummary {
  margin: 0;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 24px;
  color: var(--staff-muted);
  font-size: 12px;
  background: #fafbfa;
  border: 0;
  border-top: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

.staffListSummary > div { display: flex; align-items: baseline; gap: 5px; }
.staffListSummary strong { color: var(--staff-secondary); font-size: 13px; font-weight: 600; }

.staffFormPage {
  min-height: calc(100dvh - var(--staff-topbar-height));
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.staffFormSection,
.staffFormPage .catalogSection,
.staffFormPage .editorForm {
  margin: 0;
  padding: 16px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

.staffFormSection > h2,
.staffFormSection > header h2,
.staffListSubsection > h2 { margin: 0 0 12px; font-size: 15px; font-weight: 600; }
.staffInlineEditor { margin: 0; padding: 12px 16px; border-block: 1px solid var(--staff-border); background: #fafbfa; }

.referenceListPage > .landing {
  width: 100%;
  min-height: calc(100dvh - var(--staff-topbar-height));
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.staffHierarchyPage .staffHierarchyList {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
  list-style: none;
  background: #fff;
  border-block: 1px solid var(--staff-border);
}

.staffHierarchyPage .staffHierarchyItem {
  margin: 0;
  padding: 0;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-row-divider);
  border-radius: 0;
  box-shadow: none;
}

.staffHierarchyPage .staffHierarchyItem:last-child { border-bottom: 0; }
.staffHierarchyPage .staffHierarchyParent {
  min-height: 40px;
  padding: 6px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.staffHierarchyPage .staffHierarchyChildren {
  margin: 0;
  padding: 0 16px 10px 28px;
  border: 0;
  border-left: 2px solid var(--staff-accent-soft);
}

.dictionaryFilters { border-bottom: 1px solid var(--staff-border); }
.dictionaryDetailPane { background: #fafbfa; }
.dictionaryEditorDrawer .staffFormSection { padding: 0; border: 0; }
.catalogImportPanel { border-top: 1px solid var(--staff-border); }
.catalogImportReport__disclosure { margin: 0; border-top: 1px solid var(--staff-row-divider); }
.catalogImportReport__disclosure > summary { min-height: 36px; padding: 8px 0; color: var(--staff-accent); cursor: pointer; }
.catalogImportReport__details { padding: 8px 0 0; }

.staffAuditPage__changedFields {
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  list-style: none;
}

.staffAuditPage__changedField {
  padding: 2px 6px;
  color: var(--staff-secondary);
  font-size: 11px;
  background: #f0f3f1;
  border-radius: 999px;
}

.staffAuditPage__safeDetails { margin: 0; padding: 0; border: 0; border-radius: 0; }
.staffAuditPage__decisions { margin-top: 0; }

/* Canonical reports keep the real filters and exports but remove preview cards. */
.canonicalReportPage {
  min-height: calc(100dvh - var(--staff-topbar-height));
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.canonicalReportControls {
  margin: 0;
  padding: 8px 16px;
  display: grid;
  gap: 8px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

.canonicalReportFilterGrid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
}

.canonicalReportFilterGrid > label { grid-column: span 2; gap: 3px; font-size: 12px; }
.canonicalReportFilterGrid > .canonicalReportChoiceGroup { grid-column: span 3; }
.canonicalReportFilterGrid > .canonicalReportReferenceFilters { grid-column: 1 / -1; }
.canonicalReportChoiceGroup {
  min-height: 32px;
  padding: 5px 8px;
  align-items: center;
  border-color: var(--staff-border);
  border-radius: var(--staff-radius);
}

.canonicalReportChoiceGroup legend { font-size: 11px; font-weight: 500; }
.canonicalReportChoiceGroup .checkboxLabel { min-height: 28px; font-size: 12px; }
.canonicalReportReferenceFilters > summary {
  min-height: 32px;
  padding: 6px 9px;
  font-size: 12px;
  background: #f4f6f4;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.canonicalReportApplyActions { margin: 0; justify-content: flex-end; }
.canonicalReportMetadata {
  margin: 0;
  padding: 7px 16px;
  gap: 6px 20px;
  color: var(--staff-muted);
  font-size: 12px;
  background: #fafbfa;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
}

.canonicalReportWarnings { margin: 0; border-width: 0 0 1px; border-radius: 0; }
.canonicalReportPage > .reportMatrixShell { min-height: 0; flex: 1 1 auto; }
.canonicalReportPage .reportMatrixRegion {
  height: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.canonicalReportPage .reportMatrix { font-size: 12px; }
.canonicalReportPage .reportMatrix th,
.canonicalReportPage .reportMatrix td { padding: 7px 9px; border-color: var(--staff-row-divider); }

/* Canonical order form/detail geometry. */
.orderPage:has([data-order-layout="canonical-form"]) {
  margin: 0;
  padding: 0;
  gap: 0;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.orderPage:has([data-order-layout="canonical-form"]) > .pageTitleRow,
.orderPage:has([data-order-layout="canonical-form"]) > .backLink,
.orderPage:has([data-order-layout="canonical-form"]) > .eyebrow,
.orderPage:has([data-order-layout="canonical-form"]) > h1,
.orderPage:has([data-order-layout="canonical-form"]) > .lead { margin-inline: 16px; }

[data-order-layout="canonical-form"] { margin: 0; padding: 0 16px 16px; }
[data-order-form="canonical"] { gap: 0; }
[data-order-grid="12-column"] { gap: 0; }
[data-order-section="common"] {
  margin: 0;
  padding: 12px 0;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px 12px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

[data-order-section="common"] > h2 { grid-column: 1 / -1; margin: 0 0 2px; font-size: 15px; }
[data-order-section="common"] > label,
[data-order-section="common"] > .readOnlyField { grid-column: span 4; }

[data-order-part="canonical"] {
  margin: 0;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

[data-order-part="canonical"] .orderPart__legend,
[data-order-line="compact-row"] .orderLine__legend { width: 100%; margin: 0; padding: 8px 0; }
[data-order-part="canonical"] .orderPart__body { padding: 8px 0 12px; }
[data-order-lines="compact-table"] { margin-top: 10px; gap: 0; border-top: 1px solid var(--staff-border); }
[data-order-line="compact-row"] {
  padding: 0;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-row-divider);
  border-radius: 0;
}

[data-order-line="compact-row"] .orderLine__body { padding: 8px 0 10px; }
[data-order-line-fields="canonical"] { grid-template-columns: 4fr 3fr 2fr 2fr 1fr; gap: 8px; }
[data-product-picker="canonical"] .productSearchResults { border-radius: var(--staff-radius); }
[data-order-actions="canonical"] {
  margin: 0;
  padding: 12px 0;
  grid-template-columns: minmax(0, 1fr) auto;
  background: #fff;
  border: 0;
  border-top: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

[data-order-actions="canonical"] h2 { grid-column: 1 / -1; margin: 0; font-size: 15px; }
[data-order-layout="canonical-detail"],
[data-order-layout="canonical-conversation"] { padding: 12px 16px 20px; }
[data-order-layout="canonical-detail"] > section,
[data-order-layout="canonical-conversation"] > section {
  margin: 0;
  padding: 14px 0;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-border);
  border-radius: 0;
  box-shadow: none;
}

[data-order-layout="canonical-detail"] .orderDetailHeader,
[data-order-layout="canonical-conversation"] .orderConversationHeader {
  margin: 0;
  padding: 8px 0 14px;
  border-bottom: 1px solid var(--staff-border);
}

.orderDetailHeader h1,
.orderConversationHeader h1 {
  margin: 0;
  color: var(--staff-text);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}

@media (max-width: 820px), (pointer: coarse) {
  .staffUpdateNotice {
    min-height: 52px;
    padding: 6px 12px;
  }
  .staffUpdateNotice button { min-width: 88px; min-height: 44px; }
  .staffListPage,
  .staffFormPage,
  .canonicalReportPage { min-height: calc(100dvh - var(--staff-topbar-height)); }
  .staffListPage > .staffPageHeader,
  .staffFormPage > .staffPageHeader,
  .canonicalReportPage > .canonicalReportPageHeader { flex-basis: auto; }
  .staffListPage > .staffFilterBarSurface,
  .canonicalReportControls { padding: 10px 12px; }
  .staffListPage > .staffDataTableScroll { flex: none; }
  .staffListPage > .staffPagination { flex-basis: auto; }
  .staffHierarchyPage .staffHierarchyParent { min-height: 44px; padding-inline: 12px; }
  .staffHierarchyPage .staffHierarchyChildren { padding-inline: 18px 12px; }
  .canonicalReportFilterGrid { grid-template-columns: minmax(0, 1fr); }
  .canonicalReportFilterGrid > label,
  .canonicalReportFilterGrid > .canonicalReportChoiceGroup,
  .canonicalReportFilterGrid > .canonicalReportReferenceFilters { grid-column: 1; }
  [data-order-layout="canonical-form"] { padding-inline: 12px; }
  [data-order-section="common"] { grid-template-columns: minmax(0, 1fr); }
  [data-order-section="common"] > label,
  [data-order-section="common"] > .readOnlyField { grid-column: 1; }
  [data-order-line-fields="canonical"] { grid-template-columns: minmax(0, 1fr); }
  [data-order-actions="canonical"] { grid-template-columns: minmax(0, 1fr); }
  [data-order-layout="canonical-detail"],
  [data-order-layout="canonical-conversation"] { padding: 10px 12px 18px; }
}

.staffHomePage,
.staffNotificationsPage {
  width: 100%;
  min-height: calc(100dvh - var(--staff-topbar-height));
  margin: 0;
  padding: 0;
  background: #fff;
}

.staffHomeCapability {
  margin: 0;
  padding: 7px 16px;
  color: var(--staff-muted);
  font-size: 12px;
  background: #fafbfa;
  border-bottom: 1px solid var(--staff-border);
}

.staffHomeNav { margin: 0; padding: 0; }
.staffHomeList {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  list-style: none;
  border-top: 1px solid var(--staff-border);
}

.staffHomeItem { min-width: 0; border-right: 1px solid var(--staff-row-divider); border-bottom: 1px solid var(--staff-row-divider); }
.staffHomeLink {
  min-height: 64px;
  padding: 10px 16px;
  display: grid;
  align-content: center;
  gap: 3px;
  color: var(--staff-text);
  text-decoration: none;
}

.staffHomeLink:hover { color: var(--staff-accent); background: #f5f8f6; text-decoration: none; }
.staffHomeLink strong { font-size: 14px; font-weight: 600; }
.staffHomeLink span { color: var(--staff-muted); font-size: 12px; }

.notificationUnreadFilter { min-height: 32px; margin: 0; display: inline-flex; align-items: center; gap: 7px; font-size: 12px; }
.staffInlineState,
.staffEmptyState { margin: 0; padding: 18px 16px; border-bottom: 1px solid var(--staff-border); }
.staffEmptyState h2 { margin: 0 0 4px; font-size: 15px; }
.staffEmptyState p { margin: 0; color: var(--staff-muted); font-size: 13px; }
.notificationList {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
  list-style: none;
  border-top: 1px solid var(--staff-border);
}

.notificationRow {
  position: relative;
  margin: 0;
  padding: 10px 16px;
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(0, 2.4fr) auto;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--staff-row-divider);
  border-radius: 0;
  box-shadow: none;
}

.notificationRow { cursor: pointer; }
.notificationRow:hover,
.notificationRow:focus-within { background: #f8faf8; }
.notificationRow.isUnread { background: #f5faf6; box-shadow: inset 3px 0 var(--staff-accent); }
.notificationRow.isUnread:hover,
.notificationRow.isUnread:focus-within { background: #eef7f0; }
.notificationRowHeading { margin: 0; align-items: start; }
.notificationRowHeading h2 { margin: 2px 0 0; font-size: 14px; font-weight: 600; }
.notificationRowHeading time { color: var(--staff-muted); font-size: 11px; }
.notificationState { color: var(--staff-accent); font-size: 10px; font-weight: 600; letter-spacing: .05em; }
.notificationFacts {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(90px, 1fr));
  gap: 8px 12px;
}

.notificationFacts dt { color: var(--staff-muted); font-size: 10px; font-weight: 500; letter-spacing: .03em; }
.notificationFacts dd { margin: 2px 0 0; font-size: 12px; }
.notificationActions { margin: 0; align-items: center; justify-content: flex-end; flex-wrap: nowrap; }
.notificationActions a,
.notificationActions button { min-height: 32px; padding: 5px 9px; font-size: 12px; border-radius: var(--staff-radius); }
.notificationLoadMore { margin: 12px auto; }

@media (max-width: 820px), (pointer: coarse) {
  .staffHomeList { grid-template-columns: minmax(0, 1fr); }
  .staffHomeLink { min-height: 52px; padding-inline: 12px; }
  .notificationUnreadFilter { min-height: 44px; }
  .notificationRow { grid-template-columns: minmax(0, 1fr); padding: 12px; gap: 10px; }
  .notificationRowHeading a { min-height: 44px; display: inline-flex; align-items: center; }
  .notificationFacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .notificationActions { align-items: stretch; flex-direction: column; }
  .notificationActions a,
  .notificationActions button { width: 100%; min-height: 44px; }
}

/* Feature 010 dense form and list fidelity. */
.staffListPage > .staffFilterBarSurface {
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: none;
}

.staffListPage > .staffDataTableScroll {
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: none;
}

.staffListPage > .staffPageHeader .primaryButton,
.staffListPage:not(.orderJournalPage) .staffDataTable .secondaryButton,
.staffListPage:not(.orderJournalPage) .staffDataTable .secondaryAction {
  min-height: 30px;
  padding: 4px 10px;
  font-size: 12px;
  border-radius: var(--staff-radius);
}

.orderFormPage {
  width: 100%;
  min-height: calc(100dvh - var(--staff-topbar-height));
  margin: 0;
  padding: 0;
  display: block;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.orderFormPageHeader {
  min-height: var(--staff-page-header-height);
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border-bottom: 1px solid var(--staff-border);
}

.orderFormPageHeader .backLink {
  margin: 0;
  color: var(--staff-accent);
  font-size: 13px;
  font-weight: 400;
  text-decoration: none;
}

.orderFormPageHeader h1 {
  margin: 0;
  color: var(--staff-text);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}

.orderFormPageHeader__meta {
  margin-left: auto;
  color: var(--staff-muted);
  font-size: 12px;
}

.orderFormPage [data-order-layout="canonical-form"] {
  margin: 0;
  padding: 0 16px 18px;
  color: var(--staff-text);
  font-size: 13px;
}

.orderFormPage [data-order-layout="canonical-form"] label,
.orderFormPage [data-order-layout="canonical-form"] .readOnlyField {
  margin: 0;
  gap: 4px;
  color: var(--staff-secondary);
  font-size: 12px;
  font-weight: 500;
}

.orderFormPage [data-order-layout="canonical-form"] input,
.orderFormPage [data-order-layout="canonical-form"] select,
.orderFormPage [data-order-layout="canonical-form"] .readOnlyField output {
  min-height: 34px;
  height: 34px;
  padding: 5px 10px;
  color: var(--staff-text);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
}

.orderFormPage [data-order-layout="canonical-form"] .readOnlyField output {
  display: flex;
  align-items: center;
  background: #f3f5f3;
}

.orderFormPage [data-order-layout="canonical-form"] textarea {
  min-height: 56px;
  padding: 8px 10px;
  font-size: 13px;
  background: #fff;
  border-color: var(--staff-border);
  border-radius: var(--staff-radius);
}

.orderFormPage [data-order-layout="canonical-form"] input:focus,
.orderFormPage [data-order-layout="canonical-form"] select:focus,
.orderFormPage [data-order-layout="canonical-form"] textarea:focus {
  border-color: var(--staff-accent);
  outline: 2px solid rgba(31, 122, 77, .15);
  outline-offset: 0;
  box-shadow: none;
}

.orderFormPage [data-order-section="common"] {
  padding: 14px 0;
  gap: 8px 12px;
}

.orderFormPage [data-order-section="common"] > h2,
.orderFormPage [data-order-actions="canonical"] h2 {
  margin: 0 0 2px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
}

.orderFormPage [data-order-part="canonical"] .orderPart__legend {
  min-height: 38px;
  padding: 6px 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}

.orderFormPage [data-order-part="canonical"] .orderPart__title { font-weight: 600; }
.orderFormPage [data-order-part="canonical"] .orderPart__summary {
  color: var(--staff-muted);
  font-size: 11px;
  font-weight: 400;
}

.orderFormPage [data-order-part="canonical"] .orderPart__toggle,
.orderFormPage [data-order-line="compact-row"] .orderLine__toggle {
  min-width: 0;
  min-height: 30px;
  margin-left: auto;
  padding: 4px 9px;
  color: var(--staff-muted);
  font-size: 11px;
  font-weight: 400;
  background: #fff;
  border: 0;
  border-radius: var(--staff-radius);
}

.orderFormPage [data-order-part="canonical"] .orderPart__body { padding: 8px 0 12px; }
.orderFormPage [data-order-part="canonical"] .orderPartHeader {
  grid-template-columns: minmax(0, 5fr) minmax(160px, 3fr) minmax(180px, 4fr);
  gap: 8px 12px;
}

.orderFormPage [data-order-lines="compact-table"] {
  margin-top: 12px;
  border-top: 1px solid var(--staff-border);
}

.orderFormPage [data-order-line="compact-row"] .orderLine__legend {
  min-height: 28px;
  padding: 4px 0 2px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
}

.orderFormPage [data-order-line="compact-row"] .orderLine__title { font-weight: 600; }
.orderFormPage [data-order-line="compact-row"] .orderLine__summary {
  color: var(--staff-muted);
  font-size: 11px;
  font-weight: 400;
}

.orderFormPage [data-order-line="compact-row"] .orderLine__body {
  padding: 4px 0 8px;
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 110px 150px auto;
  align-items: end;
  gap: 8px;
}

.orderFormPage [data-product-picker="canonical"] {
  position: relative;
  grid-column: 1;
}

.orderFormPage [data-product-picker="canonical"] .selectedProduct {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.orderFormPage [data-product-picker="canonical"].hasSelection input::placeholder {
  color: var(--staff-text);
  font-weight: 500;
  opacity: 1;
}

.orderFormPage [data-product-picker="canonical"] .productSearchRow {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
}

.orderFormPage [data-product-picker="canonical"] .productSearchRow button {
  min-height: 34px;
  padding: 4px 10px;
  font-size: 11px;
  border-radius: var(--staff-radius);
}

.orderFormPage [data-order-line-fields="canonical"] { display: contents; }
.orderFormPage [data-order-line-fields="canonical"] label:first-child { grid-column: 3; }
.orderFormPage [data-order-line-fields="canonical"] label:nth-child(2) { grid-column: 2; }
.orderFormPage [data-order-line="compact-row"] .orderLine__remove {
  width: 30px;
  min-width: 30px;
  min-height: 30px;
  grid-column: 4;
  padding: 0;
  overflow: hidden;
  color: transparent;
  font-size: 0;
  background: transparent;
  border: 0;
}

.orderFormPage [data-order-line="compact-row"] .orderLine__remove::before {
  content: "×";
  color: var(--staff-muted);
  font-size: 18px;
  font-weight: 400;
}

.orderFormPage [data-order-line="compact-row"] .quantityPreview,
.orderFormPage [data-order-line="compact-row"] .lineEligibilityError,
.orderFormPage [data-order-line="compact-row"] .inlineOrderError,
.orderFormPage [data-order-line="compact-row"] .inlineFieldError {
  grid-column: 1 / -1;
}

.orderFormPage .orderPart__comment {
  margin-top: 12px;
  display: grid;
}

.orderFormPage .orderPart__actions {
  margin-top: 8px;
  justify-content: space-between;
}

.orderFormPage .orderPart__actions button,
.orderFormPage .orderForm__addPart,
.orderFormPage [data-order-actions="canonical"] button {
  min-height: 34px;
  padding: 5px 12px;
  font-size: 12px;
  border-radius: var(--staff-radius);
}

.orderFormPage .orderForm__addPart { margin: 10px 0 0 auto; display: flex; }
.orderFormPage [data-order-actions="canonical"] {
  padding: 12px 0;
  align-items: center;
  gap: 8px 12px;
}

.orderFormPage [data-order-actions="canonical"] p {
  margin: 0;
  color: var(--staff-muted);
  font-size: 11px;
}

@media (max-width: 820px), (pointer: coarse) {
  .staffListPage > .staffPageHeader .primaryButton,
  .staffListPage .staffDataTable .secondaryButton,
  .staffListPage .staffDataTable .secondaryAction { min-height: 44px; }

  .orderFormPageHeader {
    min-height: 52px;
    padding-inline: 12px;
    flex-wrap: wrap;
  }

  .orderFormPageHeader .backLink {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .orderFormPageHeader h1 { font-size: 20px; }
  .orderFormPage [data-order-layout="canonical-form"] { padding-inline: 12px; }
  .orderFormPage [data-order-layout="canonical-form"] input,
  .orderFormPage [data-order-layout="canonical-form"] select,
  .orderFormPage [data-order-layout="canonical-form"] .readOnlyField output,
  .orderFormPage [data-order-layout="canonical-form"] button { min-height: 44px; }
  .orderFormPage [data-order-part="canonical"] .orderPart__legend,
  .orderFormPage [data-order-line="compact-row"] .orderLine__legend {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 2px 8px;
  }
  .orderFormPage [data-order-part="canonical"] .orderPart__summary,
  .orderFormPage [data-order-line="compact-row"] .orderLine__summary {
    min-width: 0;
    grid-column: 1 / -1;
    grid-row: 2;
    overflow-wrap: anywhere;
  }
  .orderFormPage [data-order-part="canonical"] .orderPart__toggle,
  .orderFormPage [data-order-line="compact-row"] .orderLine__toggle {
    min-height: 44px;
    margin-left: 0;
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }
  .orderFormPage [data-order-part="canonical"] .orderPartHeader { grid-template-columns: minmax(0, 1fr); }
  .orderFormPage [data-order-line="compact-row"] .orderLine__body {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }
  .orderFormPage [data-product-picker="canonical"],
  .orderFormPage [data-order-line-fields="canonical"] label:first-child,
  .orderFormPage [data-order-line-fields="canonical"] label:nth-child(2),
  .orderFormPage [data-order-line="compact-row"] .orderLine__remove { grid-column: 1; }
  .orderFormPage [data-order-line="compact-row"] .orderLine__remove {
    width: 44px;
    min-width: 44px;
    justify-self: end;
  }
}

/* Feature 010 final fidelity normalizer. Keep legacy public/auth surfaces intact. */
.staffApp .staffListPage .staffPageHeader__text {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.staffApp .staffListPage .staffPageHeader__description { margin: 0; }

.staffApp .staffPageHeader__actions > :is(button, a),
.staffApp .staffFilterBar__actions > :is(button, a) {
  width: auto;
  min-height: var(--staff-control-height);
  height: var(--staff-control-height);
  margin: 0;
  padding: 0 12px;
  color: var(--staff-accent);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffApp .staffPageHeader__actions > :is(.primaryButton, .primaryLink, button:not(.secondaryButton):not(.secondaryAction)) {
  color: #fff;
  background: var(--staff-accent);
  border-color: var(--staff-accent);
}

.staffApp .staffPageHeader__actions > :is(.primaryButton, .primaryLink, button:not(.secondaryButton):not(.secondaryAction)):hover {
  color: #fff;
  background: var(--staff-accent-strong);
}

.staffApp .staffFilterBar label {
  margin: 0;
  gap: 4px;
  color: var(--staff-secondary);
  font-size: 12px;
  font-weight: 500;
}

.staffApp .staffFilterBar :is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: var(--staff-control-height);
  height: var(--staff-control-height);
  padding: 0 10px;
  color: var(--staff-text);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffApp .staffFilterBar :is(input:not([type="checkbox"]):not([type="radio"]), select):focus {
  border-color: var(--staff-accent);
  outline: 2px solid rgba(31, 122, 77, .15);
  outline-offset: 0;
  box-shadow: none;
}

.staffApp .staffFilterBar__summary { margin-top: 6px; font-size: 12px; }

.staffApp .staffStatusBadge {
  min-height: 20px;
  padding: 1px 8px;
  font-size: 12px;
  font-weight: 500;
}

.referenceListPage > .landing > .staffFilterBarSurface {
  margin: 0;
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: none;
}

.referenceListPage > .landing > .staffDataTableScroll {
  min-height: 0;
  margin: 0;
  flex: 1 1 auto;
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: none;
}

.referenceListPage > .landing > .staffPagination { margin-top: auto; flex: 0 0 40px; }

.orderFormPage [data-order-layout="canonical-form"] { width: min(100%, 1100px); }

.orderFormPage [data-order-line="compact-row"] .orderLine__body {
  grid-template-columns: minmax(240px, 1fr) 104px 104px 30px;
}

.orderFormPage [data-product-picker="canonical"],
.orderFormPage [data-order-line-fields="canonical"] > label,
.orderFormPage [data-order-line="compact-row"] .orderLine__remove {
  grid-row: 1;
  align-self: end;
}

.orderFormPage [data-product-picker="canonical"] .productSearchRow {
  position: relative;
  display: block;
}

.orderFormPage [data-product-picker="canonical"] .productSearchRow input { padding-right: 38px; }

.orderFormPage [data-product-picker="canonical"] .productSearchRow button {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 32px;
  min-width: 32px;
  min-height: 32px;
  height: 32px;
  padding: 0;
  color: var(--staff-muted);
  font-size: 17px;
  background: transparent;
  border: 0;
}

.orderFormPage [data-order-line="compact-row"] .quantityPreview {
  margin: 0;
  padding: 3px 0;
  color: var(--staff-muted);
  font-size: 11px;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.orderFormPage [data-order-actions="canonical"] {
  grid-template-columns: auto minmax(0, 1fr);
}

.orderFormPage [data-order-actions="canonical"] > h2 { grid-column: 1 / -1; }
.orderFormPage [data-order-actions="canonical"] > button { grid-column: 1; grid-row: 2; }
.orderFormPage [data-order-actions="canonical"] > p { grid-column: 2; grid-row: 2; }

@media (max-width: 820px), (pointer: coarse) {
  .staffApp .staffListPage .staffPageHeader__text {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .staffApp .staffPageHeader__actions > :is(button, a),
  .staffApp .staffFilterBar__actions > :is(button, a),
  .staffApp .staffFilterBar :is(input:not([type="checkbox"]):not([type="radio"]), select) {
    min-height: 44px;
    height: 44px;
  }

  .orderFormPage [data-order-line="compact-row"] .orderLine__body {
    grid-template-columns: minmax(0, 1fr);
  }

  .orderFormPage [data-product-picker="canonical"],
  .orderFormPage [data-order-line-fields="canonical"] > label,
  .orderFormPage [data-order-line="compact-row"] .orderLine__remove {
    grid-row: auto;
  }

  .orderFormPage [data-order-actions="canonical"] { grid-template-columns: minmax(0, 1fr); }
  .orderFormPage [data-order-actions="canonical"] > button,
  .orderFormPage [data-order-actions="canonical"] > p { grid-column: 1; grid-row: auto; }

  .orderFormPage [data-product-picker="canonical"] .productSearchRow button {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    height: 44px;
  }
}

/* Feature 010 agent-chat fidelity: compact typography from the approved PWA prototype. */
.clientChatSurface {
  color: #292d2a;
  font-size: 13px;
  line-height: 1.45;
}

.clientChatSurface :is(button, a) { font-weight: 500; }
.clientChatSurface .clientChatToolbar {
  min-height: calc(60px + env(safe-area-inset-top));
  padding-top: env(safe-area-inset-top);
}
.clientChatSurface .clientChatHeading h1 { font-size: 14px; font-weight: 600; letter-spacing: 0; }
.clientChatSurface .clientChatHeading .eyebrow {
  max-width: min(52vw, 420px);
  overflow: hidden;
  color: #8a908c;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.clientChatSurface .chatConnectionState,
.clientChatSurface .chatStateBadge,
.clientChatSurface .chatDeliveryState { font-weight: 500; }

.clientChatSurface .chatStateBadge {
  min-height: 20px;
  padding: 1px 8px;
  font-size: 11px;
}

.clientChatSurface .chatMessage {
  padding: 10px 13px;
  font-size: 13px;
  line-height: 1.45;
}

.clientChatSurface .chatMessageMeta { margin-bottom: 6px; }
.clientChatSurface .chatMessageMeta strong { font-size: 11px; font-weight: 600; }
.clientChatSurface .chatMessageMeta time { font-size: 10px; }
.clientChatSurface .chatMessageBody,
.clientChatSurface .chatSemanticCard > p { font-size: 13px; line-height: 1.5; }

.clientChatSurface .chatSemanticCard { gap: 8px; }
.clientChatSurface .chatSemanticCard h3 {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0;
}

.clientChatSurface .chatSemanticCard h4 { font-size: 13px; font-weight: 600; letter-spacing: 0; }
.clientChatSurface .chatSummaryParts { gap: 8px; }
.clientChatSurface .chatSummaryPart {
  padding: 10px 12px;
  gap: 4px;
  border-radius: 9px;
}

.clientChatSurface .chatSummaryPartHeading strong { font-size: 14px; font-weight: 600; }
.clientChatSurface .chatSummaryPartHeading span { font-size: 11px; font-weight: 500; }
.clientChatSurface .chatSummaryMeta,
.clientChatSurface .chatSummaryComment,
.clientChatSurface .chatSummaryItems span { font-size: 12px; line-height: 1.4; }
.clientChatSurface .chatSummaryItems { margin-top: 4px; gap: 5px; }
.clientChatSurface .chatSummaryItems li { padding-top: 7px; gap: 2px; }
.clientChatSurface .chatSummaryItems strong { font-size: 13px; font-weight: 600; }
.clientChatSurface .chatConfirmationHint,
.clientChatSurface .chatStaleNote,
.clientChatSurface .chatDuplicateWarning { padding: 8px 10px; font-size: 12px; border-radius: 8px; }

.clientChatSurface .chatResultOrders { gap: 6px; }
.clientChatSurface .chatResultOrders li { padding: 8px 10px; border-radius: 8px; }
.clientChatSurface .chatResultOrders strong { font-size: 13px; font-weight: 600; }
.clientChatSurface .chatResultOrders span,
.clientChatSurface .chatOrderStatus time { font-size: 12px; }
.clientChatSurface .chatOrderStatus > strong { font-size: 15px; font-weight: 600; }

.clientChatSurface .chatAttachmentStub a { min-height: 36px; padding: 6px 9px; border-radius: 7px; }
.clientChatSurface .chatDeliveryState { margin-top: 6px; font-size: 10px; }
.clientChatSurface .chatChoice { min-height: 34px; padding: 6px 10px; font-size: 12px; border-radius: 6px; }

.clientChatSurface :is(.chatAccountButton, .chatAttachmentToggle, .chatDeviceTools > summary):hover {
  color: var(--client-chat-accent);
  background: #eef5f0;
}

.clientChatSurface .chatDevicePopup .chatPwaTools {
  padding: 6px 8px;
  color: var(--client-chat-muted);
  font-size: 12px;
  font-weight: 400;
  background: #fff;
  border-radius: 0;
}

.clientChatSurface .chatDevicePopup .chatPwaTools > summary { min-height: 34px; font-weight: 500; }

.clientChatSurface .chatAttachmentMenu {
  max-height: min(50dvh, 420px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.clientChatSurface .chatAttachmentSelection {
  max-height: none;
  overflow-x: visible;
  overflow-y: visible;
}

@media (max-width: 600px) {
  .clientChatSurface .clientChatToolbar {
    min-height: calc(56px + env(safe-area-inset-top));
  }
  .clientChatSurface .chatAttachmentMenu {
    max-height: min(48dvh, 360px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .clientChatSurface .chatMessage { width: 86%; font-size: 13px; }
  .clientChatSurface .chatMessage-summary,
  .clientChatSurface .chatMessage-submission_result { width: 92%; }
  .clientChatSurface .chatSemanticCard h3 { font-size: 14px; }
  .clientChatSurface .chatComposer textarea { font-size: 16px; }
}

@media (max-width: 600px), (pointer: coarse) {
  .clientChatSurface :is(
    .chatAccountButton,
    .chatAttachmentToggle,
    .chatAttachmentTrigger,
    .chatAttachmentSelection button,
    .chatDeviceTools > summary,
    .chatDevicePopup .chatPwaTools > summary,
    .chatAttachmentStub a,
    .chatChoice,
    .chatSendButton
  ) {
    min-width: 44px;
    min-height: 44px;
  }

  .clientChatSurface .chatComposer textarea { min-height: 44px; }
}

@media (max-width: 360px) {
  .clientChatSurface .clientChatToolbar {
    height: calc(56px + env(safe-area-inset-top));
    min-height: calc(56px + env(safe-area-inset-top));
    max-height: calc(56px + env(safe-area-inset-top));
    padding-top: env(safe-area-inset-top);
    padding-inline: 8px;
    flex-wrap: nowrap;
    gap: 6px;
  }

  .clientChatSurface .clientChatIdentity {
    min-width: 0;
    flex: 1 1 auto;
  }

  .clientChatSurface .clientChatIdentity > div { min-width: 0; }
  .clientChatSurface .clientChatHeading h1 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .clientChatSurface .clientChatHeading .eyebrow { display: none; }
  .clientChatSurface .clientChatHeaderActions {
    min-width: 0;
    flex: 0 0 auto;
    gap: 4px;
  }

  .clientChatSurface .chatConnectionState {
    max-width: 86px;
    margin-left: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Feature 010 dense controls for every real staff route, not only the journal. */
.staffApp .staffFormPage :is(button, .secondaryButton, .secondaryAction),
.staffApp .staffNotificationsPage :is(button, .secondaryButton, .secondaryAction),
.staffApp .canonicalReportPage :is(button, .secondaryButton, .secondaryAction),
.staffApp .staffListPage:not(.orderJournalPage) :is(
  .staffHierarchyItem button,
  .staffInlineEditor button,
  .staffListSubsection > button,
  .dictionaryDetailPane button,
  .catalogImportPanel button,
  .notificationActions button,
  .notificationActions a
) {
  min-height: 32px;
  margin: 0;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 500;
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffApp .staffFormPage :is(button, .secondaryButton, .secondaryAction) {
  min-height: 34px;
}

.staffApp .staffFormPage label {
  margin: 0;
  gap: 4px;
  color: var(--staff-secondary);
  font-size: 12px;
  font-weight: 500;
}

.staffApp .staffFormPage :is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 34px;
  height: 34px;
  padding: 0 10px;
  color: var(--staff-text);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffApp .staffFormPage textarea {
  min-height: 72px;
  padding: 8px 10px;
  color: var(--staff-text);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffApp .staffFormPage input[type="checkbox"] {
  width: 18px;
  min-height: 18px;
}

.staffApp .staffFormPage :is(input, select, textarea):focus-visible,
.staffApp .canonicalReportPage :is(input, select, textarea):focus-visible {
  border-color: var(--staff-accent);
  outline: 2px solid rgba(31, 122, 77, .15);
  outline-offset: 0;
  box-shadow: none;
}

.staffApp .canonicalReportPage label {
  margin: 0;
  gap: 3px;
  color: var(--staff-secondary);
  font-size: 12px;
  font-weight: 500;
}

.staffApp .canonicalReportPage :is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 32px;
  height: 32px;
  padding: 0 10px;
  color: var(--staff-text);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border);
  border-radius: var(--staff-radius);
  box-shadow: none;
}

.staffApp .canonicalReportPage input[type="checkbox"] {
  width: 18px;
  min-height: 18px;
}

.staffApp .canonicalReportChoiceGroup {
  min-height: 32px;
  padding: 3px 8px;
  align-items: center;
  gap: 3px 10px;
  border-radius: var(--staff-radius);
}

.staffApp .canonicalReportChoiceGroup .checkboxLabel {
  min-height: 24px;
  gap: 5px;
  font-size: 11px;
  white-space: nowrap;
}

.staffApp .canonicalReportFilterGrid > .canonicalReportChoiceGroup:first-of-type { grid-column: span 2; }
.staffApp .canonicalReportFilterGrid > .canonicalReportChoiceGroup:last-of-type { grid-column: span 4; }
.staffApp .canonicalReportReferenceFilters > summary { font-weight: 500; }
.staffApp .canonicalReportApplyActions { gap: 8px; }

.staffApp :is(.staffListSubsection, .staffAuditPage__decisions) .staffDataTableScroll {
  border-width: 1px 0 0;
  border-radius: 0;
  box-shadow: none;
}

.staffApp .notificationState { text-transform: none; }

.staffApp .eyebrow {
  margin-bottom: 4px;
  color: var(--staff-muted);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

/* Canonical account, recovery and order-feedback states. */
.accountSecurityPage,
.applicationStatePage {
  width: 100%;
  min-height: calc(100dvh - var(--staff-topbar-height, 52px));
  color: var(--staff-text, #1b1e1c);
  background: #fff;
}

.accountSecurityHeader,
.applicationStatePage > .applicationStateHeader {
  min-height: var(--staff-page-header-height, 48px);
  padding: 8px 16px;
  display: flex;
  align-items: center;
  gap: 10px 16px;
  border-bottom: 1px solid var(--staff-border, #e2e5e3);
}

.accountSecurityHeader h1,
.applicationStateHeader h1 {
  margin: 0;
  color: var(--staff-text, #1b1e1c);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
}

.accountSecurityHeader__eyebrow,
.applicationStateHeader__eyebrow {
  margin: 0;
  color: var(--staff-accent, #1f7a4d);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.accountSecurityHeader__description {
  min-width: 0;
  margin: 0 0 0 auto;
  color: var(--staff-secondary, #3e443f);
  font-size: 12px;
}

.accountSecurityForm {
  width: min(100%, 620px);
  margin: 0;
  padding: 20px 16px 28px;
  display: grid;
  align-content: start;
  gap: 6px;
}

.accountSecurityForm label {
  margin: 4px 0 0;
  color: var(--staff-secondary, #3e443f);
  font-size: 12px;
  font-weight: 500;
}

.accountSecurityForm input {
  width: 100%;
  min-height: 34px;
  margin: 0;
  padding: 0 10px;
  color: var(--staff-text, #1b1e1c);
  font-size: 13px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--staff-border, #e2e5e3);
  border-radius: var(--staff-radius, 6px);
  box-shadow: none;
}

.accountSecurityForm .formActions {
  margin-top: 10px;
  padding-top: 12px;
  justify-content: flex-start;
  border-top: 1px solid var(--staff-row-divider, #f0f2f0);
}

.accountSecurityForm :is(button, .secondaryAction) {
  min-height: 32px;
  margin: 0;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 500;
  border-radius: var(--staff-radius, 6px);
}

.applicationStateBody {
  width: min(100%, 720px);
  margin: 0;
  padding: 24px 16px;
}

.applicationStateBody > p {
  margin: 0 0 16px;
  color: var(--staff-secondary, #3e443f);
  font-size: 13px;
}

.applicationStateActions {
  margin: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.applicationStateActions :is(button, a),
.applicationStateBody > .primaryLink {
  min-height: 32px;
  margin: 0;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 500;
  border-radius: var(--staff-radius, 6px);
}

.routeErrorPage.applicationStatePage {
  min-height: 100dvh;
  padding: 24px;
  display: grid;
  place-items: center;
  background: var(--staff-background, #f5f6f5);
}

.routeErrorBody {
  width: min(100%, 620px);
  padding: 0;
  background: #fff;
  border-block: 1px solid var(--staff-border, #e2e5e3);
}

.routeErrorBody .applicationStateHeader {
  min-height: var(--staff-page-header-height, 48px);
  padding: 8px 16px;
  display: flex;
  align-items: center;
  gap: 10px 16px;
  border-bottom: 1px solid var(--staff-border, #e2e5e3);
}

.routeErrorBody > p { padding: 16px 16px 0; }
.routeErrorBody .applicationStateActions { padding: 0 16px 16px; }

.orderFormFeedback {
  margin: 0 16px 12px;
  color: var(--staff-text, #1b1e1c);
  background: #fff;
  border: 1px solid var(--staff-border, #e2e5e3);
  border-left-width: 3px;
  border-radius: var(--staff-radius, 6px);
  scroll-margin-top: 12px;
}

.orderFormFeedback--warning { border-left-color: #9b741d; background: #fffdf5; }
.orderFormFeedback--conflict { border-left-color: #a13d3a; background: #fffafa; }
.orderFormFeedback__header { padding: 9px 12px; border-bottom: 1px solid currentColor; }
.orderFormFeedback--warning .orderFormFeedback__header { border-bottom-color: #eadfbd; }
.orderFormFeedback--conflict .orderFormFeedback__header { border-bottom-color: #efd5d3; }
.orderFormFeedback__header h2 { margin: 0; font-size: 15px; line-height: 1.25; }
.orderFormFeedback__body { padding: 10px 12px; font-size: 13px; }
.orderFormFeedback__body p { margin: 0; }
.orderFormFeedback__body p + p { margin-top: 6px; }
.orderFormFeedback__links { margin: 8px 0 0; padding-left: 20px; }
.orderFormFeedback__links a { color: var(--staff-accent, #1f7a4d); }
.orderFormFeedback__actions {
  margin: 0;
  padding: 9px 12px;
  justify-content: flex-start;
  flex-wrap: wrap;
  border-top: 1px solid var(--staff-row-divider, #f0f2f0);
}

.orderFormFeedback__actions :is(button, a) {
  min-height: 32px;
  margin: 0;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 500;
  border-radius: var(--staff-radius, 6px);
}

.orderStatePage { min-height: calc(100dvh - var(--staff-topbar-height, 52px)); }
.orderPageState {
  margin: 16px;
  padding: 13px 14px;
  color: #702f2d;
  font-size: 13px;
  background: #fffafa;
  border-block: 1px solid #efd5d3;
  border-left: 3px solid #a13d3a;
}
.orderPageState p { margin: 5px 0 0; color: var(--staff-secondary, #3e443f); }

/* Keep keyboard focus visible after the dense route-specific normalizers. */
.staffApp .staffFilterBar :is(input:not([type="checkbox"]):not([type="radio"]), select):focus-visible,
.staffApp .staffFormPage :is(input, select, textarea):focus-visible,
.staffApp .canonicalReportPage :is(input, select, textarea):focus-visible,
.orderFormPage [data-order-layout="canonical-form"] :is(input, select, textarea):focus-visible,
.accountSecurityForm input:focus-visible {
  border-color: var(--staff-accent, #1f7a4d);
  outline: 2px solid var(--staff-accent, #1f7a4d);
  outline-offset: 2px;
  box-shadow: none;
}

@media (max-width: 820px), (pointer: coarse) {
  .staffApp .staffFormPage :is(button, .secondaryButton, .secondaryAction),
  .staffApp .staffNotificationsPage :is(button, .secondaryButton, .secondaryAction),
  .staffApp .canonicalReportPage :is(button, .secondaryButton, .secondaryAction),
  .staffApp .staffListPage:not(.orderJournalPage) :is(
    .staffHierarchyItem button,
    .staffInlineEditor button,
    .staffListSubsection > button,
    .dictionaryDetailPane button,
    .catalogImportPanel button,
    .notificationActions button,
    .notificationActions a
  ),
  .staffApp .staffFormPage :is(input:not([type="checkbox"]):not([type="radio"]), select),
  .staffApp .canonicalReportPage :is(input:not([type="checkbox"]):not([type="radio"]), select) {
    min-height: 44px;
    height: 44px;
  }

  .staffApp .canonicalReportFilterGrid > .canonicalReportChoiceGroup:first-of-type,
  .staffApp .canonicalReportFilterGrid > .canonicalReportChoiceGroup:last-of-type { grid-column: 1; }
  .staffApp .canonicalReportChoiceGroup .checkboxLabel { min-height: 44px; white-space: normal; }
  .staffDetailDrawer__footer :is(button, a) { min-height: 44px; }

  .accountSecurityHeader,
  .applicationStatePage > .applicationStateHeader {
    min-height: auto;
    align-items: flex-start;
    flex-direction: column;
  }
  .accountSecurityHeader__description { margin-left: 0; }
  .accountSecurityForm input { min-height: 44px; font-size: 16px; }
  .accountSecurityForm :is(button, .secondaryAction),
  .applicationStateActions :is(button, a),
  .applicationStateBody > .primaryLink,
  .orderFormFeedback__actions :is(button, a),
  .canonicalReportReferenceFilters > summary,
  .catalogImportReport__disclosure > summary,
  .chatAccountPopup :is(a, button) { min-height: 44px; }

  .orderFormFeedback { margin-inline: 12px; }
  .orderFormFeedback__actions { align-items: stretch; flex-direction: column; }
  .routeErrorPage.applicationStatePage { padding: 12px; }
}

@media print {
  .loadingSheetPage {
    min-height: 0;
    display: block;
  }

  .loadingSheetPage .reportMatrixShell,
  .loadingSheetPage .reportMatrixRegion {
    height: auto;
    overflow: visible;
  }

  .loadingSheetPage .reportMatrix {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 8pt;
  }

  .loadingSheetPage .reportMatrix th,
  .loadingSheetPage .reportMatrix td,
  .loadingSheetPage .reportMatrix .reportRowHeading {
    position: static;
    z-index: auto;
    min-width: 0;
    max-width: none;
    padding: 1.5mm;
    color: #111;
    background: transparent;
    border: 1px solid #777;
  }
}