:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --helm-blue: #0b5cab;
  --helm-blue-dark: #083f78;
  --helm-blue-light: #e7f1fb;
  --helm-page: #f4f7fa;
  --helm-surface: #fff;
  --helm-text: #17202d;
  --helm-muted: #556273;
  --helm-border: #c7d1dc;
  --helm-focus: #ffbf47;
  --helm-success: #167347;
  --helm-success-bg: #e8f5ee;
  --helm-warning: #935000;
  --helm-warning-bg: #fff2d9;
  --helm-danger: #b42318;
  --helm-danger-dark: #8d1b13;
  --helm-danger-bg: #fdecea;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --radius-sm: 0.4rem;
  --radius-md: 0.7rem;
  --radius-lg: 1rem;
  --shadow-sm: 0 0.15rem 0.55rem rgb(23 32 45 / 9%);
  --shadow-lg: 0 1rem 3rem rgb(23 32 45 / 24%);
  --control-height: 2.875rem;
  --content-width: 78rem;
  color: var(--helm-text);
  background: var(--helm-page);
}

* { box-sizing: border-box; }
html { min-width: 20rem; }
body { min-height: 100vh; margin: 0; line-height: 1.5; }
body.nav-open { overflow: hidden; }
button, input, select, textarea { font: inherit; }
a { color: var(--helm-blue-dark); }
h1, h2, h3 { margin-block: 0 0.6em; line-height: 1.18; }
h1 { font-size: clamp(1.8rem, 4vw, 2.5rem); }
h2 { font-size: clamp(1.3rem, 2.5vw, 1.65rem); }
p { margin-block: 0 1rem; }
svg.icon { width: 1.35rem; height: 1.35rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

:focus-visible { outline: 3px solid var(--helm-focus); outline-offset: 3px; }
.skip-link { position: fixed; top: 0.5rem; left: 0.5rem; z-index: 100; padding: 0.65rem 0.9rem; color: #fff; background: var(--helm-blue-dark); border-radius: var(--radius-sm); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.eyebrow { margin: 0 0 var(--space-2); color: var(--helm-blue-dark); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* FOH catalogue and navigation remain scoped to this tool. */
.foh-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1rem; }
.foh-breadcrumbs li + li::before { content: '›'; color: var(--helm-muted); margin-right: .5rem; }
.foh-layout .form-submit-bar { position: static; }
.foh-layout .foh-category { padding: .4rem 1rem; }
.foh-category summary > span { color: var(--helm-muted); font-size: .85rem; margin-left: .5rem; }
.foh-product-row { display: grid; grid-template-columns: minmax(160px,2fr) minmax(220px,2fr) minmax(80px,1fr) 90px minmax(85px,1fr); align-items: center; gap: .75rem; padding: .65rem 0; border-top: 1px solid var(--helm-border); }
.foh-row-product, .foh-row-price, .foh-row-cost { display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.foh-row-product span, .foh-row-price > span, .foh-row-cost > span, .foh-row-pack dt { font-size: .8rem; color: var(--helm-muted); }
.foh-row-pack { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .5rem; margin: 0; }
.foh-row-pack dd { margin: 0; overflow-wrap: anywhere; }
.foh-row-quantity { margin: 0; font-size: .8rem; }
.foh-row-quantity input { width: 100%; min-width: 0; }
.foh-layout .form-submit-bar { gap: .75rem; flex-wrap: wrap; align-items: center; }
@media (max-width: 800px) {
  .foh-product-row { grid-template-columns: minmax(0,1fr) 85px minmax(75px,1fr); gap: .5rem .75rem; }
  .foh-row-product, .foh-row-pack { grid-column: 1 / -1; }
  .foh-row-product { flex-direction: row; justify-content: space-between; gap: .5rem; }
}
.foh-email-evidence { white-space: pre-wrap; overflow-wrap: anywhere; }
.foh-layout details > summary { cursor: pointer; min-height: 44px; padding: .75rem 0; }

/* FOH operational controls and compact administration. */
.foh-layout button:disabled { opacity: .5; cursor: not-allowed; }
.foh-price-row { display: grid; grid-template-columns: minmax(0, 1fr) 130px 150px; align-items: center; gap: 1rem; padding: .65rem 0; border-top: 1px solid var(--helm-border); }
.foh-new-price { margin: 0; font-size: .8rem; }
.foh-new-price input { width: 100%; min-width: 0; }
.foh-event-log ol { list-style: none; margin: 0; padding: 0; }
.foh-event-log li + li { border-top: 1px solid var(--helm-border); }
.foh-event-log summary { font-size: .9rem; overflow-wrap: anywhere; }
.foh-event-log time { color: var(--helm-muted); }
@media (max-width: 600px) {
  .foh-price-row { grid-template-columns: minmax(0, 1fr) minmax(100px, 1fr); gap: .5rem; }
  .foh-price-row .foh-row-product { grid-column: 1 / -1; flex-direction: column; gap: .15rem; }
}