.side-nav button.grain-diff-nav-child { margin-left: 15px; width: calc(100% - 15px); font-size: 12px; }
.side-nav button.grain-diff-nav-child > svg { width: 16px; height: 16px; }
.dashboard.sidebar-collapsed .side-nav button.grain-diff-nav-child { margin-left: 0; width: 100%; }
.grain-diff-view { --gd-muted: #5c625b; --gd-green: #456014; display: grid; gap: 20px; font-size: 14px; }
.grain-history-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:end; padding:16px; border:1px solid var(--line); border-radius:var(--r-card); background:var(--surface); }
.grain-history-filters label { display:grid; gap:6px; flex:1 1 150px; color:var(--gd-muted); font-size:12px; }
.grain-history-filters label:first-child { flex-basis:240px; }
.grain-history-filters .input,.grain-history-filters .select { width:100%; }
.grain-history .grain-history-scroll { overflow:auto; max-height:none; }
.grain-history .grain-history-table { min-width:1120px; }
.grain-history .grain-history-table th { padding:16px; font-size:12px; font-weight:600; }
.grain-history .grain-history-table th:nth-child(1) { width:14%; }
.grain-history .grain-history-table th:nth-child(2) { width:23%; }
.grain-history .grain-history-table th:nth-child(3) { width:14%; }
.grain-history .grain-history-table th:nth-child(4) { width:17%; }
.grain-history .grain-history-table th:nth-child(5) { width:17%; }
.grain-history .grain-history-table th:nth-child(6) { width:15%; }
.grain-history .grain-history-table td { padding:20px 16px; font-size:13px; line-height:1.5; }
.grain-history .grain-history-table tbody tr { cursor:default; }
.grain-history .grain-history-table .grain-diff-document { min-height:32px; font-size:14px; }
.grain-history-meta { display:block; margin-top:6px; font-size:12px; line-height:1.5; color:var(--gd-muted); }
.grain-history-party { display:block; font-size:13px; font-weight:600; }
.grain-history-email { display:block; margin-top:8px; font-size:12px; color:var(--ink-soft); overflow-wrap:anywhere; }
.grain-history-date { display:block; font-size:13px; font-weight:500; font-variant-numeric:tabular-nums; white-space:nowrap; }
.grain-history-date .grain-history-meta { margin-top:3px; font-weight:400; }
.grain-history-actor { margin-top:10px; }
.grain-history-amount { font-variant-numeric:tabular-nums; }
.grain-history-amount strong { font-size:14px; white-space:nowrap; }
.grain-history-muted { color:var(--gd-muted); font-size:13px; }
.grain-history-status { display:inline-flex; padding:6px 10px; border-radius:6px; background:var(--surface-2); color:var(--ink-soft); font-size:12px; font-weight:600; line-height:1.5; }
.grain-history-status.is-sent { background:#edf3e4; color:#3d5519; }
.grain-history-status.is-manual { background:#eef0f6; color:#435371; }
.grain-history-status.is-attention { background:#fbf0d9; color:#78520e; }
.grain-history-status.is-pending { background:#edf0f5; color:#4a5c73; }
@media(max-width:1200px) {
  .grain-history .grain-history-table { min-width:0; }
  .grain-history .grain-history-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .grain-history .grain-history-table tbody { display:block; }
  .grain-history .grain-history-table tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px 24px; padding:24px; border-bottom:1px solid var(--line); }
  .grain-history .grain-history-table tr:last-child { border-bottom:0; }
  .grain-history .grain-history-table td { display:block; padding:0; border:0; }
  .grain-history .grain-history-table td:nth-child(1), .grain-history .grain-history-table td:nth-child(2) { grid-column:1 / -1; }
  .grain-history .grain-history-table td::before { content:attr(data-label); display:block; margin-bottom:8px; font-size:12px; font-weight:500; color:var(--gd-muted); }
  .grain-history .grain-history-table .grain-diff-document { min-height:44px; }
}
.grain-history-detail { display:grid; gap:20px; padding:20px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-card); overflow-wrap:anywhere; }
.grain-history-detail > button { justify-self:start; }
.grain-followup { display:grid; gap:20px; padding:24px; border:1px solid var(--line); border-radius:var(--r-card); background:var(--surface); min-width:0; }
.grain-followup h3,.grain-followup h4 { margin:0 0 12px; }
.grain-followup-heading { display:flex; justify-content:space-between; align-items:start; gap:16px; flex-wrap:wrap; }
.grain-followup-tabs,.grain-followup-actions { display:flex; flex-wrap:wrap; gap:10px; }
.grain-followup .btn,.grain-followup-tabs .btn { min-height:44px; white-space:normal; }
.grain-followup-totals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:0; padding:18px 0; border-block:1px solid var(--line); }
.grain-followup-totals dt { font-size:12px; color:var(--gd-muted); margin-bottom:8px; }
.grain-followup-totals dd { margin:0; font-size:18px; font-weight:600; font-variant-numeric:tabular-nums; }
.grain-followup-form { display:grid; gap:16px; padding:20px; background:var(--surface-2); border:1px solid var(--line); border-radius:8px; }
.grain-followup-form label { display:grid; gap:8px; font-size:13px; min-width:0; }
.grain-followup-form .input,.grain-followup-form .select { width:100%; min-width:0; }
.grain-followup-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.grain-followup-form .grain-followup-check { display:flex; align-items:start; gap:10px; line-height:1.6; }
.grain-followup-check input { flex-shrink:0; margin-top:5px; }
.grain-followup-new { display:inline-block; color:#78520e; font-size:12px; font-weight:600; margin-top:6px; }
.grain-followup-reply { margin-top:16px; padding:20px 0; border-top:1px solid var(--line); }
.grain-followup-reply header { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:baseline; }
.grain-followup-reply header strong { flex:1 1 300px; }
.grain-followup-reply header>span { font-size:12px; color:var(--gd-muted); }
.grain-followup summary,.grain-history-detail>details>summary { cursor:pointer; padding:12px 0; line-height:1.6; }
.grain-followup-body { white-space:pre-wrap; overflow-wrap:anywhere; max-height:320px; overflow:auto; font-size:13px; line-height:1.7; background:var(--surface-2); padding:16px; border-radius:6px; }
.grain-followup-files,.grain-followup-credits { list-style:none; padding:0; display:grid; gap:12px; }
.grain-followup-files li { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.grain-followup-files a { display:flex; align-items:center; gap:8px; min-height:44px; min-width:0; overflow-wrap:anywhere; }
.grain-followup-files svg { width:18px; height:18px; flex-shrink:0; }
.grain-followup-files a span { color:var(--gd-muted); font-size:12px; }
.grain-followup-credits li { display:grid; grid-template-columns:1fr auto; gap:8px 16px; padding:14px; border:1px solid var(--line); border-radius:6px; }
.grain-followup-credits li span { grid-column:1/-1; color:var(--gd-muted); font-size:12px; }
.grain-followup-resolution { padding:16px; background:#edf3e4; border-radius:6px; font-size:13px; }
@media(max-width:700px) { .grain-followup{padding:16px;} .grain-followup-totals,.grain-followup-fields{grid-template-columns:1fr;} .grain-followup-form{padding:14px;} .grain-followup-files a{flex-wrap:wrap;} }
.grain-history-detail ol { padding-left:20px; line-height:1.8; }
.grain-diff-manual > .btn { width:100%; min-height:44px; font-size:13px; white-space:normal; }
.grain-diff-manual-confirm { margin-top:12px; display:grid; gap:14px; padding:14px; border:1px solid var(--line); border-radius:8px; font-size:13px; line-height:1.6; }
.grain-diff-manual-actions { display:flex; flex-wrap:wrap; gap:8px; }
.grain-diff-manual-actions .btn { white-space:normal; }
@media(max-width:600px) { .grain-history-detail .grain-diff-facts { grid-template-columns:1fr; } .grain-history-filters label { flex-basis:200px; } }
.grain-diff-view * { min-width: 0; }
.grain-diff-view svg { width: 17px; height: 17px; flex: 0 0 auto; }
.grain-diff-view button, .grain-diff-view input, .grain-diff-view select, .grain-diff-view textarea { transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease; }
.grain-diff-view :is(button, input, select, textarea):focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.grain-diff-view .input::placeholder { color: var(--gd-muted); }
.grain-diff-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.grain-diff-source { display: grid; grid-template-columns: minmax(210px, auto) minmax(310px, 1fr) auto; grid-template-areas: "main period refresh" "message message message"; align-items: end; gap: 14px 18px; padding: 15px 17px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-card); }
.grain-diff-source-main { grid-area: main; display: flex; align-items: center; gap: 11px; }
.grain-diff-source-main > svg { width: 21px; height: 21px; color: var(--gd-green); }
.grain-diff-source-main strong, .grain-diff-source-main span { display: block; }
.grain-diff-source-main strong { font-size: 15px; font-weight: 600; }
.grain-diff-source-main span { margin-top: 3px; color: var(--gd-muted); font-size: 12px; }
.grain-diff-source > p { grid-area: message; max-width: 110ch; color: var(--gd-muted); font-size: 12px; line-height: 1.6; }
.grain-diff-period { grid-area: period; display: grid; grid-template-columns: minmax(138px, 1fr) minmax(138px, 1fr) auto; align-items: end; gap: 9px; }
.grain-diff-period label { display: grid; gap: 4px; }
.grain-diff-period label > span { color: var(--gd-muted); font-size: 11px; }
.grain-diff-period .input { width: 100%; min-height: 40px; padding: 8px 10px; font-size: 12px; font-variant-numeric: tabular-nums; }
.grain-diff-period .btn { min-height: 40px; padding-left: 14px; padding-right: 14px; font-size: 12px; }
.grain-diff-refresh { grid-area: refresh; font-size: 12px; }
.grain-diff-overview { padding: 0 2px; line-height: 1.6; }
.grain-diff-overview p { color: var(--ink-soft); }
.grain-diff-overview strong { color: var(--ink); font-weight: 600; }
.grain-diff-overview > span { display: block; color: var(--gd-muted); font-size: 12px; margin-top: 2px; }
.grain-diff-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line-strong); }
.grain-diff-tabs button { position: relative; display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 16px; background: transparent; border: 0; border-bottom: 2px solid transparent; color: var(--gd-muted); font-size: 14px; }
.grain-diff-tabs button:hover { background: var(--surface-2); color: var(--ink); }
.grain-diff-tabs button.is-active { color: var(--gd-green); border-bottom-color: var(--gd-green); font-weight: 600; }
.grain-diff-tabs b { padding: 2px 7px; border-radius: 5px; background: #e9eae6; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.grain-diff-tabs .is-active b { color: var(--gd-green); background: var(--s-granos-tint); }
.grain-diff-toolbar { display: grid; grid-template-columns: minmax(200px, 1fr) 145px 182px; align-items: end; gap: 12px; margin-top: 17px; }
.grain-diff-search { position: relative; display: block; }
.grain-diff-search > svg { position: absolute; top: 14px; left: 13px; color: var(--gd-muted); pointer-events: none; }
.grain-diff-search .input { width: 100%; min-height: 44px; padding-left: 39px; font-size: 13px; }
.grain-diff-select { display: grid; gap: 5px; }
.grain-diff-select > span { color: var(--gd-muted); font-size: 12px; }
.grain-diff-select .select { width: 100%; min-height: 44px; font-size: 13px; }
.grain-diff-scope { margin-top: 11px; color: var(--gd-muted); font-size: 12px; line-height: 1.5; }
.grain-diff-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 370px; align-items: start; gap: 18px; }
.grain-diff-list, .grain-diff-detail { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
.grain-diff-list { overflow: hidden; }
.grain-diff-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 55px; padding: 14px 17px; }
.grain-diff-list-heading h2 { font-size: 14px; font-weight: 600; }
.grain-diff-list-heading > span { color: var(--gd-muted); font-size: 12px; }
.grain-diff-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.grain-diff-table th { padding: 11px 14px; background: var(--surface-2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: left; color: var(--gd-muted); font-size: 11px; font-weight: 500; }
.grain-diff-table th:nth-child(1) { width: 37%; }
.grain-diff-table th:nth-child(2) { width: 41%; }
.grain-diff-table th:nth-child(3) { width: 22%; }
.grain-diff-table td { vertical-align: top; padding: 16px 14px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.grain-diff-table tr:last-child td { border-bottom: 0; }
.grain-diff-table tbody tr { cursor: pointer; transition: background-color 160ms ease; }
.grain-diff-table tbody tr:hover { background: var(--surface-2); }
.grain-diff-table tbody tr.is-selected { background: #edf2e6; }
.grain-diff-document { display: inline-flex; gap: 6px; align-items: center; max-width: 100%; padding: 0; border: 0; background: transparent; color: var(--brand-700); font-size: 13px; line-height: 1.5; font-weight: 600; text-align: left; overflow-wrap: anywhere; }
.grain-diff-document:hover { text-decoration: underline; }
.grain-diff-document svg { width: 13px; height: 13px; }
.grain-diff-row-meta, .grain-diff-row-ctg { display: block; color: var(--gd-muted); font-size: 11px; line-height: 1.55; margin-top: 4px; }
.grain-diff-row-ctg { font-variant-numeric: tabular-nums; }
.grain-diff-transport { display: block; color: var(--ink-soft); font-size: 12px; font-weight: 500; line-height: 1.5; }
.grain-diff-status { display: inline-flex; align-items: center; max-width: 100%; padding: 3px 6px; border-radius: 4px; color: #575b55; background: #f0f1ee; font-size: 10px; font-weight: 500; line-height: 1.4; }
.grain-diff-table .grain-diff-status { margin-top: 7px; }
.grain-diff-status.is-note { background: #fbf0d9; color: #78520e; }
.grain-diff-status.is-waiting { background: #edf0f5; color: #4a5c73; }
.grain-diff-status.is-pending { background: #edf0f5; color: #4a5c73; }
.grain-diff-note-marker { display: flex; align-items: center; gap: 4px; margin-top: 6px; color: #71551c; font-size: 10px; }
.grain-diff-note-marker svg { width: 12px; height: 12px; }
.grain-diff-table .grain-diff-numeric { text-align: right; }
.grain-diff-kg { display: block; color: var(--ink-soft); font-size: 13px; line-height: 1.6; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.grain-diff-kg.is-positive { color: #984233; }
.grain-diff-pagination { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 14px; border-top: 1px solid var(--line); font-size: 11px; color: var(--gd-muted); }
.grain-diff-pagination > div { display: flex; align-items: center; gap: 8px; }
.grain-diff-pagination .icon-button { width: 31px; height: 31px; }
.grain-diff-detail { position: sticky; top: 18px; overflow-wrap: anywhere; }
.grain-diff-detail:focus { outline: none; }
.grain-diff-detail:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.grain-diff-detail-header { padding: 20px; border-bottom: 1px solid var(--line); }
.grain-diff-detail-label { color: var(--gd-muted); font-size: 12px; }
.grain-diff-detail-header h2 { margin: 4px 0 5px; color: var(--ink); font-size: 21px; font-weight: 600; line-height: 1.35; font-variant-numeric: tabular-nums; }
.grain-diff-detail-header p { color: var(--gd-muted); font-size: 11px; line-height: 1.5; }
.grain-diff-detail-header .grain-diff-status { margin-top: 12px; font-size: 11px; }
.grain-diff-journey { display: flex; align-items: start; gap: 8px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.grain-diff-journey > svg { color: var(--gd-muted); margin-top: 2px; }
.grain-diff-journey strong { font-size: 12px; font-weight: 600; line-height: 1.55; }
.grain-diff-journey p { margin-top: 4px; font-size: 12px; line-height: 1.5; }
.grain-diff-detail-section { padding: 17px 20px; border-bottom: 1px solid var(--line); }
.grain-diff-detail-section:last-child { border-bottom: 0; }
.grain-diff-detail-section h3 { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: 13px; font-weight: 600; line-height: 1.5; margin-bottom: 14px; }
.grain-diff-detail-section h3 > svg { color: var(--gd-muted); }
.grain-diff-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 16px; margin: 0; }
.grain-diff-facts .is-full { grid-column: 1 / -1; }
.grain-diff-facts dt { color: var(--gd-muted); font-size: 11px; line-height: 1.5; }
.grain-diff-facts dd { margin: 3px 0 0; color: var(--ink-soft); font-size: 12px; line-height: 1.5; }
.grain-diff-calculation { display: grid; gap: 10px; margin: 0; }
.grain-diff-calculation > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 12px; line-height: 1.5; }
.grain-diff-calculation dt { color: var(--gd-muted); }
.grain-diff-calculation dd { margin: 0; text-align: right; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.grain-diff-calculation .is-emphasis { padding-top: 10px; border-top: 1px solid var(--line); }
.grain-diff-calculation .is-emphasis dd { font-weight: 600; }
.grain-diff-calculation .is-total { margin-top: 1px; padding: 11px 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.grain-diff-calculation .is-total dt, .grain-diff-calculation .is-total dd { color: var(--ink); font-weight: 600; }
.grain-diff-recipient-facts { display: grid; gap: 8px; margin: 0 0 15px; padding: 0 0 15px; border-bottom: 1px solid var(--line); }
.grain-diff-recipient-facts > div { display: grid; grid-template-columns: minmax(80px, .7fr) minmax(0, 1.3fr); gap: 12px; font-size: 12px; line-height: 1.5; }
.grain-diff-recipient-facts dt { color: var(--gd-muted); }
.grain-diff-recipient-facts dd { min-width: 0; margin: 0; color: var(--ink-soft); font-weight: 500; overflow-wrap: anywhere; }
.grain-diff-field-note { max-width: 70ch; color: var(--gd-muted); font-size: 11px; line-height: 1.6; margin-top: 12px; }
.grain-diff-mail-note { display: grid; gap: 7px; margin-top: 17px; }
.grain-diff-mail-note > span:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; color: var(--ink); font-size: 12px; font-weight: 600; }
.grain-diff-mail-note small { color: var(--gd-muted); font-size: 10px; font-weight: 500; }
.grain-diff-mail-note textarea { width: 100%; min-height: 92px; resize: vertical; padding: 10px 11px; color: var(--ink); font: inherit; font-size: 12px; line-height: 1.55; }
.grain-diff-mail-note textarea::placeholder { color: var(--gd-muted); }
.grain-diff-mail-note-meta { display: flex; justify-content: space-between; gap: 12px; color: var(--gd-muted); font-size: 10px; line-height: 1.5; }
.grain-diff-mail-note-meta > span:first-child { max-width: 26ch; }
.grain-diff-mail-note-meta > span:last-child { flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.grain-diff-mail-preview { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.grain-diff-mail-preview-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.grain-diff-mail-preview-heading strong { color: var(--ink); font-size: 12px; font-weight: 600; }
.grain-diff-mail-preview-heading span { color: var(--gd-muted); font-size: 10px; text-align: right; }
.grain-diff-mail-preview-body { padding: 13px 14px; color: var(--ink-soft); background: var(--surface-2); border: 1px solid var(--line); border-radius: 5px; font-size: 12px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.grain-diff-receipt { margin-top: 17px; }
.grain-diff-count { font-size: 11px; color: var(--gd-muted); font-weight: 500; }
.grain-diff-comment { padding: 11px 12px; background: #fcf6e9; border: 1px solid #e8d9b9; border-radius: 5px; white-space: pre-wrap; color: #574522; font-size: 12px; line-height: 1.75; }
.grain-diff-no-comment { color: var(--gd-muted); font-size: 12px; line-height: 1.6; }
.grain-diff-blockers { margin-top: 18px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; }
.grain-diff-blockers strong { font-weight: 600; }
.grain-diff-blockers ul { margin: 7px 0 0; padding-left: 18px; }
.grain-diff-blockers li + li { margin-top: 5px; }
.grain-diff-approve { margin-top: 19px; min-height: 44px; width: 100%; font-size: 12px; white-space: normal; line-height: 1.4; padding: 10px 12px; }
.grain-diff-approve:disabled { color: #5a6058; background: #e8ebe4; border-color: #dde1d7; opacity: 1; }
.grain-diff-more { border-radius: 0 0 var(--r-card) var(--r-card); }
.grain-diff-more summary { min-height: 48px; padding: 14px 20px; color: var(--brand-700); font-size: 12px; font-weight: 500; line-height: 1.7; cursor: pointer; }
.grain-diff-more summary:hover { background: var(--surface-2); }
.grain-diff-more summary:focus-visible { outline: 2px solid var(--brand); outline-offset: -3px; }
.grain-diff-more > div { padding: 3px 20px 20px; }
.grain-diff-back { display: none; }
.grain-diff-detail-empty { min-height: 230px; display: grid; place-content: center; justify-items: center; gap: 12px; padding: 30px; color: var(--gd-muted); font-size: 13px; text-align: center; }
.grain-diff-detail-empty > svg { width: 26px; height: 26px; }
.grain-diff-empty, .grain-diff-loading { display: grid; justify-items: center; align-content: center; gap: 12px; min-height: 270px; padding: 32px 24px; text-align: center; background: var(--surface); }
.grain-diff-empty > svg, .grain-diff-loading > svg { color: var(--gd-muted); width: 24px; height: 24px; }
.grain-diff-empty h3, .grain-diff-loading h2 { font-size: 15px; font-weight: 600; }
.grain-diff-empty p, .grain-diff-loading p { color: var(--gd-muted); font-size: 13px; line-height: 1.6; }
.grain-diff-loading { border: 1px solid var(--line); border-radius: var(--r-card); }
.grain-diff-skeleton { width: min(500px, 100%); height: 25px; border-radius: 4px; background: #edeFEB; }
.grain-diff-skeleton:nth-last-child(2) { width: min(420px, 90%); }
.grain-diff-skeleton:last-child { width: min(460px, 95%); }
.grain-diff-error { display: flex; gap: 10px; align-items: start; padding: 14px 16px; color: #8f372a; background: #fbefec; border: 1px solid #eacdc7; border-radius: var(--r-card); font-size: 12px; line-height: 1.6; }
.grain-diff-error strong { font-weight: 600; }
.grain-diff-error > svg { margin-top: 2px; }

@media (min-width: 1101px) {
  .grain-diff-table-wrap { max-height: min(650px, 65vh); overflow: auto; overscroll-behavior: contain; }
  .grain-diff-table th { position: sticky; top: 0; z-index: 1; }
  .grain-diff-detail { max-height: calc(100vh - 36px); overflow-y: auto; overscroll-behavior: contain; }
}

@media (max-width: 1250px) and (min-width: 1101px) {
  .grain-diff-workspace { grid-template-columns: minmax(0, 1fr) 330px; gap: 12px; }
  .grain-diff-table th, .grain-diff-table td { padding-left: 10px; padding-right: 10px; }
  .grain-diff-source { grid-template-columns: 1fr auto; grid-template-areas: "main refresh" "period period" "message message"; }
}
@media (max-width: 1100px) {
  .grain-diff-workspace { display: block; }
  .grain-diff-detail { display: none; position: static; }
  .grain-diff-view.is-detail-open .grain-diff-list-controls, .grain-diff-view.is-detail-open .grain-diff-list { display: none; }
  .grain-diff-view.is-detail-open .grain-diff-detail { display: block; }
  .grain-diff-detail-header, .grain-diff-detail-section { padding: 20px 24px; }
  .grain-diff-back { display: flex; align-items: center; gap: 7px; width: 100%; min-height: 44px; padding: 12px 24px; background: var(--surface-2); border: 0; border-bottom: 1px solid var(--line); color: var(--brand-700); font-size: 13px; text-align: left; border-radius: var(--r-card) var(--r-card) 0 0; }
  .grain-diff-back:hover { background: var(--brand-tint); }
  .grain-diff-source { grid-template-columns: 1fr auto; grid-template-areas: "main refresh" "period period" "message message"; }
  .grain-diff-source > p { max-width: none; }
  .grain-diff-table th:nth-child(1) { width: 36%; }
  .grain-diff-table th:nth-child(2) { width: 44%; }
  .grain-diff-table th:nth-child(3) { width: 20%; }
}
@media (max-width: 600px) {
  .grain-diff-view { gap: 16px; }
  .grain-diff-source { padding: 12px; gap: 10px; }
  .grain-diff-source-main { flex: 1; }
  .grain-diff-source-main > svg { display: none; }
  .grain-diff-source-main strong { font-size: 14px; }
  .grain-diff-source-main span { font-size: 11px; }
  .grain-diff-source > p { font-size: 11px; line-height: 1.6; }
  .grain-diff-period { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 9px; }
  .grain-diff-period .btn { grid-column: 1 / -1; }
  .grain-diff-refresh { width: 40px; min-height: 40px; padding: 0; }
  .grain-diff-refresh > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .grain-diff-overview { font-size: 13px; }
  .grain-diff-tabs { gap: 0; }
  .grain-diff-tabs button { flex: 1; flex-wrap: wrap; justify-content: center; align-content: center; gap: 5px; padding: 10px 4px; font-size: 11px; line-height: 1.5; }
  .grain-diff-tabs button > svg { display: none; }
  .grain-diff-tabs b { padding: 1px 5px; font-size: 10px; }
  .grain-diff-toolbar { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 12px 9px; }
  .grain-diff-search { grid-column: 1 / -1; }
  .grain-diff-search .input { font-size: 13px; }
  .grain-diff-scope { font-size: 11px; }
  .grain-diff-table, .grain-diff-table tbody { display: block; }
  .grain-diff-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .grain-diff-table tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "document kilos" "transport transport"; gap: 11px 12px; padding: 13px 15px 17px; border-top: 1px solid var(--line); }
  .grain-diff-table td { display: block; padding: 0; border: 0; }
  .grain-diff-table td:nth-child(1) { grid-area: document; }
  .grain-diff-table td:nth-child(2) { grid-area: transport; padding-top: 10px; border-top: 1px solid #e4e7de; }
  .grain-diff-table td:nth-child(3) { grid-area: kilos; padding-top: 10px; }
  .grain-diff-document { min-height: 44px; font-size: 14px; }
  .grain-diff-document svg { display: inline; }
  .grain-diff-transport { font-size: 13px; line-height: 1.6; }
  .grain-diff-row-meta, .grain-diff-row-ctg { font-size: 12px; }
  .grain-diff-kg { font-size: 14px; white-space: nowrap; }
  .grain-diff-status { font-size: 12px; padding: 4px 7px; }
  .grain-diff-note-marker { display: inline-flex; margin-left: 8px; font-size: 12px; }
  .grain-diff-list-heading { padding: 13px 11px; }
  .grain-diff-list-heading h2 { font-size: 13px; }
  .grain-diff-list-heading > span { font-size: 11px; }
  .grain-diff-pagination { padding: 11px; gap: 4px; }
  .grain-diff-pagination > div { gap: 5px; }
  .grain-diff-pagination .icon-button { width: 38px; height: 38px; }
  .grain-diff-detail-header, .grain-diff-detail-section { padding: 18px 16px; }
  .grain-diff-back { padding-left: 16px; }
  .grain-diff-detail-header h2 { font-size: 21px; }
  .grain-diff-calculation > div { font-size: 12px; }
  .grain-diff-facts { gap: 13px; }
  .grain-diff-detail-header p, .grain-diff-facts dt, .grain-diff-facts dd, .grain-diff-field-note, .grain-diff-no-comment, .grain-diff-comment, .grain-diff-more summary, .grain-diff-mail-note > span:first-child, .grain-diff-mail-note textarea { font-size: 12px; }
  .grain-diff-mail-note-meta { font-size: 11px; }
  .grain-diff-more summary { padding-left: 16px; padding-right: 16px; }
  .grain-diff-more > div { padding-left: 16px; padding-right: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .grain-diff-view *, .grain-diff-view *::before, .grain-diff-view *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}