@font-face { font-family: "Instrument Sans"; font-style: normal; font-weight: 400 700; font-stretch: 75% 100%; font-display: optional; src: url("/assets/fonts/instrument-sans.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: optional; src: url("/assets/fonts/ibm-plex-mono-400.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: optional; src: url("/assets/fonts/ibm-plex-mono-500.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: optional; src: url("/assets/fonts/ibm-plex-mono-600.ttf") format("truetype"); }
@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 200 800; font-display: optional; src: url("/assets/fonts/newsreader.ttf") format("truetype"); }
@font-face { font-family: "Instrument Sans Fallback"; font-style: normal; font-weight: 400 500; src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("Arimo"); size-adjust: 100.99%; ascent-override: 97%; descent-override: 25%; line-gap-override: 0%; }
@font-face { font-family: "Instrument Sans Fallback"; font-style: normal; font-weight: 600 700; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"), local("Arimo Bold"); size-adjust: 100.99%; ascent-override: 97%; descent-override: 25%; line-gap-override: 0%; }
@font-face { font-family: "IBM Plex Mono Fallback"; font-style: normal; font-weight: 400 500; src: local("Menlo Regular"), local("Menlo-Regular"), local("DejaVu Sans Mono"); size-adjust: 99.65%; ascent-override: 102.5%; descent-override: 27.5%; line-gap-override: 0%; }
@font-face { font-family: "IBM Plex Mono Fallback"; font-style: normal; font-weight: 600 700; src: local("Menlo Bold"), local("Menlo-Bold"), local("DejaVu Sans Mono Bold"); size-adjust: 99.65%; ascent-override: 102.5%; descent-override: 27.5%; line-gap-override: 0%; }
/* Sicari · Assay Desk — generated from tokens.json */
:root, [data-theme="light"] {
  color-scheme: light;
  --ground: #F3F1EB;
  --rail: #EAE7DF;
  --surface: #FAF9F5;
  --raised: #FFFFFF;
  --well: #E5E2D9;
  --selected: #DFECE5;
  --hairline: #CEC9BC;
  --divider: #E4E0D7;
  --edge: #7E786C;
  --ink: #19201D;
  --ink-2: #343D38;
  --quiet: #4D5852;
  --muted: #626C66;
  --disabled: #7A817C;
  --emerald: #086348;
  --emerald-border: #4C8870;
  --emerald-tint: #DFEEE6;
  --emerald-body: #174C3B;
  --on-emerald: #FFFFFF;
  --amber: #805000;
  --amber-border: #A57B2D;
  --amber-tint: #F7ECD2;
  --amber-body: #694200;
  --purple: #61489A;
  --purple-border: #8B78B5;
  --purple-tint: #ECE7F5;
  --purple-body: #4E3C7D;
  --red: #9D342F;
  --red-border: #B96860;
  --red-tint: #F7E3DF;
  --buyer: #315F76;
  --buyer-tint: #E3EDF0;
  --shadow-1: 0 1px 2px rgba(20,27,24,0.06);
  --shadow-2: 0 12px 32px rgba(20,27,24,0.14);
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  color-scheme: dark;
  --ground: #0D1214;
  --rail: #11181B;
  --surface: #151D20;
  --raised: #1C262A;
  --well: #202A2E;
  --selected: #152A24;
  --hairline: #334045;
  --divider: #242F33;
  --edge: #718087;
  --ink: #EDF1EC;
  --ink-2: #CDD5D0;
  --quiet: #AFBBB4;
  --muted: #98A69E;
  --disabled: #718079;
  --emerald: #61D5A6;
  --emerald-border: #39886B;
  --emerald-tint: #102A21;
  --emerald-body: #A8E8CF;
  --on-emerald: #06251A;
  --amber: #F0BE68;
  --amber-border: #98763C;
  --amber-tint: #2C2314;
  --amber-body: #F1D6A2;
  --purple: #C2B1EF;
  --purple-border: #79669F;
  --purple-tint: #251F35;
  --purple-body: #D2C5F2;
  --red: #F0938B;
  --red-border: #A6534D;
  --red-tint: #321A19;
  --buyer: #94C8D8;
  --buyer-tint: #17292F;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.22);
  --shadow-2: 0 14px 36px rgba(0,0,0,0.42);
} }
[data-theme="dark"] {
  color-scheme: dark;
  --ground: #0D1214;
  --rail: #11181B;
  --surface: #151D20;
  --raised: #1C262A;
  --well: #202A2E;
  --selected: #152A24;
  --hairline: #334045;
  --divider: #242F33;
  --edge: #718087;
  --ink: #EDF1EC;
  --ink-2: #CDD5D0;
  --quiet: #AFBBB4;
  --muted: #98A69E;
  --disabled: #718079;
  --emerald: #61D5A6;
  --emerald-border: #39886B;
  --emerald-tint: #102A21;
  --emerald-body: #A8E8CF;
  --on-emerald: #06251A;
  --amber: #F0BE68;
  --amber-border: #98763C;
  --amber-tint: #2C2314;
  --amber-body: #F1D6A2;
  --purple: #C2B1EF;
  --purple-border: #79669F;
  --purple-tint: #251F35;
  --purple-body: #D2C5F2;
  --red: #F0938B;
  --red-border: #A6534D;
  --red-tint: #321A19;
  --buyer: #94C8D8;
  --buyer-tint: #17292F;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.22);
  --shadow-2: 0 14px 36px rgba(0,0,0,0.42);
}
:root {
  --font-sans: "Instrument Sans", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --font-display: "Newsreader", Georgia, serif;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --radius-phone: 34px;
  --border-1: 1px;
  --border-2: 2px;
  --icon-stroke: 1.8px;
}
/* Aliases: every name the current screens use still resolves to an Assay Desk token. */
:root {
  --sans: var(--font-sans);
  --mono: var(--font-mono);
  --edge-structure: var(--edge);
  --disabled-ink: var(--disabled);
  --amber-body-2: var(--amber-body);
  --amber-meta: var(--amber);
  --uncertain-tint: var(--amber-tint);
  --row-h: 28px;         --row-h-evidence: 32px;   --control-h: 26px;
  --tap: 44px;           --tap-decisive: 48px;     --dismiss: 28px;
  --radius-control: 4px; --radius-chip: 2px;       --radius-well: 3px;
  --edge-w: 2px;         --focus-ring: 2px solid var(--emerald);
  --nav-full: 232px;     --nav-compact: 190px;     --nav-tight: 168px;
  --desk-full: 384px;    --desk-compact: 336px;
  --paper: var(--surface); --soft: var(--raised); --line: var(--hairline);
  --accent: var(--emerald); --accent-dark: var(--emerald);
  --danger: var(--amber); --focus: var(--emerald);
}
:root {
    /* The design's stacks (assayTokens.ts, its tokens.css as written) with each face's measured fallback second (operatorFontFaces). */
    --font-sans: "Instrument Sans", "Instrument Sans Fallback", system-ui, sans-serif;
    --font-mono: "IBM Plex Mono", "IBM Plex Mono Fallback", ui-monospace, Menlo, monospace;
    color: var(--ink); background: var(--ground);
    font-family: var(--sans); font-size: 13px; font-synthesis: none; line-height: 1.4;
}
/* Every empty box's hint, desk and buyer alike: clearly lighter than what a person types, in the interface face, so a sample
   never reads as an entered value (staging walk 2026-10-31: "1,748.00" on the Money desk looked typed). */
:root, [data-theme="light"] { --field-hint: #878D89; } /* 3.4:1 on the field (--raised); entered --ink is 16.6:1 */
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --field-hint: #718079; } } /* 3.7:1; entered 13.5:1 */
[data-theme="dark"] { --field-hint: #718079; }
::placeholder { color: var(--field-hint); opacity: 1; font-family: var(--sans); font-weight: 400; }


* { box-sizing: border-box; }
body { margin: 0; min-width: 20rem; background: var(--ground); color: var(--ink); }
button, select, input { font: inherit; }
a { color: var(--accent-dark); }
[hidden] { display: none !important; }

.skip-link {
  position: fixed; top: .5rem; left: .5rem; z-index: 20; padding: .7rem 1rem;
  background: var(--ink); color: var(--ground); transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

h1, h2 { margin: 0; font-family: var(--sans); line-height: 1.15; letter-spacing: -.015em; }
h1 { font-size: 20px; font-weight: 600; }
h2 { font-size: 16px; font-weight: 600; }
.eyebrow { margin: 0 0 .2rem; font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); }
.context-label { max-width: 28rem; color: var(--quiet); font-size: .88rem; text-align: right; }
.read-only-label { padding-left: .5rem; border-left: var(--edge-w) solid var(--edge-structure); color: var(--quiet); font-size: 11px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }

main:not(.login-shell) { width: min(92rem, 100%); margin: 0 auto; padding: clamp(1rem, 3vw, 2rem); }
.control-panel, .notice-panel, .table-frame, dialog, .login-card { background: var(--paper); border: 1px solid var(--line); }
.control-panel, .notice-panel { padding: clamp(1rem, 3vw, 1.6rem); margin-bottom: 1.25rem; }
.control-panel { display: grid; grid-template-columns: minmax(13rem, 1fr) minmax(16rem, 1fr); gap: 2rem; }
.control-panel p, .notice-panel p { color: var(--muted); }
form { display: grid; gap: .5rem; }
label { font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
select { width: 100%; min-height: var(--control-h); padding: 3px 8px; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); }
input { width: 100%; min-height: var(--control-h); padding: 3px 8px; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); }
textarea { display: block; width: 100%; padding: 6px 8px; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); font: inherit; resize: vertical; }
input[type="file"] { min-height: 3.25rem; padding: .7rem; border-style: dashed; background: var(--well); }
#deployment-field { display: grid; gap: .5rem; }

.button, .icon-button {
  min-height: var(--control-h); border: 1px solid var(--accent); border-radius: var(--radius-control); cursor: pointer;
  font-weight: 750; text-decoration: none;
}
.button { display: inline-flex; align-items: center; justify-content: center; padding: 3px 10px; color: var(--on-emerald); background: var(--accent); }
.button:hover { background: var(--emerald-body); color: var(--on-emerald); }
.button-quiet { color: var(--ink-2); background: var(--raised); border-color: var(--hairline); }
.button[data-refusal], .button[data-refusal-action] { background: transparent; color: var(--ink-2); border: 1px dashed var(--ink-2); }
.button-wide { width: 100%; margin: .8rem 0; }
.button:disabled { cursor: wait; opacity: .6; }
.icon-button { width: var(--dismiss); min-height: var(--dismiss); padding: 0; color: var(--ink); background: var(--raised); font-size: 1.55rem; }
:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }

.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: 0 0 .8rem; }
.inventory-filters {
  display: grid; grid-template-columns: repeat(5, minmax(9rem, 1fr)); gap: .7rem;
  margin-bottom: 1rem; padding: 1rem; background: var(--paper); border: 1px solid var(--line);
}
.inventory-filters > div { display: grid; align-content: end; gap: .35rem; }
.inventory-filters .filter-search { grid-column: span 2; }
.filter-help { margin: 0; color: var(--muted); font-size: 11px; }
/* A card on the way, on the buy's desk: its name, its state and its own Arrived on one line that wraps on a phone. */
.onway-line { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; padding: .4rem 0; border-bottom: 1px solid var(--divider); }
.onway-line .onway-title { flex: 1 1 11rem; min-width: 0; overflow-wrap: anywhere; }
.inventory-filters > .filter-actions { grid-column: 1 / -1; display: flex; flex-direction: row; flex-wrap: wrap; }
.table-frame { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; background: var(--surface); }
caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
th, td { height: var(--row-h); padding: 4px 8px; border-bottom: 1px solid var(--divider); text-align: left; vertical-align: middle; }
th { height: var(--row-h); color: var(--muted); background: var(--soft); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; }
td { font-size: .88rem; }
#inventory-rows td { height: var(--row-h-evidence); padding-top: 0; padding-bottom: 0; }
tbody tr:hover { background: var(--selected); }
tbody tr:last-child td { border-bottom: 0; }
tbody tr { border-left: var(--edge-w) solid var(--edge-structure); }
tbody tr.control-clear { border-left-color: var(--emerald); }
tbody tr.control-attention { border-left-color: var(--amber); }
tbody tr.control-locked { border-left-color: var(--amber); }
#sales-rows tr.sale-deep-link { background: var(--selected); outline: 2px solid var(--emerald); outline-offset: -2px; }
.asset-button { padding: 0; border: 0; color: var(--ink); background: transparent; cursor: pointer; font-weight: 760; text-align: left; text-decoration: underline; text-underline-offset: .16rem; }
.asset-id { display: block; margin-top: 0; color: var(--muted); font-family: var(--mono); font-size: 11px; overflow-wrap: anywhere; }
.state-badge { display: inline-block; padding: .18rem .42rem; border-left: var(--edge-w) solid var(--edge-structure); background: var(--raised); font-size: 11px; }
.state-alert { color: var(--amber-body); border-color: var(--amber); background: var(--amber-tint); }
.tier-blocked, .tier-unknown { color: var(--amber-body); border-color: var(--amber); background: var(--amber-tint); }
.tier-single-review, .tier-approval-required { color: var(--amber-body); border-color: var(--amber); background: var(--amber-tint); }
.tier-auto-accept, .tier-batch-accept { color: var(--emerald); border-color: var(--emerald-border); background: var(--emerald-tint); }
.review-note { width: 100%; min-height: 7rem; padding: .65rem .7rem; resize: vertical; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); font: inherit; }
.review-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1rem; }
.review-bulk { display: grid; gap: .5rem; margin: 0 0 1rem; }
.review-bulk input { max-width: 32rem; }
.review-select { margin-right: .5rem; vertical-align: middle; }
.button-danger { border-color: var(--hairline); border-left: var(--edge-w) solid var(--amber); color: var(--amber); background: var(--amber-tint); }
.identity-review { display: grid; gap: .6rem; margin-top: .9rem; }
.identity-successors { border: 1px solid var(--line); border-radius: var(--radius-control); padding: .6rem .8rem; display: grid; gap: .4rem; }
.identity-successor { display: flex; gap: .6rem; align-items: baseline; }
.identity-successor-line { color: var(--quiet); }
.identity-review-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.decision-guidance { padding: .75rem; border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); }
.evidence-list { margin: .3rem 0 0; padding-left: 1.2rem; overflow-wrap: anywhere; }
.evidence-completeness-warning { margin: .45rem 0 0; padding: .55rem .65rem; color: var(--amber-body); border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); font-weight: 700; }
.empty-state { margin: 0; padding: 2.5rem 1rem; text-align: center; color: var(--muted); }
.pagination-actions { display: flex; justify-content: center; padding: 1rem; }
.status-message { min-height: 1.5rem; margin: .7rem 0; color: var(--muted); }
.status-message[data-tone="error"] { color: var(--danger); font-weight: 700; }
.field-error { display: block; margin: .25rem 0 0; color: var(--danger, #b3261e); font-weight: 600; font-size: .85rem; }
input[aria-invalid="true"] { border-color: var(--danger, #b3261e); }
#profit-recon-warning[data-tone="error"] { color: var(--danger); font-weight: 700; text-align: left; padding: 12px 16px; border: 1px solid var(--danger); }

dialog { width: min(42rem, 42vw); height: 100%; max-height: 100%; margin: 0 0 0 auto; padding: 0; border-radius: 0; }
dialog::backdrop { background: var(--ground); }
.dialog-heading { position: sticky; top: 0; display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; background: var(--raised); border-bottom: 1px solid var(--line); }
.detail-shell { padding: 1.2rem; }
.control-band { margin: 0 0 1rem; padding: .8rem 1rem; border-left: var(--edge-w) solid var(--emerald); background: var(--emerald-tint); font-weight: 750; }
.control-band.is-locked { border-left-color: var(--amber); background: var(--amber-tint); color: var(--amber-body); }
.control-band.catalog-band { border-left-color: var(--amber); background: var(--amber-tint); color: var(--amber-body); font-weight: 600; }
.detail-grid { display: grid; grid-template-columns: minmax(9rem, .7fr) minmax(12rem, 1.3fr); margin: 0; padding: 0; }
.detail-grid dt, .detail-grid dd { margin: 0; padding: .55rem 0; border-bottom: 1px solid var(--soft); overflow-wrap: anywhere; }
.detail-grid dt { padding-right: 1rem; color: var(--muted); font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.identifier { font-family: var(--mono); font-size: 11px; }

.login-shell { display: grid; min-height: 100vh; place-items: center; padding: 1rem; background: var(--rail); border-top: 1px solid var(--hairline); }
.login-card { width: min(29rem, 100%); padding: clamp(1.4rem, 5vw, 2.4rem); }
.login-card > p:not(.eyebrow) { color: var(--muted); }
/* The agent consent card (docs/AGENT_ACCESS.md): the access choices read as two plain options, not field labels. */
body[data-page="agent-consent"] fieldset { display: grid; gap: 10px; margin: 14px 0; padding: 10px 12px; border: 1px solid var(--line); }
body[data-page="agent-consent"] fieldset label { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; letter-spacing: 0; text-transform: none; }
body[data-page="agent-consent"] fieldset input[type="radio"], body[data-page="agent-consent"] fieldset input[type="checkbox"] { width: auto; margin: 0; }
body[data-page="agent-consent"] #consent-name { width: 100%; margin: 6px 0 4px; }
.security-note { padding-top: 1rem; border-top: 1px solid var(--line); font-size: 11px; }

.intake-safety-note { margin: 0 0 1rem; padding: .85rem 1rem; border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); }
.open-batches { margin: 0 0 1rem; }
.open-batches-list { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .4rem; }
.open-batch { display: flex; flex-wrap: wrap; gap: .25rem .75rem; align-items: baseline; }
.open-batch-link { font-weight: 600; }
.open-batch-facts { color: var(--muted, inherit); overflow-wrap: anywhere; }
.step-rail { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 0 0 1rem; padding: 0; list-style: none; background: var(--line); border: 1px solid var(--line); }
.step-rail li { display: flex; align-items: center; gap: .55rem; min-height: 3rem; padding: .55rem .8rem; background: var(--soft); color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.step-rail li span { display: grid; width: 1.55rem; height: 1.55rem; place-items: center; border: 1px solid var(--hairline); }
.step-rail li[aria-current="step"] { color: var(--on-emerald); background: var(--accent); }
.step-rail li.is-complete { color: var(--emerald-body); background: var(--emerald-tint); }
.intake-step { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: 1rem; margin-bottom: 1rem; padding: clamp(1rem, 3vw, 1.5rem); background: var(--paper); border: 1px solid var(--line); }
.intake-step h3 { margin: 0; font-family: var(--sans); font-size: 1.15rem; }
.intake-step h3 + p { margin-top: .35rem; color: var(--muted); }
.step-number { padding-top: .1rem; color: var(--amber); font-family: var(--mono); font-weight: 800; }
.intake-step fieldset { min-width: 0; margin: 0 0 .8rem; padding: .85rem; border: 1px solid var(--line); }
.intake-step legend { padding: 0 .4rem; font-family: var(--sans); font-weight: 750; }
.mapping-grid { display: grid; grid-template-columns: repeat(2, minmax(13rem, 1fr)); gap: .7rem 1rem; }
.mapping-field { display: grid; grid-template-columns: minmax(8rem, .8fr) minmax(9rem, 1.2fr); align-items: center; gap: .6rem; }
.mapping-field label { overflow-wrap: anywhere; }
.required-mark { color: var(--danger); }
.field-grid, .conditional-terms { display: grid; grid-template-columns: repeat(2, minmax(12rem, 1fr)); gap: .7rem 1rem; }
.conditional-terms { margin-top: .7rem; padding-top: .7rem; border-top: 1px solid var(--soft); }
.field-wide { grid-column: 1 / -1; }
.inline-summary { margin: .75rem 0 0; padding: .65rem .75rem; border-left: var(--edge-w) solid var(--edge-structure); background: var(--soft); }
.preview-messages { display: grid; gap: .45rem; margin-bottom: .75rem; }
.preview-message { margin: 0; padding: .55rem .65rem; border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); }
.intake-preview-table { min-width: 42rem; }
.commit-result { margin-top: .8rem; padding: .8rem; border-left: var(--edge-w) solid var(--emerald); background: var(--emerald-tint); }
.commit-result[data-tone="uncertain"] { border-left-color: var(--amber); background: var(--amber-tint); }
.batch-workspace { margin-top: 1rem; padding: clamp(1rem, 3vw, 1.5rem); background: var(--paper); border: 1px solid var(--line); }
.batch-workspace .detail-grid { margin-bottom: 1rem; }
.batch-counts { display: flex; flex-wrap: wrap; gap: .5rem; margin: .8rem 0; }
.batch-counts .state-badge { font-weight: 750; }
.batch-table { min-width: 60rem; }
.technical-details { margin-top: .35rem; font-size: .85em; }
.technical-details summary { cursor: pointer; }
.technical-details p { margin: .2rem 0; overflow-wrap: anywhere; font-family: var(--mono); }
.batch-row-card-link { display: inline-block; margin-right: .65rem; }
.batch-confirmation { margin: 1rem 0; padding: 1rem; border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); }
.batch-confirmation h3 { margin-top: 0; }
.batch-selection { width: 1.2rem; min-height: 1.2rem; }
.batch-workspace[data-stale="true"] { border-left: var(--edge-w) solid var(--amber); }

.numeric, .money, time, input[type="number"], input[type="month"], input[type="date"], input[type="datetime-local"] { font-family: var(--mono); font-variant-numeric: tabular-nums; }
/* A single money-date field on a form (Sold on, Paid on) is a Sicari field like any other: the browser's calendar icon is quiet. */
input[type="date"]::-webkit-calendar-picker-indicator { opacity: .5; cursor: pointer; }
input[type="date"]:hover::-webkit-calendar-picker-indicator, input[type="date"]:focus::-webkit-calendar-picker-indicator { opacity: .85; }
.money { text-align: right; }
.relationship-panel { border-left: var(--edge-w) solid var(--purple); }
.relationship-panel h3 { color: var(--purple); }
.detail-shell h3 { margin: 0 0 8px; font-size: 13px; font-weight: 600; }
.detail-shell + .detail-shell { border-top: 1px solid var(--hairline); }
.custody-history { margin: 8px 0 0; padding-left: 18px; color: var(--ink-2); }
.custody-history li { padding: 4px 0; }
.state-badge { border-radius: var(--radius-chip); }
.valuation-clean { color: var(--emerald-body); border-left: var(--edge-w) solid var(--emerald); background: var(--emerald-tint); }
.valuation-needs_review, .valuation-rejected { color: var(--amber-body); border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); }

#agreements-panel { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; align-items: start; max-width: 72rem; }
#agreements-panel > .section-heading { grid-column: 1 / -1; }
#agreement-detail { margin-top: 0; padding: 1rem; border-color: var(--purple-border); border-top: 0; }
#agreements-panel > .table-frame { border-color: var(--purple-border); }
#agreement-detail .detail-shell { padding: .5rem 0; }
#agreement-detail .detail-grid { grid-template-columns: 120px minmax(0, 1fr); }
#agreement-detail meter { display: block; width: 100%; height: 8px; accent-color: var(--purple); }
#agreement-detail meter::-webkit-meter-bar { background: var(--well); border: 1px solid var(--hairline); border-radius: var(--radius-chip); }
#agreement-detail meter::-webkit-meter-optimum-value { background: var(--purple); }
.offer-evaluation { padding: 1rem 0; border-bottom: 1px solid var(--hairline); }
.offer-evaluation h4 { margin: 0 0 .5rem; font-size: 13px; }
.offer-trace { margin: .75rem 0; }
.offer-trace th, .offer-trace td { overflow-wrap: anywhere; }
.offer-trace table { table-layout: fixed; }
.offer-trace .identifier { font-size: 10px; }
.evaluation-trace { margin: .75rem 0; padding: .65rem; background: var(--ground); border: 1px solid var(--hairline); }
.evaluation-trace h4 { color: var(--muted); font-size: 11px; }
.evaluation-condition { display: grid; grid-template-columns: minmax(6rem, .7fr) minmax(0, 2fr) auto; gap: .65rem; padding: .25rem 0; font-family: var(--mono); font-size: 11px; overflow-wrap: anywhere; }
.trace-condition { color: var(--muted); }
.trace-pass { color: var(--emerald); }
.trace-refused { color: var(--amber); }
.agreement-trace summary, .raw-trace summary { cursor: pointer; min-height: var(--control-h); padding: .4rem 0; color: var(--ink-2); }
.raw-trace summary { color: var(--muted); font-size: 11px; }
#buyer-release-form { padding-top: 1rem; }
#buyer-release-message[data-tone="error"] { color: var(--amber-body); }

@media (max-width: 68rem) {
  #agreements-panel { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 48rem) {
  .button, .icon-button, input, select { min-height: 2.75rem; min-height: var(--tap); }
  .icon-button { min-width: var(--tap); }
  .section-heading { align-items: flex-start; }
  .context-label { text-align: left; }
  .control-panel { grid-template-columns: 1fr; gap: .8rem; }
  .inventory-filters { grid-template-columns: 1fr; }
  .inventory-filters .filter-search, .filter-actions { grid-column: auto; }
  .step-rail { grid-template-columns: repeat(2, 1fr); }
  .intake-step { grid-template-columns: 1fr; }
  .mapping-grid, .field-grid, .conditional-terms { grid-template-columns: 1fr; }
  .mapping-field { grid-template-columns: 1fr; gap: .25rem; }
  .field-wide { grid-column: auto; }
  .table-frame { overflow: visible; border: 0; background: transparent; }
  table, tbody, tfoot { display: block; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  tbody { display: grid; gap: .8rem; }
  tbody tr { display: block; padding: .35rem .8rem; background: var(--paper); border: 1px solid var(--line); }
  tbody tr.control-clear { border-left: var(--edge-w) solid var(--emerald); }
  tbody tr.control-attention { border-left: var(--edge-w) solid var(--amber); }
  tbody tr.control-locked { border-left: var(--edge-w) solid var(--amber); }
  #inventory-rows td { height: auto; padding: .55rem 0; }
  tbody td { display: grid; grid-template-columns: minmax(6.5rem, .7fr) 1.3fr; gap: .65rem; padding: .55rem 0; }
  /* A phone card grows with what is in it: a cell's height is a minimum for a desk row, never a fixed box. */
  .app-shell tbody td, .app-shell tfoot td, tbody td, tfoot td { height: auto; min-height: 0; align-content: start; }
  /* A row whose cells carry no heading (a plain label and figure) reads as one line: label left, figure right. */
  tbody tr:not(:has(> td[data-label])):has(> td + td), tfoot tr:not(:has(> td[data-label])):has(> td + td) { display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; }
  tbody tr:not(:has(> td[data-label])) > td, tfoot tr:not(:has(> td[data-label])) > td { display: block; padding: .55rem 0; }
  tbody td:not([data-label])::before, tfoot td:not([data-label])::before { content: none; }
  /* In a labelled cell the label sits in the first column and everything the cell holds stacks in the second. */
  tbody td[data-label] > *, tfoot td[data-label] > * { grid-column: 2; min-width: 0; }
  tbody td[data-label]::before, tfoot td[data-label]::before { grid-column: 1; grid-row: 1; }
  tbody td::before { content: attr(data-label); color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
  tfoot tr { display: block; margin-top: .8rem; padding: .35rem .8rem; background: var(--paper); border: 1px solid var(--line); }
  tfoot td { display: grid; grid-template-columns: minmax(6.5rem, .7fr) 1.3fr; gap: .65rem; padding: .55rem 0; }
  tfoot td:empty { display: none; }
  tbody td::before, tfoot td::before { text-align: left; font-family: var(--sans); }
  tfoot td::before { content: attr(data-label); color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
  .detail-grid { grid-template-columns: 1fr; }
  dialog { width: 100%; height: 100%; max-height: 100%; }
  .detail-grid dt { padding-bottom: .1rem; border-bottom: 0; }
  .detail-grid dd { padding-top: .1rem; }
}

/* Desktop Vault: the table and desk scroll independently; actions stay in view. */
body[data-page="inventory"] #inventory-panel { display: flex; flex-direction: column; min-height: 0; flex: 1; }
body[data-page="inventory"] .section-heading { align-items: center; margin-bottom: 8px; }
body[data-page="inventory"] .section-heading > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
body[data-page="inventory"] .section-heading .eyebrow { display: none; }
.vault-counts { margin: 0; font-family: var(--mono); font-size: 11px; color: var(--quiet); }
.col-version { display: none; } /* a purchase's revision counter is plumbing; the desk still shows it */
.vault-keyboard { margin: 6px 0; color: var(--quiet); font-size: 11px; }
.vault-filters summary { cursor: pointer; font-size: 12px; color: var(--ink-2); min-height: var(--control-h); }
.vault-filters .inventory-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 4px 0; padding: 8px; }
.vault-table-frame { flex: 1; min-height: 0; overflow: auto; }
.vault-table-frame table { table-layout: fixed; }
.vault-table-frame caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.vault-table-frame th:first-child { width: 36px; }
body[data-page="inventory"] #inventory-rows input[type="checkbox"] { width: 16px; height: 16px; }
.vault-table-frame th:nth-child(2) { width: 22%; }
.vault-table-frame th:nth-child(3) { width: 8%; }
.vault-table-frame th:nth-child(4) { width: 9%; }
.vault-table-frame th:nth-child(5) { width: 9%; }
.vault-table-frame th:nth-child(6) { width: 9%; }
.vault-table-frame th:nth-child(10) { width: 12%; }
.vault-table-frame th:nth-child(7), .vault-table-frame th:nth-child(8), .vault-table-frame th:nth-child(9) { width: 9%; }
.vault-table-frame th { position: sticky; top: 0; z-index: 1; background: var(--surface); height: 26px; padding: 0 8px; }
body[data-page="inventory"] #inventory-rows td, body[data-page="inventory"] #onway-rows td { height: var(--row-h-evidence); padding: 0 8px; border-bottom: 1px solid var(--divider); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body[data-page="inventory"] #inventory-rows td:nth-child(2), body[data-page="inventory"] #onway-rows td:nth-child(2) { white-space: normal; line-height: 1.25; }
body[data-page="inventory"] #inventory-rows td:last-child, body[data-page="inventory"] #onway-rows td:last-child { white-space: normal; }
/* A card on the way: a quiet row at the top of the table, with its own Arrived. */
body[data-page="inventory"] #onway-rows td { background: var(--surface); }
body[data-page="inventory"] #onway-rows .onway-actions { margin: 4px 0; }
body[data-page="inventory"] #onway-rows .onway-arrived { min-height: 28px; padding: 0 10px; }
body[data-page="inventory"] #inventory-rows td.money-cell { white-space: nowrap; overflow: visible; }
body[data-page="inventory"] #inventory-rows td.mono-cell, body[data-page="inventory"] #onway-rows td.mono-cell { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body[data-page="inventory"] #inventory-rows td.col-owner, body[data-page="inventory"] #inventory-rows td:nth-child(6), body[data-page="inventory"] #onway-rows td.col-owner, body[data-page="inventory"] #onway-rows td:nth-child(6) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 1599px) { body:has(.context-desk:not([hidden])) .col-owner { display: none; } }
body[data-page="inventory"] #inventory-rows td.mono-cell { font: 11px var(--mono); color: var(--ink-2); }
@media (max-width: 1599px) { .col-floor { display: none; } }
/* With Floor hidden the percentages must still add up to the table, or the spare width lands in the checkbox column. */
@media (max-width: 1599px) { .vault-table-frame th:nth-child(2) { width: 30%; } .vault-table-frame th:nth-child(10) { width: 15%; } }
/* The latest comp is reference only; one that sold more than 30 days ago is marked so the dealer knows to refresh it. */
body[data-page="inventory"] #inventory-rows td.col-comp[data-stale="true"] { color: var(--amber-body); }
/* Cost basis is for members who manage sales and money; the server sends no basis to anyone else. */
body:not([data-can-manage-sales="true"]) .col-basis { display: none; }
body[data-page="inventory"] #inventory-rows tr { cursor: pointer; }
body[data-page="inventory"] #inventory-rows tr[data-selected="true"] { background: var(--selected); }
body[data-page="inventory"] #inventory-rows tr[data-selected="true"] .asset-button { color: var(--ink); font-weight: 600; }
body[data-page="inventory"] #inventory-rows tr[data-selected="true"] td:first-child { border-left: var(--edge-w) solid var(--emerald); }
body[data-page="inventory"] #inventory-rows tr:focus-within { outline: var(--focus-ring); outline-offset: -2px; }
body[data-page="inventory"] .asset-button { font-weight: 500; text-decoration: none; font-size: 12px; padding: 0; min-height: 26px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
body[data-page="inventory"] .view-chips { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; min-height: 28px; margin: 0 0 8px; }
/* The notice that cards need a match keeps its line whether or not it is showing, so it arriving moves nothing. */
#match-notice[hidden] { display: block !important; visibility: hidden; min-height: 18px; }
/* A header action that exists only once its data has loaded keeps its place, unseen, until then. */
.page-actions [data-late-action][hidden] { display: inline-flex !important; visibility: hidden; }
@media (max-width: 899px) { body[data-page="inventory"] .view-chips { min-height: 96px; } }
.view-chip { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 10px; color: var(--ink-2); background: var(--surface); border: 1px solid var(--hairline); border-radius: 4px; font-size: 12.5px; cursor: pointer; }
.view-chip[aria-pressed="true"] { color: var(--emerald); background: var(--emerald-tint); border-color: var(--emerald-border); }
.view-chip-count { color: var(--muted); font: 500 11.5px var(--mono); }
.view-chip[aria-pressed="true"] .view-chip-count { color: var(--emerald); }
body[data-page="inventory"] .asset-button { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; max-width: 100%; white-space: normal; overflow: hidden; text-align: left; line-height: 1.25; }
body[data-page="inventory"] .vault-owner-interest { color: var(--quiet); }
body[data-page="inventory"] .vault-owner-consigned { color: var(--purple); }
body[data-page="inventory"] .pagination-actions { margin: 6px 0 0; }
body[data-page="inventory"] .status-message { margin: 4px 0 0; font-size: 11px; }
.context-desk { grid-column: 3; grid-row: 2; min-height: 0; min-width: 0; display: flex; flex-direction: column; background: var(--surface); border-left: 1px solid var(--hairline); }
.desk-heading { display: flex; align-items: center; justify-content: space-between; flex: none; min-height: 34px; padding: 0 12px; border-bottom: 1px solid var(--hairline); font-size: 12px; }
.desk-scroll { min-height: 0; overflow: auto; flex: 1; }
.desk-identity { padding: 12px; }
#asset-dialog .desk-identity { position: relative; }
#asset-dialog #dialog-close-button { position: absolute; top: 6px; right: 8px; }
#asset-dialog #asset-dialog-title { padding-right: 44px; } /* a long card name wraps before the close button, not under it */
#asset-dialog .dfoot .desk-actions { padding: 0; border: 0; background: none; position: static; }
.desk-identity h2 { font-size: 14px; line-height: 1.4; }
.context-desk .detail-shell { margin: 0; padding: 8px 12px; border-bottom: 1px solid var(--divider); overflow-wrap: anywhere; }
.context-desk .desk-identity .detail-shell { padding: 8px 0 0; border: 0; }
.context-desk h3 { font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 8px; color: var(--quiet); }
.context-desk h4 { margin: 8px 0 4px; font-size: 12px; }
.context-desk p { font-size: 12px; margin: 4px 0; }
.context-desk .detail-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); margin: 0; }
.context-desk .detail-grid dt, .context-desk .detail-grid dd { padding: 2px 0; font-size: 11px; }
.context-desk .detail-grid dd { text-align: right; }
.context-desk .detail-shell:empty { display: none; }
.demo-slab-photo { margin: 0 0 10px; max-width: 210px; }
.demo-slab-photo img { display: block; width: 100%; height: auto; border: 1px solid var(--hairline); border-radius: 3px; }
.demo-slab-photo figcaption { margin-top: 5px; color: var(--quiet); font-size: 10px; }
.vault-slab-thumbnail { display: inline-block; width: 28px; height: 42px; object-fit: contain; margin-left: 8px; vertical-align: middle; }
.context-desk .control-band { margin: 0; padding: 8px; font-size: 11px; }
.context-desk .table-frame { overflow: auto; }
.context-desk table { min-width: 0; width: 100%; font-size: 11px; }
.context-desk .basis-part { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 26px; padding: 3px 8px; margin-bottom: 3px; border-left: var(--edge-w) solid var(--emerald); background: var(--raised); font-size: 12px; }
.context-desk summary { cursor: pointer; font-size: 11px; color: var(--quiet); }
.context-desk th, .context-desk td { padding: 4px 6px; }
.context-desk #asset-valuations table { table-layout: auto; width: 100%; }
.context-desk #asset-valuations th, .context-desk #asset-valuations td { white-space: normal; overflow-wrap: anywhere; }
.context-desk .offer-trace table { min-width: 0; }
.context-desk .offer-evaluation { padding: 6px 8px; margin: 6px 0; }
.context-desk .evaluation-condition { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) auto; gap: 4px; }
.desk-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px; border-top: 1px solid var(--hairline); background: var(--rail); flex: none; }
.dfoot > .desk-actions { flex: 1 1 0; min-width: 0; } /* wrap inside the desk instead of running past its edge */
@media (max-width: 899px) {
  .vault-table-frame { overflow: auto; }
  .vault-table-frame table { display: table; min-width: 800px; } /* scrolls sideways rather than squeezing Status and Where into slivers */
  .vault-table-frame thead { position: static; width: auto; height: auto; clip-path: none; }
  .vault-table-frame th:last-child { width: 150px; }
  .vault-table-frame tbody { display: table-row-group; }
  .vault-table-frame tbody tr { display: table-row; padding: 0; }
  .vault-table-frame tbody td { display: table-cell; }
  .vault-table-frame tbody td.col-floor { display: none; } /* its heading is hidden below 1600px; the cell must go with it */
  .vault-table-frame tbody td::before { display: none; }
  .context-desk { border-top: 1px solid var(--hairline); }
  .desk-scroll { overflow: visible; }
  .desk-actions { position: sticky; bottom: 0; }
  .kbd-hint { display: none; }
  .vault-filters .inventory-filters { grid-template-columns: 1fr; }
}

/* Shared desktop instrument shell. Desktop dimensions come from Foundations. */
@media (min-width: 900px) {
  .app-shell .section-heading { align-items: center; margin: 0 0 8px; }
  .app-shell .section-heading h2 { font-size: 14px; }
  .app-shell .section-heading .eyebrow { font-size: 10px; letter-spacing: .07em; font-weight: 500; }
  .app-shell .review-actions { margin-top: 0; gap: 6px; }
  .app-shell .intake-safety-note { padding: 7px 10px; margin: 0 0 8px; font-size: 11px; font-weight: 400; color: var(--amber-body); }
  .app-shell .inventory-filters { padding: 8px; gap: 8px; margin: 0 0 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .app-shell #payouts-panel .workspace-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
  .app-shell #payouts-panel .workspace-grid > .control-panel { display: block; min-width: 0; margin: 0; }
  .app-shell #payouts-panel .workspace-grid .inventory-filters { display: grid; grid-template-columns: minmax(0, 1fr); }
  .app-shell .button { font-size: 11px; font-weight: 500; }
  .app-shell .table-frame { min-width: 0; border: 1px solid var(--hairline); overflow: auto; }
  .app-shell th { position: sticky; top: 0; z-index: 1; height: 28px; padding: 0 8px; background: var(--surface); font: 10px var(--mono); letter-spacing: .07em; }
  .app-shell td { height: var(--row-h); padding: 0 8px; font-size: 12px; }
  .app-shell .asset-button { min-height: 26px; font-size: 12px; font-weight: 500; text-decoration: none; }
  .app-shell :is(.table-link, .link-button) { min-height: 26px; padding: 0; border: 0; background: transparent; color: var(--ink); font: 12px var(--sans); text-align: left; cursor: pointer; }
  .app-shell #purchase-rows .muted, .app-shell #invoice-rows .muted, .app-shell #review-rows .asset-id { display: none; }
  .app-shell #purchase-rows td, .app-shell #invoice-rows td { white-space: nowrap; }
  .app-shell #purchase-rows td:first-child { white-space: normal; overflow-wrap: anywhere; }
  .app-shell #purchase-rows td:first-child .id-secondary { font-size: 11px; }
  .app-shell .review-table { table-layout: fixed; }
  .app-shell .review-table th:first-child { width: 32%; }
  .app-shell .review-table th:nth-child(2) { width: 14%; }
  .app-shell .review-table th:nth-child(3) { width: 24%; }
  .app-shell .review-table th:nth-child(4) { width: 18%; }
  .app-shell .review-table th:nth-child(5) { width: 12%; }
  .app-shell #review-rows td { height: auto; padding-block: 6px; white-space: normal; overflow-wrap: anywhere; vertical-align: top; }
  .app-shell #review-rows .asset-button { display: block; max-width: 100%; height: auto; text-align: left; white-space: normal; overflow-wrap: anywhere; }
  .app-shell #review-rows td:nth-child(4) { font-family: var(--mono); font-size: 11px; }
  .app-shell .pagination-actions { margin: 0; padding: 8px; justify-content: flex-start; }
  .app-shell .status-message { margin: 6px 0 0; padding: 0; font-size: 11px; }
  .app-shell .desktop-workspace { display: grid; --outline-display: grid; grid-template-columns: minmax(0, 1fr); flex: 1; min-width: 0; min-height: 0; max-width: none; gap: 0; align-items: stretch; }
  .app-shell #agreements-panel { grid-template-columns: minmax(0, 1fr); max-width: none; align-items: stretch; }
  .app-shell #agreements-panel:has(> .record-desk:not([hidden])) { grid-template-columns: minmax(0, 1fr) calc(var(--desk-width) - 12px); }
  .app-shell .desktop-workspace:has(> aside.record-desk:not([hidden]), > dialog.record-desk[open]) { grid-template-columns: minmax(0, 1fr) calc(var(--desk-width) - 12px); }
  .app-shell .workspace-main { min-width: 0; min-height: 0; overflow: auto; }
  .app-shell .desktop-workspace:has(> aside.record-desk:not([hidden]), > dialog.record-desk[open]) > .workspace-main { padding-right: 12px; }
  .app-shell .record-desk { display: flex; flex-direction: column; min-width: 0; min-height: 0; margin: -12px -12px -12px 0; padding: 0; background: var(--surface); border: 0; border-left: 1px solid var(--hairline); overflow: hidden; }
  .app-shell dialog.record-desk:not([open]) { display: none; }
  .app-shell dialog.record-desk[open] { position: static; width: auto; height: auto; max-width: none; max-height: none; }
  .app-shell #agreement-detail { margin: -12px -12px -12px 0; padding: 0; border: 0; border-left: 1px solid var(--hairline); }
  .app-shell #agreement-detail .detail-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); }
  .app-shell .desk-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 38px; padding: 5px 12px; border-bottom: 1px solid var(--hairline); flex: none; }
  .app-shell .desk-header h2 { font-size: 13px; }
  .app-shell .desk-header .eyebrow { font: 10px var(--mono); }
  .app-shell .desk-header > .button { width: var(--dismiss); min-height: var(--dismiss); padding: 0; font-size: 18px; }
  .app-shell .desk-scroll { flex: 1; overflow: auto; min-height: 0; }
  .app-shell .desk-section { margin: 0; padding: 10px 12px; border-bottom: 1px solid var(--divider); overflow-wrap: anywhere; }
  .app-shell .record-desk h3 { margin: 0 0 8px; color: var(--quiet); font: 10px var(--mono); letter-spacing: .07em; text-transform: uppercase; }
  .app-shell .record-desk p { margin: 4px 0; font-size: 12px; }
  .app-shell .record-desk .detail-shell { margin: 0; padding: 8px 12px; }
  .app-shell .record-desk .detail-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); margin: 0; }
  .app-shell .record-desk .detail-grid > div { display: contents; }
  .app-shell .record-desk .detail-grid dt, .app-shell .record-desk .detail-grid dd { padding: 3px 0; font-size: 11px; }
  .app-shell .record-desk .detail-grid dd { text-align: right; }
  .app-shell .record-desk .review-actions { padding: 8px 12px; }
  .app-shell .desk-actions { padding: 8px 12px; gap: 6px; }
  .app-shell .workspace-hint { margin: 4px 0 8px; color: var(--quiet); font-size: 11px; }
  .app-shell .money-cell { text-align: right; white-space: nowrap; font-family: var(--mono); font-variant-numeric: tabular-nums; }
  .app-shell #sales-rows .sales-row-detail { display: none; }
  .app-shell #sales-rows td { white-space: nowrap; }
  .app-shell .state-badge[data-tone="clear"] { color: var(--emerald-body); border-left-color: var(--emerald); background: var(--emerald-tint); }
  .app-shell .state-badge[data-tone="attention"], .app-shell .state-pending { color: var(--amber-body); border-left-color: var(--amber); background: var(--amber-tint); }
  .app-shell .desk-outcome { padding: 8px 12px; color: var(--amber-body); border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); font-size: 12px; }
  .app-shell .desk-outcome[data-outcome="uncertain"] { border-bottom: 1px dashed var(--amber-border); background: var(--uncertain-tint); }
  .app-shell .desk-outcome[data-outcome="committed"] { color: var(--emerald-body); border-left-color: var(--emerald); background: var(--emerald-tint); }
  .app-shell .step-rail { margin-bottom: 8px; }
  .app-shell .step-rail li { min-height: 28px; padding: 4px 8px; font-size: 10px; font-weight: 500; }
  .app-shell .step-rail li span { width: 18px; height: 18px; font-family: var(--mono); }
  .app-shell .intake-step { grid-template-columns: 28px minmax(0, 1fr); padding: 10px 12px; gap: 8px; margin-bottom: 8px; }
  .app-shell .intake-step h3 { font-size: 13px; }
  .app-shell .batch-workspace { margin-top: 8px; padding: 10px 12px; }
  .app-shell .batch-workspace .detail-grid { grid-template-columns: minmax(0, .5fr) minmax(0, 1.5fr); }
  .app-shell .state-badge { padding: 1px 5px; font: 10px var(--mono); letter-spacing: .03em; white-space: nowrap; }
  .app-shell .instrument-chip { display: inline-block; padding: 1px 5px; border-left: var(--edge-w) solid var(--edge-structure); border-radius: var(--radius-chip); color: var(--quiet); background: var(--raised); font: 10px var(--mono); white-space: nowrap; }
  .app-shell .chip-clear { color: var(--emerald-body); background: var(--emerald-tint); border-left-color: var(--emerald); }
  .app-shell .chip-pending { color: var(--amber-body); background: var(--amber-tint); border-left-color: var(--amber); }
  .app-shell .mono-value { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 11px; }
  .app-shell .relationship-value { color: var(--purple-body); }
  .app-shell tbody tr.is-selected, .app-shell tbody tr[data-selected="true"] { background: var(--selected); border-left-color: var(--emerald); }
  .app-shell tbody tr:focus-within { outline: var(--focus-ring); outline-offset: -2px; }
  .app-shell tbody tr[data-checked="true"] { background: var(--divider); border-left-color: var(--emerald-border); }
  .app-shell tbody tr[data-state="uncertain"] { color: var(--amber-body-2); background: var(--uncertain-tint); border-bottom: 1px dashed var(--amber-border); }
  .app-shell tbody tr[data-state="committed"] { color: var(--emerald-body); background: var(--emerald-tint); }
  .app-shell tbody tr[aria-disabled="true"] { color: var(--muted); }
  .app-shell .empty-state { padding: 28px 16px; color: var(--quiet); text-align: left; border-left: var(--edge-w) solid var(--edge-structure); background: var(--surface); font-size: 12px; }
  .app-shell .system-skeleton { padding: 12px; border: 1px solid var(--hairline); background: var(--surface); }
  .app-shell .system-skeleton-label { margin: 0 0 12px; color: var(--quiet); font: 11px var(--mono); }
  .app-shell .system-skeleton-line { display: block; height: 12px; margin-bottom: 16px; width: 82%; border-radius: var(--radius-chip); background: var(--raised); }
  .app-shell .system-skeleton-line:nth-child(3) { width: 64%; }
  .app-shell .system-skeleton-line:nth-child(4) { width: 74%; }
  .app-shell .system-skeleton-line:last-child { width: 56%; margin-bottom: 0; }
  .app-shell .status-message[data-system-state="error"], .app-shell .status-message[data-system-state="offline"] { padding: 8px 10px; border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--amber); background: var(--amber-tint); color: var(--amber-body); font-weight: 400; }
  .app-shell > .record-desk .dialog-heading { padding: 6px 12px; }
  body[data-page="login"] .login-shell { background: var(--ground); border: 0; }
  body[data-page="login"] .login-card { width: 392px; padding: 24px; border-left: var(--edge-w) solid var(--emerald); }
  .login-brand { display: flex; align-items: center; gap: 8px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--hairline); font-size: 14px; font-weight: 600; }
  .login-mark { display: grid; place-items: center; width: 26px; height: 26px; border-radius: var(--radius-control); background: var(--emerald); color: var(--on-emerald); font: 18px var(--mono); }
  .login-access { margin-left: auto; color: var(--quiet); font: 10px var(--mono); letter-spacing: .05em; text-transform: uppercase; }
  body[data-page="login"] .eyebrow { font: 10px var(--mono); margin-bottom: 8px; }
  body[data-page="login"] h1 { font-size: 20px; line-height: 1.35; }
  body[data-page="login"] .login-intro { color: var(--quiet); font-size: 12px; line-height: 1.6; margin: 12px 0 16px; }
  body[data-page="login"] .button-wide { min-height: 32px; font-size: 12px; font-weight: 500; }
  body[data-page="login"] .security-note { margin-bottom: 0; color: var(--quiet); line-height: 1.6; }
  body[data-page="login"] #login-status { padding: 10px; border-left: var(--edge-w) solid var(--amber); color: var(--amber-body); background: var(--amber-tint); font-size: 12px; }
}
.command-search-dialog { width: min(620px, calc(100vw - 32px)); max-height: 70vh; padding: 16px; border: 1px solid var(--hairline); border-radius: var(--radius-control); background: var(--surface); color: var(--ink); }
.command-search-dialog::backdrop { background: #0009; }
.command-search-dialog input { width: 100%; margin-bottom: 12px; }
.command-search-dialog [role="status"] { display: grid; gap: 4px; max-height: 50vh; overflow: auto; color: var(--quiet); font: 12px var(--mono); }
.command-search-dialog [role="status"] strong { padding: 8px 8px 2px; color: var(--quiet); font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .06em; }
.command-search-dialog a { display: block; padding: 8px; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--divider); }
.command-search-dialog a:hover, .command-search-dialog a:focus { background: var(--selected); }
.technical-details { margin: 6px 0; }
.technical-details summary { cursor: pointer; color: var(--muted); font-size: 12px; }
.command-search-dialog .search-detail { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }
#inventory-bulk-show-dialog form { display: grid; gap: 8px; }
#inventory-bulk-show-dialog input[type="checkbox"] { width: auto; margin: 0 6px 0 0; }
#inventory-bulk-show-results { margin: 8px 0 0; padding-left: 20px; max-height: 220px; overflow: auto; }
.cash-position-dialog form, .cash-position-dialog label { display: grid; gap: 6px; }
.cash-position-dialog form { margin: 12px 0; gap: 12px; }
.cash-position-dialog p { color: var(--quiet); line-height: 1.5; }
.cash-position-dialog input[type="checkbox"] { width: auto; margin: 0; }

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

.act-as-banner { position: fixed; inset: 0 0 auto 0; z-index: 60; display: flex; align-items: center; gap: 12px; min-height: 36px; padding: 4px 12px; box-sizing: border-box; color: #1b1300; background: #f5b83d; border-bottom: 1px solid #b07d12; font: 600 13px/1.3 system-ui, sans-serif; }
.act-as-banner[hidden] { display: none; }
.act-as-text { flex: 1; min-width: 0; margin: 0; }
.act-as-stop { flex: none; min-height: 28px; padding: 0 12px; color: #fff; background: #1b1300; border: 0; border-radius: 4px; font: 600 12px system-ui, sans-serif; cursor: pointer; }
.act-as-stop:disabled { opacity: .6; cursor: progress; }
body[data-acting] { padding-top: 36px; box-sizing: border-box; }
body[data-acting] .app-shell { height: calc(100dvh - 36px); }
@media (max-width: 600px) { .act-as-banner { min-height: 52px; } body[data-acting] { padding-top: 52px; } body[data-acting] .app-shell { height: calc(100dvh - 52px); } }

@view-transition { navigation: auto; }
html:active-view-transition .app-nav { view-transition-name: sicari-rail; }
html:active-view-transition .app-strip { view-transition-name: sicari-strip; }
html:active-view-transition .jm-tabs { view-transition-name: sicari-tabs; }
html:active-view-transition #act-as-banner { view-transition-name: sicari-banner; }
html:active-view-transition .page-header { view-transition-name: sicari-header; }
html:active-view-transition .app-body { view-transition-name: sicari-page; }
html:active-view-transition .bw-nav { view-transition-name: sicari-rail; }
html:active-view-transition .bw-header { view-transition-name: sicari-header; }
html:active-view-transition .bw-main { view-transition-name: sicari-page; }
html:active-view-transition .sp-top { view-transition-name: sicari-strip; }
html:active-view-transition .sp-tabs { view-transition-name: sicari-tabs; }
html:active-view-transition .sp-body { view-transition-name: sicari-page; }
::view-transition-group(root), ::view-transition-group(sicari-rail), ::view-transition-group(sicari-strip), ::view-transition-group(sicari-tabs), ::view-transition-group(sicari-banner), ::view-transition-group(sicari-header) { animation: none; }
::view-transition-old(root), ::view-transition-old(sicari-rail), ::view-transition-old(sicari-strip), ::view-transition-old(sicari-tabs), ::view-transition-old(sicari-banner), ::view-transition-old(sicari-header) { display: none; }
::view-transition-new(root), ::view-transition-new(sicari-rail), ::view-transition-new(sicari-strip), ::view-transition-new(sicari-tabs), ::view-transition-new(sicari-banner), ::view-transition-new(sicari-header) { animation: none; }
::view-transition-group(sicari-page) { animation: none; }
::view-transition-old(sicari-page) { animation: 140ms ease-out both sicari-page-out; }
::view-transition-new(sicari-page) { animation: 140ms ease-out both sicari-page-in; }
@keyframes sicari-page-out { to { opacity: 0; } }
@keyframes sicari-page-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; } ::view-transition-old(*) { display: none; } }

.business-picker[data-picker="list"] label[for="membership-select"], .business-picker[data-picker="list"] #membership-select { display: none; }
.business-picker[data-picker="list"]:not([data-step="deployment"]) #deployment-field, .business-picker[data-picker="list"]:not([data-step="deployment"]) #context-submit-button { display: none; }
.picker-list { display: grid; gap: 4px; margin: 0 0 8px; padding: 0; list-style: none; }
.picker-business { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 6px 10px; color: var(--ink); background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-control); font: inherit; text-align: left; cursor: pointer; }
.picker-business:hover { background: var(--raised); border-color: var(--edge-structure); }
.picker-business:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }
.picker-text { display: grid; gap: 2px; min-width: 0; flex: 1; }
.picker-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.picker-role { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker-role { color: var(--muted); font-size: 12px; }
.picker-business[aria-current="true"] { border-color: var(--emerald-border); }

:root { --glyph-down: url("/assets/shell-icons/chevron-down.svg"); --glyph-up: url("/assets/shell-icons/chevron-up.svg"); --glyph-person: url("/assets/shell-icons/person.svg"); --glyph-search: url("/assets/shell-icons/search.svg"); --glyph-check: url("/assets/shell-icons/check.svg"); --glyph-chev: url("/assets/shell-icons/chev.svg"); --glyph-back: url("/assets/shell-icons/back.svg"); --glyph-file: url("/assets/shell-icons/file.svg"); }
.nav-icon[data-icon="money"], .jm-icon[data-icon="money"] { --glyph: url("/assets/shell-icons/money.svg"); }
.nav-icon[data-icon="today"], .jm-icon[data-icon="today"] { --glyph: url("/assets/shell-icons/today.svg"); }
.nav-icon[data-icon="inventory"], .jm-icon[data-icon="inventory"] { --glyph: url("/assets/shell-icons/inventory.svg"); }
.nav-icon[data-icon="purchases"], .jm-icon[data-icon="purchases"] { --glyph: url("/assets/shell-icons/purchases.svg"); }
.nav-icon[data-icon="intake"], .jm-icon[data-icon="intake"] { --glyph: url("/assets/shell-icons/intake.svg"); }
.nav-icon[data-icon="check-in"], .jm-icon[data-icon="check-in"] { --glyph: url("/assets/shell-icons/check-in.svg"); }
.nav-icon[data-icon="show"], .jm-icon[data-icon="show"] { --glyph: url("/assets/shell-icons/show.svg"); }
.nav-icon[data-icon="sales"], .jm-icon[data-icon="sales"] { --glyph: url("/assets/shell-icons/sales.svg"); }
.nav-icon[data-icon="reviews"], .jm-icon[data-icon="reviews"] { --glyph: url("/assets/shell-icons/reviews.svg"); }
.nav-icon[data-icon="payouts"], .jm-icon[data-icon="payouts"] { --glyph: url("/assets/shell-icons/payouts.svg"); }
.nav-icon[data-icon="consignments-in"], .jm-icon[data-icon="consignments-in"] { --glyph: url("/assets/shell-icons/consignments-in.svg"); }
.nav-icon[data-icon="buyers"], .jm-icon[data-icon="buyers"] { --glyph: url("/assets/shell-icons/buyers.svg"); }
.nav-icon[data-icon="team"], .jm-icon[data-icon="team"] { --glyph: url("/assets/shell-icons/team.svg"); }
.nav-icon[data-icon="owners"], .jm-icon[data-icon="owners"] { --glyph: url("/assets/shell-icons/owners.svg"); }
.nav-icon[data-icon="rulebook"], .jm-icon[data-icon="rulebook"] { --glyph: url("/assets/shell-icons/rulebook.svg"); }
.nav-icon[data-icon="help"], .jm-icon[data-icon="help"] { --glyph: url("/assets/shell-icons/help.svg"); }
.confirm-dialog { width: min(440px, calc(100vw - 32px)); height: fit-content; max-height: calc(100dvh - 32px); margin: auto; padding: 0; color: var(--ink); background: var(--surface); border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--edge-structure); border-radius: var(--radius-control); }
.confirm-dialog[data-tone="danger"] { border-left-color: var(--amber); }
.confirm-dialog::backdrop { background: #000a; }
.confirm-form { display: grid; gap: 10px; padding: 16px; }
.confirm-title { margin: 0; font-size: 15px; font-weight: 600; }
.confirm-body { margin: 0; color: var(--ink-2); font-size: 13px; line-height: 1.45; }
.confirm-reason { color: var(--muted); font: 10px var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.confirm-form input { width: 100%; box-sizing: border-box; }
.confirm-hint { margin: 0; color: var(--amber); font-size: 12px; }
.confirm-hint:empty { display: none; }
.confirm-actions { display: flex; justify-content: flex-end; gap: 8px; }
/* App shell: one frame for every operator page. Three zones: navigation, the work, the optional Context Desk. */
.app-shell { --nav-w: 200px; --desk-width: var(--desk-compact); height: 100dvh; display: grid; grid-template-columns: var(--nav-w) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); overflow: hidden; background: var(--ground); }
@media (min-width: 1600px) { .app-shell { --nav-w: 232px; --desk-width: var(--desk-full); } }
.app-strip { display: none; }

.brand-tile { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 28px; height: 28px; overflow: hidden; border-radius: var(--radius-control, 6px); background: var(--emerald); color: var(--on-emerald); font: 700 12px var(--mono); letter-spacing: 0; text-transform: uppercase; }
.brand-tile[data-logo] { background: var(--raised); }
.brand-tile .brand-logo { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.app-name { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.strip-fact { color: var(--quiet); font-size: 12px; }
.strip-fact b { color: var(--amber); font-weight: 500; font-family: var(--mono); }
.app-facts { margin-left: auto; display: flex; align-items: center; gap: 12px; min-width: 0; padding: 0 12px; }
.nav-toggle { display: none; align-items: center; justify-content: center; align-self: center; width: var(--dismiss); height: var(--dismiss); margin-left: 6px; padding: 0; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); font: 16px var(--mono); cursor: pointer; }
.nav-scrim { display: none; }

.app-nav { grid-column: 1; grid-row: 1; position: relative; z-index: 10; display: flex; flex-direction: column; min-height: 0; background: var(--rail); border-right: 1px solid var(--hairline); }
.brand { display: flex; align-items: center; gap: 10px; flex: none; min-width: 0; padding: 14px 14px 10px; }
.brand[hidden], .app-brand[hidden] { display: none; }
.brand:not([data-ready]), .app-brand:not([data-ready]) { visibility: hidden; }
.brand b { flex: 1; font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.lbl { font: 600 10px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.mode-switch { position: relative; flex: none; margin: 2px 10px 8px; }
.mode-switch:not([data-ready]) { visibility: hidden; }
.mode { display: flex; align-items: center; gap: 8px; width: 100%; height: 34px; padding: 0 10px; color: var(--emerald); background: var(--emerald-tint); border: 1px solid var(--emerald-border); border-radius: var(--radius-control); font: inherit; cursor: pointer; }
.mode:hover { color: var(--emerald-body); }
.mode b { font-size: 13px; font-weight: 600; }
.mode .lbl { color: inherit; }
.mode[data-single="true"] { cursor: default; }
.mode[data-single="true"] .chev { display: none; }
.chev { width: 14px; height: 14px; margin-left: auto; flex: none; background: currentColor; }
.menu { position: absolute; z-index: 50; top: calc(100% + 4px); left: 0; width: 340px; max-width: calc(100vw - 24px); display: flex; flex-direction: column; padding: 6px; background: var(--raised); border: 1px solid var(--edge-structure); border-radius: var(--radius-control); }
.menu[hidden] { display: none; }
.menu a, .menu button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 32px; padding: 8px 10px; color: var(--ink); background: none; border: 0; border-left: var(--edge-w) solid transparent; border-radius: 3px; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.menu a:hover, .menu button:hover, .menu a:focus-visible, .menu button:focus-visible { background: var(--well); color: var(--ink); outline: none; }
.menu a.on { background: var(--selected); border-left-color: var(--emerald); }
.menu a span { display: flex; flex-direction: column; flex: 1; gap: 1px; }
.menu a small { color: var(--muted); font-size: 11.5px; }
.menu kbd { color: var(--muted); font: 11px var(--mono); }
.menu hr { margin: 6px 4px; border: 0; border-top: 1px solid var(--hairline); }
.menu .lbl { padding: 6px 10px 4px; }
.menu-up { top: auto; bottom: calc(100% + 4px); left: 8px; width: 220px; }
.menu a[hidden], .menu button[hidden] { display: none; }

.app-nav-search { flex: none; padding: 0 10px 8px; }
.nav-search { display: flex; align-items: center; gap: 8px; width: 100%; height: 30px; padding: 0 10px; color: var(--muted); background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-control); font-size: 12.5px; text-align: left; cursor: pointer; }
.nav-search:hover { border-color: var(--edge-structure); }
.nav-search-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-search kbd { color: var(--muted); font: 11px var(--mono); }
.app-nav-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 0 0 8px; }
.navgroup { display: flex; flex-direction: column; gap: 1px; padding: 8px 6px 2px; }
.navgroup-label { padding: 4px 8px 6px; color: var(--muted); font: 600 10.5px var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.navgroup:not(:has(.nav-item:not([hidden]):not([data-mode-hidden]))) { display: none; }
.nav-item { display: flex; align-items: center; gap: 9px; min-height: 30px; padding: 0 8px; color: var(--ink-2); border-left: var(--edge-w) solid transparent; border-radius: var(--radius-control); font-size: 13px; text-decoration: none; }
.nav-item:hover { background: var(--raised); color: var(--ink); }
.nav-item.is-current, .nav-item.jm-current { color: var(--emerald); background: var(--selected); border-left-color: var(--emerald); }
.nav-item[hidden], .nav-item[data-mode-hidden], .rail-row[hidden] { display: none; }
body[data-buyer-only] .app-nav-search, body[data-buyer-only] .app-nav-scroll .navgroup, body[data-buyer-only] .app-nav-scroll .nav-more,
body[data-buyer-only] .rails { display: none; }
.navgroup-just-me, .jm-tabs, .strip-profile { display: none; }
body[data-just-me] .navgroup-just-me { display: flex; }
body[data-just-me] .app-nav-scroll .navgroup:not(.navgroup-just-me):not(.navgroup-help), body[data-just-me] .mode-switch { display: none; }
.nav-icon { width: 15px; height: 15px; flex: none; background: currentColor; }
.nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-count { margin-left: auto; color: var(--muted); font: 11px var(--mono); }
.nav-count:empty { display: none; }
.nav-count[data-tone="attention"] { color: var(--amber); }
.nav-item.is-current .nav-count { color: var(--emerald); }
.nav-more { margin-top: 2px; }
.nav-more:not(:has(.nav-item:not([hidden]):not([data-mode-hidden]))) { display: none; }
.nav-more > summary { display: flex; align-items: center; gap: 6px; min-height: 24px; padding: 0 8px 0 10px; color: var(--muted); font-size: 12px; cursor: pointer; list-style: none; }
.nav-more > summary::-webkit-details-marker { display: none; }
.nav-more > summary::before { content: "▸"; width: 8px; font-size: 9px; }
.nav-more[open] > summary::before { content: "▾"; }
.nav-more > summary:hover { color: var(--ink-2); }
.nav-place { min-height: 26px; padding-left: 18px; color: var(--quiet); font-size: 12px; }
.navgroup-help { padding-bottom: 8px; }
.nav-item:focus-visible, .nav-more > summary:focus-visible, .nav-search:focus-visible, .mode:focus-visible, .me:focus-visible { outline: var(--focus-ring); outline-offset: -2px; }

.app-nav-foot { flex: none; border-top: 1px solid var(--hairline); }
.rails { padding: 10px 14px 6px; }
.rail-context-label { margin: 0 0 6px; color: var(--muted); font: 600 10.5px var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.rail-note { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 15px; overflow-wrap: anywhere; }
/* The note carries its own line breaks (railNoteTextJs), so it has the same lines and height in any face. */
#rail-spendable-note { white-space: pre-line; }
.rail-note:empty:not(#rail-state) { display: none; }
#rail-state { min-height: 15px; }
/* A staged read that failed or timed out says so in one plain line where its block is, with Retry (settleGateJs in shellFrame.ts). */
.load-failed { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; color: var(--ink-2); font-size: 12px; }
.rail-list { margin: 0; }
.rail-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: 8px; min-height: 20px; color: var(--ink-2); font-size: 12.5px; }
.rail-row dt { min-width: 0; overflow-wrap: anywhere; }
.rail-row dd { margin: 0; text-align: right; white-space: nowrap; color: var(--ink-2); font: 500 12.5px var(--mono); font-variant-numeric: tabular-nums; }
.rail-row dd[data-tone="attention"] { color: var(--amber); }
.rail-total { margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--hairline); color: var(--ink); font-weight: 600; }
.rail-total dd { color: var(--emerald); font-weight: 700; }
.rail-total dd[data-tone="attention"] { color: var(--amber); }
.app-session { position: relative; }
.app-session:not(#profile) { padding: 10px 14px; border-top: 1px solid var(--hairline); }
.app-session .context-label { margin: 0 0 6px; max-width: none; color: var(--ink-2); font: 11px var(--mono); overflow-wrap: anywhere; text-align: left; }
.session-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.session-actions .button { flex: 1 1 auto; }
.me { display: flex; align-items: center; gap: 9px; width: 100%; padding: 10px 14px; color: var(--ink); background: none; border: 0; border-top: 1px solid var(--hairline); font: inherit; font-size: 12.5px; text-align: left; cursor: pointer; }
.me:hover, .me[aria-expanded="true"] { background: var(--raised); }
.me-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.app-session .me-text b, .app-session .me-text .context-label { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font: 500 12.5px var(--sans); }
.app-session .me-text small.context-label { max-width: 100%; font: 11px var(--sans); }
.menu-business { margin: 0; padding: 6px 10px 8px; border-bottom: 1px solid var(--hairline); color: var(--ink); font-weight: 600; font-size: 12.5px; overflow-wrap: anywhere; }
.me-text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 11px; }
.av { display: grid; place-items: center; width: 24px; height: 24px; flex: none; color: var(--purple-body); background: var(--purple-tint); border: 1px solid var(--purple-border); border-radius: 50%; font: 600 10px var(--sans); }
.av:empty::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--glyph-person) center / contain no-repeat; mask: var(--glyph-person) center / contain no-repeat; }
.chev-down { -webkit-mask: var(--glyph-down) center / contain no-repeat; mask: var(--glyph-down) center / contain no-repeat; }
.chev-up { -webkit-mask: var(--glyph-up) center / contain no-repeat; mask: var(--glyph-up) center / contain no-repeat; }
.nav-icon, .jm-icon { -webkit-mask: var(--glyph, none) center / contain no-repeat; mask: var(--glyph, none) center / contain no-repeat; }

.app-content { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--ground); }
/* One row, one height on every page: long facts are cut with an ellipsis (the full text is the tooltip). */
.page-header { flex: none; height: 52px; display: flex; align-items: center; gap: 16px; padding: 0 16px; border-bottom: 1px solid var(--hairline); }
/* Drawn after the title (the title leads the header), shown before it as the board draws it. */
.page-back { order: -1; flex: none; display: inline-flex; align-items: center; gap: 4px; margin-right: -6px; color: var(--muted); font-size: 13px; text-decoration: none; }
.page-back:hover { color: var(--ink); }
.page-back-glyph { width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--glyph-back) center / contain no-repeat; mask: var(--glyph-back) center / contain no-repeat; }
.page-header h1 { flex: none; margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
.page-facts { flex: 1 1 0; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font: 12px var(--mono); }
.read-only-label { flex: none; padding: 0 0 0 8px; border-left: var(--edge-w) solid var(--edge-structure); color: var(--quiet); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.page-actions { display: flex; align-items: center; flex: none; gap: 8px; margin-left: auto; }
.page-actions:empty { display: none; }
/* One solid emerald action per bar: any later solid button in the bar reads as a plain one. */
.page-actions .button:not(.button-quiet):not(.button-danger) ~ .button:not(.button-quiet):not(.button-danger) { color: var(--ink); background: var(--raised); border-color: var(--hairline); }
.page-actions .button:not(.button-quiet):not(.button-danger) ~ .button:not(.button-quiet):not(.button-danger):hover { color: var(--ink); border-color: var(--edge-structure); }
/* A blocked action is dashed amber, still pressable, and explains itself in place. */
.button[data-refusal], .button[data-refusal-action] { color: var(--amber-body); background: transparent; border: 1px dashed var(--amber-border); }
.help-link { flex: none; padding: 0 2px; color: var(--quiet); font-size: 11px; white-space: nowrap; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--hairline); }
.help-link:hover, .help-link:focus-visible { color: var(--ink); }
body[data-session-state="none"] .page-actions { visibility: hidden; }
.app-body { position: relative; flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
.app-body:has(> .context-desk:not([hidden])) { grid-template-columns: minmax(0, 1fr) var(--desk-width); }
.app-body > main { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: auto; width: 100%; max-width: none; margin: 0; padding: 12px 16px; }
.app-body > .context-desk { grid-column: 2; grid-row: 1; min-height: 0; overflow: hidden; }
.app-body > .context-desk > .desk-scroll { overflow-y: auto; }
/* The shared Context Desk (renderContextDesk): rail ground, emerald left edge; the selected thing, its money, its actions. */
.context-desk.desk-board { background: var(--rail); border-left: var(--edge-w) solid var(--emerald); }
.desk-board .dhead { display: flex; align-items: center; gap: 8px; flex: none; min-height: 38px; padding: 0 14px; border-bottom: 1px solid var(--hairline); color: var(--ink); font-size: 13px; font-weight: 600; }
.desk-board .dhead .mono { margin-left: auto; color: var(--muted); font-size: 12px; font-weight: 400; }
.desk-board .desk-scroll { flex: 1; min-height: 0; }
.desk-board .dsec { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--divider); }
.desk-board .facts2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.desk-board .fact { display: flex; flex-direction: column; gap: 1px; min-width: 0; padding: 6px 9px; background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-well); }
.desk-board .fact span { color: var(--muted); font: 600 10px var(--sans); letter-spacing: .07em; text-transform: uppercase; }
.desk-board .fact b { color: var(--ink); font: 500 13px var(--mono); overflow-wrap: anywhere; }
.desk-board .fact b.fact-ok { color: var(--emerald); }
.desk-board .fact b.fact-warn { color: var(--amber); }
.desk-board .fact b.fact-party { color: var(--purple); }
.desk-board .water { background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-well); }
.desk-board .water > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 28px; padding: 0 10px; color: var(--ink-2); border-bottom: 1px solid var(--divider); border-left: var(--edge-w) solid var(--edge-structure); }
.desk-board .water > div.party { border-left-color: var(--purple-border); }
.desk-board .water > div b { color: var(--ink); font: 500 12.5px var(--mono); }
.desk-board .water > div.tot { height: 32px; color: var(--ink); font-weight: 600; border-bottom: 0; border-left-color: transparent; }
.desk-board .dfoot { display: flex; flex-wrap: wrap; flex: none; gap: 8px; margin-top: auto; padding: 12px 14px; background: var(--rail); border-top: 1px solid var(--hairline); }
.desk-board .dfoot .button:not(.button-quiet):not(.button-danger) ~ .button:not(.button-quiet):not(.button-danger) { color: var(--ink); background: var(--raised); border-color: var(--hairline); }
@media (max-width: 1359px) {
  .app-body:has(> .context-desk:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
  .app-body > .context-desk:not([hidden]) { position: absolute; top: 0; right: 0; bottom: 0; z-index: 5; width: var(--desk-compact); max-width: 100%; grid-column: auto; grid-row: auto; }
}
.app-shell .desktop-workspace { min-height: 0; }
body.desk-full-width .app-body:has(> .context-desk:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
body.desk-full-width .app-body > main { display: none; }
body.desk-full-width .app-body > .context-desk { grid-column: 1; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.id-secondary { color: var(--quiet); font: 10px var(--mono); overflow-wrap: anywhere; }
.settlement-terms { display: grid; gap: 2px; }
.status-message:empty { display: none; }
/* The status line keeps its place whether or not it has words, so a loading message arriving or leaving moves nothing. */
.app-body > main > .status-message:empty { display: block; min-height: 1.5rem; }
.app-shell main .table-frame + .section-heading, .app-shell main .workspace-hint + .section-heading, .app-shell main .section-heading:not(:first-child) { margin-top: 16px; }
.app-shell main .section-heading { margin-bottom: 8px; }
.app-shell th { white-space: nowrap; }
.app-shell table[aria-label="Sales ledger"] { table-layout: fixed; }
.app-shell table[aria-label="Sales ledger"] th:nth-child(1) { width: 31%; }
.app-shell table[aria-label="Sales ledger"] th:nth-child(2) { width: 15%; }
.app-shell table[aria-label="Sales ledger"] th:nth-child(3) { width: 9%; }
.app-shell table[aria-label="Sales ledger"] th:nth-child(4) { width: 11%; }
.app-shell table[aria-label="Sales ledger"] th:nth-child(5) { width: 13%; }
.app-shell table[aria-label="Sales ledger"] th:nth-child(6) { width: 10%; }
.app-shell #sales-rows td { overflow: hidden; text-overflow: ellipsis; }
.app-shell #sales-rows td:nth-child(6), .app-shell #sales-rows td:nth-child(5) { white-space: nowrap; overflow: visible; }
.app-shell #sales-rows td:first-child { white-space: normal; line-height: 1.25; }
.app-shell #sales-rows td.mono-cell { font: 11px var(--mono); }
body[data-page="onboarding"] main .control-panel { display: block; max-width: 56rem; }
body[data-page="onboarding"] main .control-panel > :is(h2, .eyebrow) + p { margin-top: 4px; }
.app-shell td.money, .app-shell td.money-cell, .app-shell th.money-head { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.app-shell th.money-head { font-family: var(--mono); }
.intake-safety-note:empty, .workspace-hint:empty { display: none; }
.app-shell td.is-negative { color: var(--amber); }
.app-shell .form-compact { display: grid; grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr); gap: 8px 12px; align-items: center; max-width: 48rem; margin: 0; padding: 0; border: 0; background: none; }
.app-shell .form-compact > label { margin: 0; }
.app-shell .form-compact > label:has(> :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea)) { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; align-items: center; }
.app-shell .form-compact > label:has(> input[type="checkbox"]) { grid-column: 1 / -1; }
.app-shell .form-compact > :is(button, p, details, .field-note) { grid-column: 2; }
.app-shell .form-compact > button { justify-self: start; width: auto; margin: 0; }
.app-shell .form-compact > :is(h2, h3) { grid-column: 1 / -1; }
.app-shell main .control-panel > :is(h2, h3), .app-shell #payouts-panel .control-panel > h3 { margin: 0 0 8px; color: var(--quiet); font: 500 10px var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.app-shell #payouts-panel .workspace-main > h3 { margin: 16px 0 8px; color: var(--quiet); font: 500 10px var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.app-shell #payouts-panel .workspace-grid { gap: 16px 24px; }
.app-shell #payouts-panel .workspace-grid > .control-panel { padding: 12px 0 0; border: 0; border-top: 1px solid var(--hairline); background: none; }
.app-shell #payouts-panel .workspace-grid > .control-panel p { margin: 8px 0 0; color: var(--quiet); font-size: 11px; }
.app-shell main form:not(.form-compact) > .button, .app-shell main form:not(.form-compact) > button:not(.icon-button) { justify-self: start; width: auto; }
.app-shell .record-desk .form-compact { grid-template-columns: 7.5rem minmax(0, 1fr); }
.app-shell .record-desk .form-compact > p { grid-column: 1 / -1; }
.app-shell .desk-board .form-compact { grid-template-columns: 7.5rem minmax(0, 1fr); }
.app-shell .desk-board .form-compact > :is(p, button) { grid-column: 1 / -1; }
.app-shell .desk-board .form-compact > button { justify-self: start; }
/* A form in the narrow side desk stacks: a sentence-case label over its field, as on the boards. */
.app-shell .context-desk .form-compact { grid-template-columns: minmax(0, 1fr); gap: 10px; max-width: none; }
.app-shell .context-desk .form-compact > label:has(> :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea)) { grid-template-columns: minmax(0, 1fr); gap: 4px; align-items: stretch; }
.app-shell .context-desk .form-compact > label { color: var(--ink-2); font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.app-shell .context-desk .form-compact > :is(button, p, details, .field-note) { grid-column: 1 / -1; }
.desk-board .role-list { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.desk-board .role-list dt { color: var(--muted); font: 600 10.5px var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.desk-board .role-list dd { margin: 2px 0 0; color: var(--ink-2); font-size: 12.5px; text-align: left; }
.app-shell main .control-panel > p + form { margin-top: 8px; }
.app-shell .desktop-workspace th { white-space: normal; letter-spacing: .03em; }
.app-shell .desktop-workspace td { overflow-wrap: anywhere; }
.app-shell main .control-panel { padding: 12px; margin-bottom: 12px; }
.app-shell main .record-desk h2 { margin-bottom: 8px; }
.app-shell input[type="checkbox"], .app-shell input[type="radio"] { flex: none; width: 16px; height: 16px; min-height: 0; padding: 0; accent-color: var(--emerald); }
/* Where a table becomes a stack of cards (below 48rem) a cell's height is only a minimum, whatever a page set for desk rows. */
@media (max-width: 48rem) { .app-shell tbody td, .app-shell tfoot td { height: auto !important; } }
/* Form labels read in sentence case, as on the boards; uppercase is kept for table heads and section eyebrows. */
.app-shell label { font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--ink-2); }
.app-shell label:has(> input[type="checkbox"]), .app-shell label:has(> input[type="radio"]) { display: flex; align-items: center; gap: 8px; color: var(--ink-2); font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.app-body > main > .status-message { margin: 0 0 8px; padding: 0; font-size: 11px; }
/* A place that has not been made to take its data into its final room holds back until its first reads are done
   (settleGateJs in shellFrame.ts), but never as a blank screen: its work area (data-outline, shellFrame.ts OUTLINE_PANELS)
   shows as its outline, everything down to its first part that can still grow or appear (shellFrame.ts HOLD_SELECTOR): the
   headings, the hints, the column heads, in their final place, with "Loading…" in the status line. What comes after that
   waits, invisible but in its place, so rows arriving push nothing that is in view. There is no time limit: a limit would let a later stage land above what is on screen. */
html[data-settling] .app-body > main > :not(.status-message, [data-outline]), html[data-settling] .app-body .context-desk { visibility: hidden; }
/* A work area its script hides while it reads keeps showing as the outline, in its own layout (grid, flex: --outline-display). */
html[data-settling] .app-body > main > [data-outline][hidden] { display: var(--outline-display, block) !important; }
html[data-settling] .app-body > main > .status-message:empty::before { content: "Loading…"; color: var(--muted); }
html[data-settling]:not([data-held-set]) [data-outline] :is(:has(:is(tbody, ul, ol, div[id], section[id]):empty:not([hidden] *), [hidden]:not([hidden] *)), :is(tbody, ul, ol, div[id], section[id]):empty:not([hidden] *), [hidden]:not([hidden] *)) ~ *, html[data-settling] [data-held], html[data-settling] [data-hold-into] > * { visibility: hidden; }

@media (max-width: 899px) {
  .app-shell { display: block; height: auto; min-height: 100dvh; overflow: visible; }
  .app-strip { position: sticky; top: 0; z-index: 30; display: flex; align-items: stretch; min-width: 0; height: 34px; background: var(--rail); border-bottom: 1px solid var(--hairline); }
  .nav-toggle { display: flex; }
  .app-brand { display: flex; align-items: center; gap: 8px; flex: 1; padding: 0 10px; }
  .app-brand { min-width: 0; }
  .app-brand .brand-tile { width: 22px; height: 22px; font-size: 10px; }
  .app-name { font-size: 13px; }
  .app-nav { position: fixed; top: 34px; bottom: 0; left: 0; z-index: 40; width: min(280px, 86vw); transform: translateX(-100%); visibility: hidden; transition: transform 120ms ease-out, visibility 0s linear 120ms; }
  .app-shell[data-nav-open="true"] .app-nav { transform: none; visibility: visible; transition-delay: 0s; }
  .app-shell[data-nav-open="true"] .nav-scrim { display: block; position: fixed; inset: 34px 0 0 0; z-index: 35; background: #0009; }
  .app-content, .app-body, .app-body > main { display: block; overflow: visible; }
  .app-body > main { padding: 12px; }
  .page-header { height: auto; min-height: 52px; flex-wrap: wrap; gap: 8px 12px; padding: 10px 12px; }
  .page-facts { flex: 1 1 100%; min-height: 16px; white-space: normal; }
  .page-facts[data-lines="2"] { min-height: 32px; }
  .page-facts[data-lines="3"] { min-height: 48px; }
  .page-actions { flex: 1 1 100%; flex-wrap: wrap; min-width: 0; margin-left: 0; }
  .app-body:has(> .context-desk:not([hidden])) { display: block; }
  .app-body > .context-desk, .app-body > .context-desk:not([hidden]) { position: static; width: auto; border-top: 1px solid var(--hairline); }
  /* Below the work on a phone, the desk waits for the work: it would otherwise sit high on the screen and be pushed off it. */
  .app-body:has(> main #today-board[hidden]) > #today-desk { display: none; }
  .menu { position: fixed; top: 96px; left: 8px; right: 8px; width: auto; max-width: none; }
  .menu-up { top: auto; bottom: 64px; }
  .nav-item, .nav-more > summary, .nav-search { min-height: var(--tap); }
  /* Just me: five tabs at the bottom, no drawer. Profile sits in the top strip beside the business name. */
  body[data-just-me] .nav-toggle, body[data-just-me] .app-nav, body[data-just-me] .nav-scrim { display: none; }
  body[data-just-me] .strip-profile { display: inline-flex; align-items: center; padding: 0 4px; color: var(--ink-2); font-size: 12px; }
  body[data-just-me] .jm-tabs { position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
    padding-bottom: env(safe-area-inset-bottom); background: var(--rail); border-top: 1px solid var(--hairline); }
  body[data-just-me] { --jm-tabs-h: calc(54px + env(safe-area-inset-bottom)); }
  body[data-just-me] .jm-tabs a { height: 54px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; color: var(--muted); font-size: 11px; text-decoration: none; white-space: nowrap; }
  body[data-just-me] .jm-tabs a.jm-current { color: var(--emerald); }
  body[data-just-me] .jm-tabs .jm-icon { width: 20px; height: 20px; flex: none; background: currentColor; }
  body[data-just-me] .app-body > main { padding-bottom: calc(var(--jm-tabs-h) + 18px); }
  /* The side panel opens below the list: clear the bar, and dock its action row above it rather than under it. */
  body[data-just-me] .app-body > .context-desk { padding-bottom: var(--jm-tabs-h); }
  body[data-just-me] .desk-actions { bottom: var(--jm-tabs-h); }
}
@media (prefers-reduced-motion: reduce) { .app-nav { transition: none; } }

/* Hold and close screens: searchable pickers, chosen-item lists, adjusting-entry lines. */
.picker { position: relative; display: grid; gap: 4px; min-width: 0; }
.picker-results { position: absolute; top: 100%; left: 0; right: 0; z-index: 20; margin: 2px 0 0; padding: 0; list-style: none; max-height: 224px; overflow: auto; background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-control); }
.picker-results[hidden] { display: none; }
.picker-option { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; width: 100%; min-height: 28px; padding: 3px 8px; color: var(--ink-2); background: none; border: 0; border-left: var(--edge-w) solid transparent; font-size: 12px; text-align: left; cursor: pointer; }
.picker-option:hover, .picker-option:focus-visible { background: var(--raised); border-left-color: var(--emerald); outline: none; }
.picker-none { padding: 6px 8px; color: var(--quiet); font-size: 12px; }
.picker-chosen { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-height: var(--control-h); margin: 0; padding: 2px 8px; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--emerald); border-radius: var(--radius-control); font-size: 12px; }
.picker-chosen[hidden] { display: none; }
.picked-list { display: grid; gap: 4px; margin: 0 0 8px; padding: 0; list-style: none; }
.picked-list li { display: flex; align-items: center; gap: 8px; min-height: 28px; padding: 2px 8px; background: var(--raised); border-left: var(--edge-w) solid var(--edge-structure); font-size: 12px; }
.app-shell .stack-panel { display: block; min-width: 0; margin: 0 0 12px; padding: 12px; }
.app-shell #invite-panel { width: 100%; box-sizing: border-box; }
.app-shell #invite-form { grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, 1fr); }
.app-shell .stack-panel h3 { margin: 0 0 4px; color: var(--ink); font-size: 13px; }
.app-shell .stack-panel .inventory-filters { margin: 8px 0 0; padding: 0; background: none; border: 0; }
.app-shell .inventory-filters > .filter-wide { grid-column: 1 / -1; }
.app-shell #channel-section { margin-top: 16px; }
.app-shell .hold-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: start; margin-top: 12px; }
@media (min-width: 1360px) { .app-shell .hold-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.decision-stack { display: grid; gap: 8px; min-width: 240px; max-width: 520px; }
.decision-stack form { display: flex; align-items: flex-end; gap: 6px; }
.decision-stack form > select, .decision-stack form > div { flex: 1; min-width: 0; }
.decision-stack .button { flex: none; width: auto; }
.decision-stack .button-quiet { justify-self: start; }
.adjust-lines { display: grid; gap: 8px; }
.adjust-line { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; align-items: end; padding: 8px; background: var(--surface); border-left: var(--edge-w) solid var(--edge-structure); }
.adjust-line > div { display: grid; gap: 4px; min-width: 0; }
.adjust-party:empty { display: none; }
.money-input { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; }
.app-shell tfoot td { padding: 4px 8px; color: var(--ink); background: var(--surface); border-top: 1px solid var(--hairline); font-weight: 600; }
.app-shell .profit-headline { margin: 2px 0 14px; font-size: 28px; line-height: 1.2; color: var(--ink); }
.app-shell .profit-headline.is-negative { color: var(--danger, var(--ink)); }
.app-shell .field-error { display: block; margin: .25rem 0 0; color: var(--danger, #b3261e); font-weight: 600; font-size: .85rem; }
.app-shell input[aria-invalid="true"] { border-color: var(--danger, #b3261e); }
.app-shell .profit-subhead { margin: 2px 0 10px; font-size: 18px; line-height: 1.3; color: var(--amber, var(--ink)); }
.app-shell td.is-memo { color: var(--muted); font-style: italic; }
.app-shell .channel-total td { color: var(--ink); background: var(--surface); border-top: 1px solid var(--hairline); font-weight: 600; }
@media (max-width: 899px) { .adjust-line { grid-template-columns: minmax(0, 1fr); } }
/* Money-settling screens: payouts, trades, deals, consignments. */
.settle-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; margin: 12px 0; }
.settle-grid > .control-panel { display: block; min-width: 0; margin: 0; padding: 10px 12px; }
.settle-form textarea { width: 100%; min-height: 96px; padding: 4px 8px; color: var(--ink); background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); font: 11px var(--mono); resize: vertical; }
.settle-form .table-frame { margin: 4px 0; }
.settle-grid-wide { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.settle-form > .button, .settle-form > button { justify-self: start; }
.import-lines th:first-child, .import-lines td:first-child { min-width: 10rem; }
.import-lines td:nth-child(2) input { min-width: 6rem; }
.incoming-cards td:nth-child(1) input { min-width: 4.5rem; }
.incoming-cards td:nth-child(2) input { min-width: 11rem; }
.incoming-cards td:nth-child(3) input { min-width: 18rem; }
.incoming-cards td:nth-child(4) input { min-width: 4.5rem; }
.incoming-cards td:nth-child(5) input { min-width: 8rem; }
.incoming-cards td:nth-child(6) input { min-width: 4.5rem; }
.incoming-cards td:nth-child(7) input { min-width: 3.5rem; }
.incoming-cards td:nth-child(8) input { min-width: 8rem; }
.incoming-cards td:nth-child(9) input { min-width: 6rem; }
.settle-form .filter-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0; }
.card-slab { color: var(--muted); }
.settle-grid h3 { margin: 0 0 8px; color: var(--quiet); font: 10px var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.settle-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.settle-form label { color: var(--muted); font-size: 11px; }
.settle-facts { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 16px; margin: 6px 0; }
.settle-facts dt { color: var(--muted); font-size: 12px; }
.settle-facts dd { margin: 0; text-align: right; font-size: 12px; }
.settle-form .settle-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 6px; align-items: end; }
.settle-form .settle-row > div { display: grid; gap: 2px; min-width: 0; }
.settle-form .channel-choices { display: flex; flex-wrap: wrap; gap: 4px 12px; border: 0; margin: 0; padding: 0; min-width: 0; }
.settle-form .channel-choices legend { color: var(--muted); font-size: 11px; padding: 0; margin-bottom: 2px; }
.settle-form .inline-check { display: inline-flex; align-items: center; gap: 4px; color: var(--ink); font-size: 12px; }
.settle-note { margin: 0 0 8px; padding: 6px 8px; border-left: var(--edge-w) solid var(--edge-structure); background: var(--soft); color: var(--quiet); font-size: 11px; }
.settle-note[data-tone="attention"] { border-left-color: var(--amber); background: var(--amber-tint); color: var(--amber-body); }
.settle-note[data-tone="party"] { border-left-color: var(--purple); background: var(--purple-tint); color: var(--purple-body); }
.settle-tabs { display: flex; gap: 6px; margin: 0 0 8px; }
.settle-sub { margin: 0; padding: 6px 8px 6px 28px; color: var(--quiet); font-size: 11px; }
.settle-total td { border-top: 1px solid var(--hairline); color: var(--ink); font-weight: 600; }
.settle-section { margin: 0 0 16px; }
#money-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#money-board table { width: 100%; }
@media (max-width: 899px) { #money-board { grid-template-columns: minmax(0, 1fr); } }
.consignor-layout { display: grid; grid-template-columns: minmax(200px, 260px) minmax(0, 1fr); gap: 16px; align-items: start; }
.consignor-roster { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.consignor-pick { display: flex; flex-direction: column; gap: 1px; width: 100%; padding: 7px 10px; text-align: left; color: var(--ink); background: var(--surface); border: 1px solid var(--hairline); border-left: var(--edge-w) solid transparent; border-radius: var(--radius-control); font: inherit; cursor: pointer; }
.consignor-pick b { font-size: 13px; font-weight: 600; }
.consignor-pick span { color: var(--muted); font: 11px var(--mono); }
.consignor-pick.is-selected { border-left-color: var(--emerald); background: var(--raised); }
@media (max-width: 1699px) { .consignor-layout { grid-template-columns: minmax(0, 1fr); } .consignor-roster { flex-direction: row; flex-wrap: wrap; } .consignor-pick { width: auto; min-width: 200px; } }
.consignor-detail { min-width: 0; }
.consignor-detail .table-frame { overflow-x: auto; }
@media (min-width: 900px) { .consignor-detail .table-frame table { min-width: 46rem; } .consignor-detail .table-frame td:first-child { min-width: 14rem; } }
@media (max-width: 899px) { .consignor-layout { grid-template-columns: minmax(0, 1fr); } }
.settle-section > h2 { margin: 0 0 6px; font-size: 13px; }
.card-cell { display: inline-flex; flex-direction: column; min-width: 0; }
.app-shell tbody tr.control-party { border-left-color: var(--purple); }
.app-shell .chip-party { color: var(--purple-body); background: var(--purple-tint); border-left-color: var(--purple); }
.app-shell .desk-outcome[data-outcome="pending"] { color: var(--quiet); border-left-color: var(--edge-structure); background: var(--soft); }
.app-shell .desk-outcome[data-outcome="refused"] { color: var(--amber-body); border-left-color: var(--amber); background: var(--amber-tint); }
.app-shell .desk-outcome { margin: 8px 0; }
.app-shell .desk-outcome p { margin: 0 0 4px; }


/* ---- Needs review: groups by edge colour, one-note bulk panel, the selected review as the Context Desk ---- */
.app-shell #review-rows tr.review-group-signoff { border-left-color: var(--emerald); }
.app-shell #review-rows tr.review-group-problem { border-left-color: var(--amber); }
.app-shell #review-rows tr.review-group-buyer, .app-shell #review-rows tr.review-group-identity { border-left-color: var(--purple); }
.app-shell #review-rows tr.is-selected { background: var(--selected); }
.review-kind { display: block; margin-top: 2px; color: var(--muted); font: 600 10px var(--sans); letter-spacing: .07em; text-transform: uppercase; }
.review-group-signoff .review-kind { color: var(--emerald); }
.review-group-problem .review-kind { color: var(--amber); }
.review-group-buyer .review-kind, .review-group-identity .review-kind { color: var(--purple); }
.app-shell .review-bulk { gap: 8px; margin: 0 0 12px; padding: 12px 14px; background: var(--emerald-tint); border: 1px solid var(--emerald-border); border-left: var(--edge-w) solid var(--emerald); border-radius: var(--radius-well); }
.app-shell .review-bulk[hidden] { display: none; }
.app-shell .review-bulk-title { margin: 0; color: var(--ink); font: 600 13px var(--sans); letter-spacing: 0; text-transform: none; }
.app-shell .review-bulk > label { color: var(--ink-2); font-size: 12px; }
.app-shell .review-bulk > .review-actions { padding: 0; }
.app-shell dialog#review-dialog.record-desk[open] { background: var(--rail); border-left: var(--edge-w) solid var(--emerald); }
.app-shell #review-dialog .desk-header { min-height: 38px; padding: 0 14px; }
.app-shell #review-dialog .desk-header .eyebrow { color: var(--muted); font: 600 10px var(--sans); letter-spacing: .07em; text-transform: uppercase; }
.app-shell #review-dialog .desk-actions { margin-top: auto; padding: 12px 14px; background: var(--rail); }
.app-shell #review-dialog .desk-actions .button:not(.button-quiet):not(.button-danger) ~ .button:not(.button-quiet):not(.button-danger) { color: var(--ink); background: var(--raised); border-color: var(--hairline); }
.app-shell #review-dialog .detail-grid > dd.identifier, .app-shell #review-dialog .detail-grid > dt:has(+ dd.identifier) { display: none; }
.app-shell #review-dialog .technical-details .detail-grid > dd.identifier { display: block; }
.app-shell #review-dialog .technical-details .detail-grid > dt:has(+ dd.identifier) { display: block; }
.app-body:has(#review-bulk-bar:not([hidden])) #review-dialog .desk-actions .button:not(.button-quiet):not(.button-danger) { color: var(--ink); background: var(--raised); border-color: var(--hairline); }
.app-shell #review-dialog .technical-details { margin: 0; padding: 8px 12px; border-top: 1px solid var(--divider); }
.app-shell #review-dialog .technical-details summary { color: var(--muted); font-size: 11px; cursor: pointer; }

/* ---- Bring in your workbook: five steps, the tabs, columns in plain words, counts in the desk ---- */
.wb-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin: 0 0 12px; padding: 0; list-style: none; border: 1px solid var(--hairline); border-radius: var(--radius-well); background: var(--surface); overflow: hidden; }
.wb-steps li { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 12px; color: var(--muted); font-size: 12px; border-right: 1px solid var(--hairline); border-bottom: var(--edge-w) solid transparent; }
.wb-steps li:last-child { border-right: 0; }
.wb-steps li > span { display: grid; place-items: center; flex: none; width: 18px; height: 18px; color: var(--muted); border: 1px solid var(--hairline); border-radius: 50%; font: 600 10px var(--mono); }
.wb-steps li[data-state="done"] { color: var(--ink-2); }
.wb-steps li[data-state="done"] > span { color: var(--emerald); border-color: var(--emerald-border); }
.wb-steps li[aria-current="step"] { color: var(--ink); background: var(--raised); border-bottom-color: var(--emerald); }
.wb-steps li[aria-current="step"] > span { color: var(--on-emerald); background: var(--emerald); border-color: var(--emerald); }
.app-shell #workbook-section { display: block; padding: 0; background: none; border: 0; }
.app-shell #workbook-section > .step-number { display: none; }
.app-shell #workbook-section > div:last-child { display: grid; gap: 10px; }
.app-shell #workbook-section #workbook-title { margin: 0; font: 600 14px var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink); }
.app-shell #workbook-tabs .table-frame { background: var(--surface); }
.app-shell #workbook-tab-rows tr:has(select:not([value="skip"])) th { color: var(--ink); }
.app-shell #workbook-tab-panels { display: grid; gap: 12px; }
.app-shell .workbook-tab { padding: 12px 14px; background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-well); }
.app-shell .workbook-tab > h3 { margin: 0 0 4px; color: var(--ink); font: 600 14px var(--sans); letter-spacing: 0; text-transform: none; }
.app-shell .workbook-tab fieldset { margin: 12px 0 0; padding: 0; border: 0; border-top: 1px solid var(--divider); }
.app-shell .workbook-tab legend { padding: 10px 0 6px; color: var(--ink); font: 600 12px var(--sans); }
.app-shell .workbook-tab .mapping-field > label { display: flex; align-items: center; gap: 8px; }
.wb-guessed { flex: none; padding: 1px 6px; color: var(--emerald); border: 1px solid var(--emerald-border); border-radius: var(--radius-chip, 2px); font: 600 9px var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.wb-example { display: block; grid-column: 1 / -1; margin-top: 2px; color: var(--muted); font: 400 11px var(--sans); letter-spacing: 0; text-transform: none; overflow-wrap: anywhere; }
.app-shell .workbook-tab .preview-messages { margin-top: 10px; }
.app-shell #workbook-desk .water > div[data-tone="attention"] { border-left-color: var(--amber); }
.app-shell #workbook-desk .water > div[data-tone="ok"] b { color: var(--emerald); }

/* ---- Check in ---- */
.app-shell .checkin { display: flex; --outline-display: flex; flex-direction: column; gap: 12px; }
.checkin-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.checkin-card { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--edge-structure); border-radius: var(--radius-well); }
.checkin-card b { color: var(--ink); font: 600 18px var(--mono); }
.checkin-card span { color: var(--ink-2); font-size: 12px; }
.checkin-card.checkin-problem { border-left-color: var(--amber); }
.checkin-card.checkin-open, .checkin-card.checkin-ok { border-left-color: var(--emerald); }
.checkin-panel { background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-well); overflow: hidden; }
.checkin-panel > .checkin-panel-head { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 0 14px; border-bottom: 1px solid var(--hairline); }
.checkin-panel > .checkin-panel-head h2 { margin: 0; color: var(--ink); font: 600 13px var(--sans); letter-spacing: 0; text-transform: none; }
.checkin-aside { margin-left: auto; color: var(--muted); font-size: 12px; }
.checkin-panel .table-frame { border: 0; border-radius: 0; }
.app-shell .checkin-table tr.checkin-problem { border-left-color: var(--amber); }
.app-shell .checkin-table tr.checkin-open, .app-shell .checkin-table tr.checkin-ok { border-left-color: var(--emerald); }
.app-shell .checkin-table tr[aria-selected="true"] { background: var(--selected); }
.checkin-sub { display: block; color: var(--muted); font-size: 11px; }
.checkin-tag { display: inline-block; padding: 1px 7px; color: var(--ink-2); border: 1px solid var(--hairline); border-radius: var(--radius-chip, 2px); font: 600 10px var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.checkin-tag-ok, .checkin-tag-open { color: var(--emerald); border-color: var(--emerald-border); }
.checkin-tag-problem { color: var(--amber); border-color: var(--amber-border); }
.checkin-note, .checkin-hint { margin: 0; color: var(--quiet); font-size: 12px; }
.checkin-off { padding: 10px 12px; color: var(--amber-body); background: var(--amber-tint); border: 1px dashed var(--amber-border); border-radius: var(--radius-well); }
.checkin-off p { margin: 4px 0 0; font-size: 12px; }
@media (max-width: 899px) {
  .checkin-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wb-steps { grid-template-columns: 1fr; }
  .wb-steps li { border-right: 0; border-bottom: 1px solid var(--hairline); }
}



.identity-group { margin: .9rem 0 0; }
.identity-group h3 { margin: 0 0 .35rem; }
.identity-versions { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.identity-versions li { display: grid; grid-template-columns: minmax(5rem, 1fr) minmax(7rem, 2fr) auto; gap: .6rem; align-items: center; padding: .35rem .6rem; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface); }
.identity-versions li[data-match="true"] { border-color: var(--emerald-border); background: var(--emerald-tint); }
.identity-versions .identity-set { color: var(--quiet); }
.identity-versions .identity-parallel { font-weight: 650; }
.identity-match-note { display: block; font-weight: 400; color: var(--emerald-body); font-size: 12px; }
.identity-filtered .identity-show-all { margin-left: .5rem; }
.identity-report-fields { display: grid; gap: .4rem; margin: .6rem 0; }
.identity-report-field { display: grid; grid-template-columns: 9rem 1fr; gap: .6rem; align-items: center; }
.identity-report-check { display: flex; gap: .4rem; align-items: center; font-weight: 600; }
.identity-reports { list-style: none; margin: .35rem 0 0; padding: 0; display: grid; gap: .3rem; }
.identity-reports li { display: grid; grid-template-columns: 11rem 1fr; gap: .6rem; padding: .35rem .6rem; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface); }
.identity-moved { border-left: 3px solid var(--emerald-border); padding-left: .6rem; }
.identity-version-id { display: block; font-weight: 400; color: var(--quiet); font-size: 12px; font-family: var(--mono, monospace); }
.identity-history { margin: .35rem 0 0; padding-left: 1.2rem; color: var(--quiet); }
.raw-link-history { list-style: none; margin: .35rem 0 0; padding: 0; display: grid; gap: .3rem; }
.raw-link-history li { display: grid; gap: .2rem; padding: .35rem .6rem; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface); }
.raw-link-history .raw-link-note { color: var(--quiet); }
.raw-link-history .button { justify-self: start; }

/* Wave 2: Deal Desk, Record a buy, Sales and the Show table lay out to their boards. */

.show-panel { display: flex; --outline-display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.show-panel[hidden] { display: none; }
.show-find { display: flex; align-items: center; gap: 8px; }
.show-find label { flex: none; color: var(--muted); font: 600 10.5px var(--sans); letter-spacing: .07em; text-transform: uppercase; }
.show-find input { flex: 1; min-width: 0; }
.show-head { display: flex; align-items: center; gap: 12px; margin-top: 4px; }
.show-head h2 { margin: 0; font-size: 13px; font-weight: 600; }
.show-head-actions { margin-left: auto; }

.desk-board .desk-sale-title { margin: 0; font-size: 14px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.desk-board .desk-sale-state { margin: 0; color: var(--ink-2); font-size: 12px; }
.desk-board .desk-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.desk-board .desk-actions:empty { display: none; }
.desk-board .review-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.desk-board .detail-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.desk-board .detail-grid > div { display: contents; }
dialog.buy-dialog { width: min(66rem, 94vw); height: auto; max-height: 92vh; margin: auto; border: 1px solid var(--hairline); border-radius: var(--radius-control); background: var(--surface); }
dialog.buy-dialog::backdrop { background: rgba(10, 13, 14, .82); }
.buy-form { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(16rem, 1fr); gap: 16px; padding: 16px; align-items: start; }
.buy-main { display: grid; gap: 14px; min-width: 0; }
.buy-step { display: grid; gap: 10px; padding: 12px 14px; background: var(--ground); border: 1px solid var(--hairline); border-radius: var(--radius-well); }
.buy-step h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; font-weight: 600; }
.buy-num { display: grid; place-items: center; width: 20px; height: 20px; color: var(--emerald); border: 1px solid var(--emerald); border-radius: 50%; font: 600 11px var(--mono); }
.buy-summary { display: grid; gap: 10px; position: sticky; top: 0; padding: 12px 14px; background: var(--rail); border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--emerald); border-radius: var(--radius-well); }
.buy-summary .water { background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-well); }
.buy-summary .water > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 28px; padding: 0 10px; color: var(--ink-2); border-bottom: 1px solid var(--divider); }
.buy-summary .water > div b { color: var(--ink); font: 500 12.5px var(--mono); }
.buy-summary .water > div.tot { min-height: 32px; color: var(--ink); font-weight: 600; border-bottom: 0; }
.buy-summary .button { width: 100%; justify-content: center; }
.buy-step [data-cost-row] { align-items: end; }
.buy-step fieldset { display: grid; gap: 8px; padding: 10px 12px 12px; }
.buy-step fieldset .button { justify-self: start; }
.buy-step .arrival-choice { border: 0; padding: 0; }
.buy-step .arrival-options { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.buy-step [data-card-row] { border: 1px solid var(--hairline); border-radius: var(--radius-well); padding: 8px 10px 10px; display: grid; gap: 8px; }
.buy-step [data-card-row] .card-row-main { display: grid; grid-template-columns: minmax(0, 1fr) 7rem auto; gap: 8px; align-items: end; }
@media (max-width: 860px) { .buy-step [data-card-row] .card-row-main { grid-template-columns: minmax(0, 1fr) 6rem; } .buy-step [data-card-row] .card-row-main .button { grid-column: 1 / -1; } }
.app-shell #sales-rows td:last-child, .app-shell #sales-panel table[aria-label="Sales ledger"] th:last-child { display: none; }
.app-shell table:has(> #purchase-rows), .app-shell table:has(> #sales-rows) { table-layout: fixed; width: 100%; }
.app-shell table:has(> #purchase-rows) th:nth-child(2) { width: 112px; }
.app-shell table:has(> #purchase-rows) th:nth-child(3) { width: 132px; }
.app-shell table:has(> #purchase-rows) th:nth-child(4) { width: 64px; }
.app-shell table:has(> #sales-rows) th:nth-child(2) { width: 120px; }
.app-shell table:has(> #sales-rows) th:nth-child(3) { width: 84px; }
.app-shell table:has(> #sales-rows) th:nth-child(4) { width: 92px; }
.app-shell table:has(> #sales-rows) th:nth-child(5) { width: 96px; }
.app-shell table:has(> #sales-rows) th:nth-child(6) { width: 84px; }
.app-shell #sales-rows td { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 860px) { .buy-form { grid-template-columns: minmax(0, 1fr); } .buy-summary { position: static; } }