:root {
  --bg: #f5f2ea;
  --bg-deep: #ede8dd;
  --surface: rgba(255, 255, 255, 0.9);
  --surface-solid: #fff;
  --surface-soft: #faf8f3;
  --ink: #272531;
  --muted: #777385;
  --line: #e4dfd4;
  --line-strong: #d5cec0;
  --primary: #6f5bd3;
  --primary-deep: #5845b5;
  --primary-soft: #efebff;
  --success: #248a63;
  --success-soft: #e8f7f0;
  --warning: #c87a21;
  --warning-soft: #fff3df;
  --danger: #c74b5c;
  --danger-soft: #fdecef;
  --info: #3577b8;
  --info-soft: #e9f3ff;
  --shadow: 0 14px 42px rgba(43, 38, 61, 0.08);
  --shadow-soft: 0 7px 24px rgba(43, 38, 61, 0.06);
  --radius-lg: 22px;
  --radius-md: 15px;
  --radius-sm: 10px;
  --sidebar-width: 260px;
  --topbar-height: 84px;
}

/* Professional access factory */
.professional-access-workspace { display: grid; gap: 18px; }
.professional-access-header, .professional-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.professional-access-header h1, .professional-access-create h2, .professional-access-list h2, .professional-confirmations h2, .professional-credentials h2 { margin: 3px 0 5px; }
.professional-access-header p, .professional-access-create > p, .professional-section-heading p, .professional-credentials p { margin: 0; color: var(--muted); line-height: 1.45; }
.professional-access-grid { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(560px, 2fr); gap: 16px; align-items: start; }
.professional-access-create, .professional-access-list, .professional-confirmations, .professional-credentials, .professional-access-error { border: 1px solid var(--line); border-radius: 18px; background: var(--surface-solid); box-shadow: var(--shadow-soft); }
.professional-access-create, .professional-access-list, .professional-confirmations { padding: 18px; }
.professional-access-create form { display: grid; gap: 13px; margin-top: 17px; }
.professional-access-create label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750; }
.professional-access-create input, .professional-access-create select, .professional-credentials input { width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--ink); padding: 9px 11px; }
.professional-access-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.professional-discount-field { display: grid; grid-template-columns: 90px 1fr; gap: 8px; align-items: center; }
.professional-discount-field b { min-height: 44px; display: flex; align-items: center; padding: 8px 11px; border-radius: 11px; background: var(--primary-soft); color: var(--primary-deep); }
.professional-access-create form > small { color: var(--muted); line-height: 1.45; }
.professional-access-row { display: grid; grid-template-columns: minmax(180px, 1.4fr) minmax(150px, 1fr) minmax(170px, 1fr) auto; gap: 12px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
.professional-access-row:last-child { border-bottom: 0; }
.professional-access-row > div:not(.professional-access-actions) { min-width: 0; display: grid; gap: 3px; }
.professional-access-row span:not(.status-chip), .professional-confirmation-row span:not(.status-chip) { color: var(--muted); font-size: 10px; text-transform: uppercase; font-weight: 800; letter-spacing: .05em; }
.professional-access-row small, .professional-confirmation-row small { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.professional-access-actions { display: flex; gap: 6px; }
.professional-access-actions button { border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--primary-deep); padding: 8px 10px; font-weight: 750; }
.professional-confirmations { display: grid; gap: 4px; }
.professional-confirmation-card { border-top: 1px solid var(--line); }
.professional-confirmation-row { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid var(--line); }
.professional-confirmation-card .professional-confirmation-row { border-top: 0; }
.professional-confirmation-row > div { min-width: 0; display: grid; gap: 3px; }
.professional-confirmation-details { margin: -4px 0 12px; border: 1px solid #e6e0ef; border-radius: 12px; background: #faf9fd; }
.professional-confirmation-details summary { padding: 11px 13px; color: var(--primary-deep); font-size: 12px; font-weight: 800; cursor: pointer; }
.professional-confirmation-lines { display: grid; padding: 0 13px; }
.professional-confirmation-line { display: grid; grid-template-columns: minmax(180px, 1.5fr) 70px 120px 120px auto; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid #e9e4ef; }
.professional-confirmation-line > div { min-width: 0; display: grid; gap: 2px; }
.professional-confirmation-line small { color: var(--muted); font-size: 10px; }
.professional-confirmation-response { display: grid; gap: 10px; margin: 10px 13px 13px; padding: 13px; border-radius: 11px; background: #fff; }
.professional-confirmation-response label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 800; }
.professional-confirmation-response textarea { width: 100%; min-height: 76px; resize: vertical; border: 1px solid var(--line); border-radius: 10px; padding: 10px; font: inherit; }
.professional-confirmation-response > div { display: flex; flex-wrap: wrap; gap: 7px; }
.professional-confirmation-response > small { color: var(--warning); }
.professional-response-note { display: grid; gap: 3px; margin: 10px 13px 13px; padding: 12px; border-radius: 10px; background: var(--warning-soft); color: #76501d; }
.professional-credentials { display: grid; grid-template-columns: 1.2fr 1.3fr 140px auto; gap: 14px; align-items: end; padding: 18px; border-color: #cfc5fa; background: linear-gradient(135deg, #fbf9ff, #fff); }
.professional-credentials label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 800; }
.professional-credentials > div:last-child { display: flex; gap: 7px; }
.professional-access-error { display: flex; align-items: center; gap: 14px; padding: 15px 18px; border-color: #f1d299; background: #fff9eb; }
.professional-access-error span { flex: 1; color: #84601a; }
@media (max-width: 1100px) {
  .professional-access-grid { grid-template-columns: 1fr; }
  .professional-credentials { grid-template-columns: 1fr 1fr; }
  .professional-access-row { grid-template-columns: 1.4fr 1fr 1fr; }
  .professional-access-actions { grid-column: 1/-1; }
}
@media (max-width: 720px) {
  .professional-access-header { display: grid; }
  .professional-credentials, .professional-access-row, .professional-confirmation-row { grid-template-columns: 1fr; }
  .professional-credentials > div:last-child, .professional-access-error { align-items: stretch; flex-direction: column; }
  .professional-access-actions { grid-column: auto; }
  .professional-confirmation-line { grid-template-columns: 1fr 70px; }
  .professional-confirmation-line > div:nth-of-type(n+2), .professional-confirmation-line > .status-chip { grid-column: 1/-1; }
}

/* Commercial quotes: persistent internal center and immutable snapshot detail. */
.quote-workspace { min-height: calc(100vh - 92px); padding: 18px; background: #f7f6f2; color: var(--ink); }
.quote-center { display: grid; align-content: start; gap: 12px; }
.quote-center-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; border: 1px solid #e4dfd5; border-radius: 18px; background: #fff; }
.quote-center-header h1 { margin: 3px 0 4px; font-size: 25px; }
.quote-center-header p { margin: 0; color: var(--muted); font-size: 11px; }
.quote-center-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 3px; }
.quote-center-tabs button { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 11px; border: 1px solid #ded8e8; border-radius: 10px; background: #fff; color: #645d71; font: inherit; font-size: 10px; font-weight: 800; white-space: nowrap; cursor: pointer; }
.quote-center-tabs button.active { border-color: #a996f2; background: var(--primary-soft); color: var(--primary-deep); }
.quote-center-tabs button b { min-width: 18px; padding: 2px 5px; border-radius: 99px; background: #f1eef7; font-size: 8px; text-align: center; }
.quote-center-toolbar { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid #e4dfd5; border-radius: 13px; background: #fff; }
.quote-center-toolbar label { flex: 1; }
.quote-center-toolbar input { width: 100%; min-height: 40px; padding: 9px 12px; border: 1px solid #ded8e5; border-radius: 10px; color: var(--ink); font: inherit; font-size: 11px; }
.quote-center-toolbar > span { color: var(--muted); font-size: 10px; white-space: nowrap; }
.quote-center-list { display: grid; gap: 8px; }
.quote-center-row { overflow: hidden; border: 1px solid #e3dee8; border-radius: 13px; background: #fff; }
.quote-center-main { display: grid; grid-template-columns: 1.1fr 1.3fr .9fr .65fr auto; align-items: center; gap: 14px; width: 100%; min-height: 72px; padding: 11px 14px; border: 0; background: transparent; color: var(--ink); text-align: left; cursor: pointer; }
.quote-center-main:hover { background: #faf8ff; }
.quote-center-main > span:not(.status-chip) { display: grid; gap: 3px; min-width: 0; }
.quote-center-main strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.quote-center-main small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.quote-center-main b { color: #534b62; font-size: 8px; }
.quote-center-actions { display: flex; gap: 4px; padding: 6px 10px; border-top: 1px solid #eeebf1; }
.quote-center-actions button { padding: 4px 7px; border: 0; background: transparent; color: var(--primary-deep); font: inherit; font-size: 8px; font-weight: 800; cursor: pointer; }
.quote-detail-workspace { padding-top: 10px; }
.quote-detail-header { display: grid; grid-template-columns: auto minmax(180px, auto) 1fr auto; align-items: center; gap: 16px; padding: 11px 14px; border: 1px solid #e3dee8; border-radius: 15px; background: #fff; }
.quote-detail-header > div:nth-child(2) { display: grid; grid-template-columns: auto auto; align-items: center; justify-content: start; gap: 4px 8px; }
.quote-detail-header h1 { grid-column: 1; margin: 0; font-size: 18px; }
.quote-detail-header .panel-kicker { grid-column: 1 / -1; }
.quote-detail-header-facts { display: flex; align-items: center; justify-content: center; gap: 24px; }
.quote-detail-header-facts span { display: grid; gap: 2px; }
.quote-detail-header-facts small { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.quote-detail-header-facts strong { font-size: 9px; }
.quote-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; align-items: start; gap: 12px; margin-top: 12px; }
.quote-detail-layout > main,
.quote-detail-summary { border: 1px solid #e3dee8; border-radius: 15px; background: #fff; }
.quote-detail-lines-heading { display: flex; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid #ece8ef; }
.quote-detail-lines-heading span { font-size: 11px; font-weight: 800; }
.quote-detail-lines-heading small { color: var(--muted); font-size: 9px; }
.quote-detail-lines { display: grid; }
.quote-detail-line { display: grid; grid-template-columns: minmax(230px, 1.65fr) .45fr .8fr .75fr .75fr .8fr 1fr; align-items: center; gap: 10px; min-height: 86px; padding: 9px 14px; border-bottom: 1px solid #efecf1; }
.quote-detail-line > div:not(.quote-detail-product) { display: grid; gap: 3px; min-width: 0; }
.quote-detail-line small { color: var(--muted); font-size: 7px; }
.quote-detail-line strong { font-size: 9px; }
.quote-detail-line span { color: #655d72; font-size: 7px; }
.quote-detail-product { display: grid; grid-template-columns: 54px minmax(0, 1fr); align-items: center; gap: 9px; }
.quote-detail-product img,
.quote-detail-image-fallback { width: 54px; height: 48px; object-fit: contain; border: 1px solid #ece8ef; border-radius: 8px; background: #fafafa; }
.quote-detail-image-fallback { display: grid; place-items: center; color: var(--muted); font-size: 7px; }
.quote-detail-product > div { display: grid; gap: 3px; min-width: 0; }
.quote-detail-product strong,
.quote-detail-product span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quote-detail-availability span { color: #17865b; font-weight: 800; }
.quote-detail-notes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; }
.quote-detail-notes > div { display: grid; gap: 4px; padding: 10px; border-radius: 10px; background: #faf9fc; }
.quote-detail-notes small { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.quote-detail-notes strong { font-size: 9px; }
.quote-detail-summary { display: grid; align-content: start; gap: 12px; padding: 15px; }
.quote-detail-summary > div { display: grid; gap: 3px; padding-bottom: 10px; border-bottom: 1px solid #ece8ef; }
.quote-detail-summary small { color: var(--muted); font-size: 8px; }
.quote-detail-summary strong { font-size: 14px; }
.quote-detail-summary span { color: #665d73; font-size: 8px; }
.quote-detail-summary .quote-detail-final strong { color: var(--primary-deep); font-size: 24px; }
.quote-no-reservation { padding: 9px !important; border: 1px solid #f1dba6 !important; border-radius: 9px; background: #fff9e9; color: #8a671a; font-size: 9px; font-weight: 800; text-align: center; }
.quote-detail-actions { display: grid; gap: 6px; }
.quote-revision-history { display: grid; gap: 6px; padding-top: 4px; }
.quote-revision-history > strong { font-size: 9px; }
.quote-revision-history > div { display: grid; grid-template-columns: auto 1fr auto; gap: 6px; color: #625a70; font-size: 7px; }
.commercial-saved-quotes .commercial-saved-quotes-all { display: block; width: 100%; min-height: 30px; border-style: dashed; color: var(--primary-deep); font-weight: 800; text-align: center; }
.commercial-cart-total { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; }
.commercial-cart-total small { grid-column: 1 / -1; }

/* Quote document: exact client-facing projection and native PDF print surface. */
.app-shell.quote-document-route { display: block; background: #eceaf0; }
.app-shell.quote-document-route .sidebar,
.app-shell.quote-document-route .topbar,
.app-shell.quote-document-route .global-breadcrumb-bar,
.app-shell.quote-document-route .environment-banner,
.app-shell.quote-document-route .mobile-nav { display: none !important; }
body.quote-document-active .mobile-nav,
body.quote-document-active .mobile-bottom-nav { display: none !important; }
.app-shell.quote-document-route .main-column { min-width: 0; }
.app-shell.quote-document-route .content-area { padding: 0; }
.quote-document-page { min-height: 100vh; padding: 18px 18px 48px; background: #eceaf0; }
.quote-document-toolbar { position: sticky; top: 10px; z-index: 4; display: grid; width: min(1060px, 100%); align-items: center; padding: 9px; margin: 0 auto 14px; border: 1px solid #d8d2df; border-radius: 14px; background: rgba(255,255,255,.96); box-shadow: 0 12px 30px rgba(45,35,63,.1); grid-template-columns: auto 1fr auto auto; gap: 8px; backdrop-filter: blur(16px); }
.quote-document-toolbar > div { display: grid; justify-items: center; gap: 2px; }
.quote-document-toolbar > div span { color: var(--primary-deep); font-size: 10px; font-weight: 850; }
.quote-document-toolbar > div small { color: var(--muted); font-size: 8px; }
.quote-document-sheet { width: min(210mm, calc(100vw - 36px)); min-height: 297mm; padding: 16mm 15mm 12mm; margin: 0 auto; color: #25212b; background: #fff; box-shadow: 0 22px 60px rgba(34,27,43,.14); font-family: Inter, Arial, sans-serif; }
.quote-document-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 18px; border-bottom: 2px solid #5f45d2; }
.quote-document-brand { display: flex; align-items: center; gap: 12px; }
.quote-document-logo { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #8a72ee, #5637c7); font-size: 18px; font-weight: 900; }
.quote-document-brand > div { display: grid; gap: 4px; }
.quote-document-brand strong { font-size: 17px; }
.quote-document-brand small { max-width: 430px; color: #756e7d; font-size: 8px; line-height: 1.45; white-space: pre-line; }
.quote-document-number { display: grid; justify-items: end; gap: 3px; text-align: right; }
.quote-document-number span { color: #6952d0; font-size: 8px; font-weight: 900; letter-spacing: 1.5px; }
.quote-document-number strong { font-size: 22px; }
.quote-document-number small { color: #827b89; font-size: 8px; }
.quote-document-parties { display: grid; padding: 18px 0; border-bottom: 1px solid #e7e2ea; grid-template-columns: 1.5fr .75fr .75fr; gap: 18px; }
.quote-document-parties > div { display: grid; align-content: start; gap: 4px; }
.quote-document-parties small,
.quote-document-line small { color: #877f8f; font-size: 7px; font-weight: 750; letter-spacing: .4px; text-transform: uppercase; }
.quote-document-parties strong { font-size: 11px; }
.quote-document-parties span { color: #6e6675; font-size: 8px; }
.quote-document-lines { margin-top: 18px; border: 1px solid #e3dee8; border-radius: 10px; overflow: hidden; }
.quote-document-table-head,
.quote-document-line { display: grid; align-items: center; grid-template-columns: minmax(240px, 1.6fr) .45fr .65fr .65fr .75fr; gap: 10px; }
.quote-document-table-head { min-height: 30px; padding: 0 12px; color: #716878; background: #f5f2fa; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.quote-document-line { min-height: 74px; padding: 9px 12px; border-top: 1px solid #ece8ef; break-inside: avoid; }
.quote-document-line > div:not(.quote-document-product) { display: grid; gap: 4px; }
.quote-document-line > div:not(.quote-document-product) small { display: none; }
.quote-document-line > div > strong { font-size: 9px; }
.quote-document-product { display: grid; align-items: center; min-width: 0; grid-template-columns: 52px minmax(0, 1fr); gap: 9px; }
.quote-document-product > img,
.quote-document-product > span { display: grid; width: 52px; height: 50px; place-items: center; object-fit: contain; border: 1px solid #eeeaf1; border-radius: 7px; color: #9a93a0; background: #faf9fb; font-size: 7px; }
.quote-document-product > div { display: grid; min-width: 0; gap: 3px; }
.quote-document-product strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.quote-document-product small { overflow: hidden; color: #766e7c; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.quote-document-product em { color: #6650c8; font-size: 7px; font-style: normal; font-weight: 750; }
.quote-document-availability strong { color: #187550; }
.quote-document-bottom { display: grid; align-items: start; margin-top: 20px; grid-template-columns: 1fr 250px; gap: 24px; }
.quote-document-conditions { padding: 13px; border-radius: 9px; background: #f8f6fa; }
.quote-document-conditions strong { display: block; margin-bottom: 7px; font-size: 9px; }
.quote-document-conditions p { margin: 4px 0 0; color: #6d6573; font-size: 7.5px; line-height: 1.45; }
.quote-document-total { display: grid; justify-items: end; padding: 13px 0; border-top: 2px solid #5f45d2; gap: 3px; text-align: right; }
.quote-document-total span { color: #756c7d; font-size: 8px; font-weight: 750; text-transform: uppercase; }
.quote-document-total strong { color: #5135c0; font-size: 25px; }
.quote-document-total small { font-size: 10px; font-weight: 750; }
.quote-document-total em { color: #8a828f; font-size: 7px; font-style: normal; }
.quote-document-sheet > footer { display: flex; justify-content: space-between; gap: 20px; padding-top: 12px; margin-top: 34px; border-top: 1px solid #e8e3eb; color: #8b8490; font-size: 7px; }

@media (max-width: 700px) {
  .quote-document-page { padding: 7px 7px 86px; }
  .quote-document-toolbar { position: static; grid-template-columns: 1fr 1fr; }
  .quote-document-toolbar > div { grid-column: 1 / -1; grid-row: 1; }
  .quote-document-toolbar .primary-button { grid-column: 1 / -1; }
  .quote-document-sheet { width: 100%; min-height: 0; padding: 20px 14px; }
  .quote-document-head { gap: 10px; }
  .quote-document-brand strong { font-size: 14px; }
  .quote-document-number strong { font-size: 17px; }
  .quote-document-parties { grid-template-columns: 1fr 1fr; gap: 12px; }
  .quote-document-parties > div:first-child { grid-column: 1 / -1; }
  .quote-document-table-head { display: none; }
  .quote-document-line { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .quote-document-line > div:not(.quote-document-product) small { display: block; }
  .quote-document-product { grid-column: 1 / -1; }
  .quote-document-availability { grid-column: 1 / -1; }
  .quote-document-bottom { grid-template-columns: 1fr; gap: 12px; }
  .quote-document-total { justify-items: start; text-align: left; }
  .quote-document-sheet > footer { flex-direction: column; }
}

@media print {
  @page { size: A4; margin: 10mm; }
  html, body { background: #fff !important; }
  .app-shell.quote-document-route { min-height: 100vh; background: #fff !important; }
  .quote-document-toolbar { display: none !important; }
  .quote-document-page { min-height: 100vh; padding: 0; background: #fff; }
  .quote-document-sheet { width: 100%; min-height: 277mm; padding: 0; box-shadow: none; }
  .quote-document-sheet > footer { margin-top: auto; }
}

@media (max-width: 1100px) {
  .quote-detail-header { grid-template-columns: auto 1fr auto; }
  .quote-detail-header-facts { grid-column: 2 / -1; justify-content: flex-start; }
  .quote-detail-layout { grid-template-columns: 1fr; }
  .quote-detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quote-detail-summary > .panel-kicker,
  .quote-detail-summary > .quote-detail-actions,
  .quote-detail-summary > .quote-revision-history { grid-column: 1 / -1; }
  .quote-detail-line { grid-template-columns: minmax(210px, 1.5fr) .45fr .75fr .75fr .75fr; }
  .quote-detail-line > div:nth-child(6),
  .quote-detail-availability { grid-column: span 2; }
}

@media (max-width: 700px) {
  .quote-workspace { min-height: calc(100vh - 60px); padding: 7px 7px 88px; }
  .quote-center-header { align-items: stretch; padding: 13px; }
  .quote-center-header h1 { font-size: 19px; }
  .quote-center-header p { font-size: 9px; }
  .quote-center-header .primary-button { align-self: center; padding-inline: 10px; font-size: 8px; }
  .quote-center-toolbar { padding: 7px; }
  .quote-center-main { grid-template-columns: 1fr auto; gap: 7px; min-height: 0; padding: 10px; }
  .quote-center-main > span:nth-child(2),
  .quote-center-main > span:nth-child(4) { display: none; }
  .quote-center-main > span:nth-child(3) { text-align: right; }
  .quote-center-main > .status-chip { grid-column: 1 / -1; justify-self: start; }
  .quote-center-actions { overflow-x: auto; }
  .quote-detail-header { grid-template-columns: auto 1fr; gap: 8px; padding: 8px; }
  .quote-detail-header > .primary-button { grid-column: 1 / -1; }
  .quote-detail-header-facts { grid-column: 1 / -1; gap: 12px; overflow-x: auto; }
  .quote-detail-layout { gap: 7px; margin-top: 7px; }
  .quote-detail-line { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 9px; }
  .quote-detail-product { grid-column: 1 / -1; }
  .quote-detail-line > div:nth-child(6),
  .quote-detail-availability { grid-column: auto; }
  .quote-detail-availability { grid-column: 1 / -1; }
  .quote-detail-notes { grid-template-columns: 1fr; }
  .quote-detail-summary { grid-template-columns: 1fr; }
  .quote-detail-summary > .panel-kicker,
  .quote-detail-summary > .quote-detail-actions,
  .quote-detail-summary > .quote-revision-history { grid-column: 1; }
}

/* Commercial projection v4: the Products explorer, with a public price footer. */
.catalog-card-title-button {
  display: -webkit-box;
  width: 100%;
  overflow: hidden;
  padding: 0;
  border: 0;
  background: transparent;
  color: #17152a;
  text-align: left;
  font: inherit;
  font-size: 13px;
  font-weight: 820;
  line-height: 1.32;
  cursor: pointer;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.catalog-card-title-button:hover,
.catalog-card-title-button:focus-visible { color: var(--primary-deep); }
.catalog-card-title-button:focus-visible { outline: 2px solid rgba(111,79,224,.25); outline-offset: 2px; border-radius: 4px; }
.purchase-card__image:is(button) { width: 100%; border: 0; border-bottom: 1px solid #eeeaf3; cursor: pointer; }

.app-shell.price-list-detail-active .topbar { min-height: 52px; height: 52px; padding-block: 5px; }
.app-shell.price-list-detail-active .topbar-context,
.app-shell.price-list-detail-active .global-breadcrumb-bar,
.app-shell.price-list-detail-active .environment-banner,
.app-shell.price-list-detail-active .env-mode-chip { display: none !important; }
.price-list-result { width: 100%; max-width: 1680px; padding: 0 0 20px; }
.price-list-explorer-bar {
  display: flex;
  min-height: 46px;
  align-items: center;
  gap: 7px;
  padding: 5px 0 6px;
}
.price-list-explorer-back {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 5px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  color: var(--primary-deep);
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}
.price-list-explorer-title { display: flex; min-width: 0; flex: 1; align-items: center; gap: 7px; }
.price-list-explorer-title > strong { overflow: hidden; color: #1d2432; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.price-list-explorer-title > small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.price-list-explorer-bar > .secondary-button,
.price-list-explorer-bar .commercial-cart-launch { min-height: 34px; padding: 6px 10px; font-size: 10px; }
.price-list-view-toggle { flex: 0 0 auto; }
.price-list-view-toggle button { min-height: 30px; padding: 5px 9px; font-size: 9px; }
.price-list-more { position: relative; }
.price-list-more summary { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: #5d5868; cursor: pointer; list-style: none; }
.price-list-more summary::-webkit-details-marker { display: none; }
.price-list-more > div { position: absolute; z-index: 8; top: 39px; right: 0; display: grid; min-width: 160px; gap: 3px; padding: 6px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: 0 12px 30px rgba(30,25,50,.14); }
.price-list-more > div button { min-height: 32px; padding: 6px 8px; border: 0; border-radius: 7px; background: transparent; color: var(--ink); text-align: left; font: inherit; font-size: 10px; font-weight: 720; cursor: pointer; }
.price-list-more > div button:hover { background: var(--surface-soft); }

.commercial-catalog-projection { overflow: visible; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: none; }
.commercial-sticky-controls { top: 0; z-index: 6; padding: 8px 10px 6px; border-radius: 13px 13px 0 0; background: rgba(255,255,255,.97); }
.commercial-sticky-controls .catalog-filter-bar { grid-template-columns: minmax(360px, 1fr) auto auto; }
.commercial-sticky-controls .search-box input { min-height: 40px; }
.commercial-sticky-controls .catalog-search-history { margin-top: 6px; }
.commercial-sticky-controls .catalog-quick-filters { margin-top: 5px; }
.commercial-sticky-controls .catalog-quick-filters button small { color: inherit; font-size: 8px; opacity: .75; }
.commercial-catalog-projection .catalog-facet-browser { padding: 6px 10px 5px; border-top: 1px solid #f0edf4; border-bottom: 1px solid #eeeaf3; }
.commercial-catalog-projection .catalog-facet-row { min-height: 29px; }
.commercial-catalog-projection .catalog-facet-chip { min-height: 25px; padding-block: 3px; }
.commercial-result-toolbar { min-height: 39px; padding: 5px 10px; }
.commercial-page-controls { display: flex; align-items: center; gap: 5px; }
.commercial-page-controls > button { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--primary-deep); font-weight: 850; cursor: pointer; }
.commercial-page-controls > button:disabled { cursor: default; opacity: .35; }
.commercial-page-controls label { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 760; }
.commercial-page-controls select { height: 30px; padding: 4px 26px 4px 8px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); font-size: 10px; }
.commercial-list-layout { display: block; padding: 9px; }
.commercial-list-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 9px; }
.commercial-list-card { min-height: 0; border-radius: 14px; box-shadow: 0 3px 11px rgba(45,32,82,.045); }
.commercial-list-card { content-visibility: auto; contain-intrinsic-size: 215px 340px; }
.commercial-list-card .purchase-card__image { height: 116px; min-height: 116px; padding: 8px 14px; }
.commercial-list-card .purchase-card__image img { max-height: 96px; }
.commercial-list-card .purchase-card__image--empty span { width: 56px; height: 56px; font-size: 9px; }
.commercial-list-card .purchase-card__body { gap: 6px; padding: 9px; }
.commercial-list-card .purchase-card__identity { min-height: 38px; }
.commercial-list-card .purchase-card__identity > div > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.commercial-list-card .purchase-card__specs { min-height: 18px; flex-wrap: nowrap; overflow: hidden; }
.commercial-list-card .purchase-card__description { min-height: 39px; max-height: 39px; font-size: 9px; line-height: 1.4; -webkit-line-clamp: 3; }
.commercial-list-card .commercial-availability { display: inline-flex; max-width: 98px; min-height: 20px; align-items: center; overflow: hidden; margin: 0; padding: 3px 6px; border-radius: 999px; font-size: 7px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.commercial-list-card .commercial-price-row { min-height: 54px; margin-top: auto; padding: 7px 8px; border: 1px solid #ece7f6; border-radius: 10px; background: linear-gradient(135deg, #fbfaff, #f7f3ff); }
.commercial-list-card .commercial-price-row strong { font-size: 14px; }
.commercial-list-card .commercial-price-row span { font-size: 7px; }
.commercial-list-card .commercial-quantity input { width: 44px; height: 27px; }
.commercial-list-card .commercial-add-button { width: 100%; min-height: 31px; margin: 0; padding: 5px 8px; font-size: 8px; }
.commercial-list-card .commercial-private-layer { margin: 0; padding: 7px; }
.commercial-list-card .commercial-private-layer > div { font-size: 8px; }
.density-detailed .commercial-list-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.density-detailed .commercial-list-card .purchase-card__image { height: 150px; }
.density-detailed .commercial-list-card .purchase-card__description { min-height: 60px; max-height: 60px; font-size: 10px; -webkit-line-clamp: 4; }
.commercial-batch-sentinel { grid-column: 1 / -1; padding: 14px; color: var(--muted); font-size: 10px; text-align: center; }

@media (min-width: 1600px) {
  .density-compact .commercial-list-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (max-width: 920px) {
  .price-list-explorer-title > small { display: none; }
  .price-list-explorer-bar > .secondary-button[disabled],
  .price-list-more { display: none; }
  .commercial-sticky-controls .catalog-filter-bar { grid-template-columns: 1fr auto auto; }
  .commercial-sticky-controls .catalog-filter-bar .search-box { grid-column: 1 / -1; }
  .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .app-shell.price-list-detail-active .topbar { min-height: 48px; height: 48px; }
  .price-list-result { padding-bottom: 86px; }
  .price-list-explorer-bar { position: relative; min-height: 42px; gap: 5px; padding: 3px 0 4px; }
  .price-list-explorer-back { width: 34px; min-height: 32px; justify-content: center; padding: 4px; }
  .price-list-explorer-back span,
  .price-list-explorer-title .status-chip { display: none; }
  .price-list-explorer-title > strong { font-size: 14px; }
  .price-list-explorer-bar > .secondary-button:not(.commercial-cart-launch) { display: none; }
  .price-list-view-toggle button { min-height: 29px; padding-inline: 7px; }
  .price-list-explorer-bar .commercial-cart-launch { min-height: 32px; padding-inline: 8px; }
  .commercial-sticky-controls { padding: 7px; }
  .commercial-sticky-controls .catalog-filter-bar { display: grid; grid-template-columns: 1fr auto; gap: 6px; }
  .commercial-sticky-controls .catalog-filter-details summary,
  .commercial-sticky-controls .catalog-clear-button { min-height: 34px; padding-inline: 9px; }
  .commercial-sticky-controls .catalog-quick-filters { overflow-x: auto; flex-wrap: nowrap; }
  .commercial-sticky-controls .catalog-quick-filters button { flex: 0 0 auto; }
  .commercial-catalog-projection .catalog-facet-browser { padding-inline: 7px; }
  .commercial-catalog-projection .catalog-facet-row { grid-template-columns: 45px minmax(0, 1fr); }
  .commercial-catalog-projection .catalog-facet-label { font-size: 8px; }
  .commercial-result-toolbar { align-items: center; gap: 5px; padding-inline: 7px; }
  .commercial-result-toolbar .catalog-list-summary { font-size: 9px; }
  .commercial-result-toolbar .catalog-list-summary span { display: none; }
  .commercial-page-controls > button { display: none; }
  .commercial-page-controls label { font-size: 0; }
  .commercial-page-controls label::before { content: "Mostrar"; font-size: 8px; }
  .commercial-list-layout { padding: 7px; }
  .commercial-list-grid,
  .density-detailed .commercial-list-grid { grid-template-columns: 1fr; gap: 7px; }
  .commercial-list-card,
  .density-detailed .commercial-list-card { display: grid; grid-template-columns: 94px minmax(0, 1fr); }
  .commercial-list-card .purchase-card__image,
  .density-detailed .commercial-list-card .purchase-card__image { width: 94px; height: 100%; min-height: 150px; max-height: none; padding: 7px; border-right: 1px solid #eeeaf3; border-bottom: 0; }
  .commercial-list-card .purchase-card__image img { max-height: 92px; }
  .commercial-list-card .purchase-card__body { min-width: 0; gap: 5px; padding: 8px; }
  .commercial-list-card .purchase-card__specs { display: none; }
  .commercial-list-card .purchase-card__description,
  .density-detailed .commercial-list-card .purchase-card__description { min-height: 26px; max-height: 26px; -webkit-line-clamp: 2; }
  .commercial-list-card .commercial-price-row { min-height: 48px; }
  .commercial-list-card .commercial-add-button { min-height: 30px; }
}

/* Shared Products + commercial-list explorer */
.catalog-explorer-layout {
  position: relative;
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  min-width: 0;
}
.catalog-explorer-main { min-width: 0; }
.catalog-category-nav {
  position: sticky;
  top: 132px;
  z-index: 8;
  display: grid;
  gap: 6px;
  max-height: calc(100vh - 154px);
  padding: 9px;
  overflow-y: auto;
  border: 1px solid #e4deec;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(36, 27, 62, .05);
}
.catalog-category-nav-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 2px 6px; }
.catalog-category-nav-heading > div { display: grid; gap: 1px; }
.catalog-category-nav-heading span { color: #837b8e; font-size: 8px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.catalog-category-nav-heading strong { color: #242033; font-size: 14px; }
.catalog-category-nav-heading > button { width: 25px; height: 25px; border: 1px solid #e4deeb; border-radius: 8px; background: #faf9fc; color: #716a7d; cursor: pointer; }
.catalog-category-all,
.catalog-category-item,
.catalog-subcategory-item {
  width: 100%; min-height: 35px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 5px; padding: 6px 7px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: #4f485a; font: inherit; text-align: left; cursor: pointer;
}
.catalog-category-all:hover,
.catalog-category-item:hover,
.catalog-subcategory-item:hover { background: #faf8ff; color: var(--primary-deep); }
.catalog-category-all.active,
.catalog-category-item.active,
.catalog-subcategory-item.active { border-color: #cdbff2; background: var(--primary-soft); color: var(--primary-deep); }
.catalog-category-all span,
.catalog-category-item span,
.catalog-subcategory-item span { min-width: 0; overflow: hidden; font-size: 10px; font-weight: 790; text-overflow: ellipsis; white-space: nowrap; }
.catalog-category-all small,
.catalog-category-item small,
.catalog-subcategory-item small { min-width: 23px; padding: 2px 5px; border-radius: 999px; background: #f0edf5; color: #716a7b; font-size: 8px; font-weight: 850; text-align: center; }
.catalog-category-all em,
.catalog-category-item em { color: #2d8152; font-size: 7px; font-style: normal; font-weight: 790; white-space: nowrap; }
.catalog-category-list { display: grid; gap: 1px; }
.catalog-subcategory-list { display: grid; gap: 2px; padding-top: 3px; border-top: 1px solid #eeeaf2; }
.catalog-subcategory-list > div { display: grid; gap: 4px; padding: 6px 5px; }
.catalog-subcategory-list > div strong { font-size: 11px; }
.catalog-subcategory-list > div button { width: max-content; padding: 0; border: 0; background: transparent; color: var(--primary-deep); font: inherit; font-size: 8px; font-weight: 800; cursor: pointer; }
.catalog-subcategory-item { grid-template-columns: minmax(0, 1fr) auto; padding-left: 12px; }
.catalog-category-trigger { display: none; min-height: 34px; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid #ddd6e8; border-radius: 10px; background: #fff; color: #514a5d; font: inherit; font-size: 10px; font-weight: 800; cursor: pointer; }
.catalog-category-backdrop { display: none; }
.catalog-explorer-layout.category-nav-collapsed { grid-template-columns: minmax(0, 1fr); }
.catalog-explorer-layout.category-nav-collapsed > .catalog-category-nav { display: none; }
.catalog-explorer-layout.category-nav-collapsed > .catalog-category-trigger { display: inline-flex; width: max-content; margin-bottom: 6px; }
.catalog-facet-label { width: 92px; }
.catalog-facet-row { grid-template-columns: 102px minmax(0, 1fr); }
.catalog-brand-chip { min-height: 37px; padding-inline: 13px; border-radius: 11px; background: #fff; box-shadow: 0 2px 8px rgba(42, 32, 68, .04); }
.catalog-brand-chip > span { font-size: 11px; font-weight: 850; }
.catalog-brand-chip.has-logo { min-width: 94px; justify-content: center; }
.catalog-brand-chip.has-logo > img { width: 76px; height: 22px; object-fit: contain; filter: grayscale(1); opacity: .8; }
.catalog-brand-chip.has-logo:hover > img,
.catalog-brand-chip.has-logo.active > img { filter: none; opacity: 1; }
.catalog-facet-more { min-height: 31px; flex: 0 0 auto; padding: 0 9px; border: 1px dashed #bdb0d1; border-radius: 10px; background: transparent; color: var(--primary-deep); font: inherit; font-size: 9px; font-weight: 820; cursor: pointer; }

/* Four-price commercial card */
.commercial-list-card .purchase-card__image { height: 94px; min-height: 94px; }
.commercial-list-card .purchase-card__image img { max-height: 76px; }
.commercial-list-card .purchase-card__body { gap: 5px; padding: 8px; }
.commercial-list-card .purchase-card__description { min-height: 26px; max-height: 26px; -webkit-line-clamp: 2; }
.commercial-levels-heading { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding-top: 3px; border-top: 1px solid #eeeaf3; }
.commercial-levels-heading strong { font-size: 9px; }
.commercial-levels-heading span { color: #9b4e32; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.commercial-price-levels { display: grid; gap: 3px; }
.commercial-level-row { min-height: 38px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 5px; padding: 4px 5px 4px 7px; border: 1px solid #e5dfec; border-radius: 8px; background: #fff; color: #272134; font: inherit; text-align: left; cursor: pointer; }
.commercial-level-row:hover { border-color: #b9a7e9; background: #fcfaff; }
.commercial-level-row.selected { border-color: #9e88e5; background: #f4f0ff; box-shadow: inset 3px 0 0 var(--primary); }
.commercial-level-row.unavailable { opacity: .56; cursor: default; }
.commercial-level-row > span { min-width: 0; display: grid; gap: 1px; }
.commercial-level-row > span strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.commercial-level-row > span small { color: #756d80; font-size: 7px; font-weight: 730; }
.commercial-level-row > b { font-size: 10px; white-space: nowrap; }
.commercial-level-row > em { padding: 4px 6px; border-radius: 6px; background: var(--primary); color: #fff; font-size: 7px; font-style: normal; font-weight: 850; }
.commercial-card-order { display: flex; align-items: end; justify-content: space-between; gap: 7px; padding: 6px 7px; border-radius: 9px; background: #f7f4ff; }
.commercial-card-order > div { min-width: 0; display: grid; gap: 1px; text-align: right; }
.commercial-card-order > div strong { font-size: 12px; }
.commercial-card-order > div span { color: #777080; font-size: 6px; white-space: nowrap; }
.commercial-card-order .commercial-quantity input { width: 52px; height: 28px; }
.commercial-level-access { display: grid; gap: 12px; }
.commercial-level-access-price { display: grid; gap: 3px; padding: 13px; border-radius: 12px; background: #f7f4ff; }
.commercial-level-access-price span,
.commercial-level-access > label > span,
.commercial-level-stock span { color: #746c80; font-size: 9px; font-weight: 820; text-transform: uppercase; }
.commercial-level-access-price strong { font-size: 24px; }
.commercial-level-access-price small { color: #5e5769; font-size: 10px; }
.commercial-level-live-total { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 13px; border: 1px solid #ddd4f4; border-radius: 12px; background: var(--primary-soft); }
.commercial-level-live-total > span { color: var(--muted); font-size: 12px; font-weight: 750; }
.commercial-level-live-total > strong { color: var(--primary-deep); font-size: 22px; }
.commercial-level-live-total > small { grid-column: 1 / -1; color: var(--primary-deep); }
.commercial-level-entitlement { display: grid; gap: 4px; padding: 11px; border: 1px solid #e5d6aa; border-radius: 11px; background: #fffaf0; }
.commercial-level-entitlement.active { border-color: #b9e0c8; background: #f0faf4; }
.commercial-level-entitlement strong { font-size: 13px; }
.commercial-level-entitlement span { color: #696170; font-size: 10px; }
.commercial-level-access > label { display: grid; gap: 6px; }
.commercial-level-access > label input { min-height: 44px; padding: 0 12px; border: 1px solid #d8d1e3; border-radius: 10px; font-size: 16px; }
.commercial-level-access > label small { color: #6e6677; font-size: 9px; }
.commercial-level-stock { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; border: 1px solid #e8e3ed; border-radius: 10px; }
.price-level-editor-intro { display: grid; gap: 3px; margin-bottom: 12px; padding: 11px; border-radius: 11px; background: #f7f4ff; }
.price-level-editor-intro span { color: #696171; font-size: 10px; }
.price-level-editor-grid { display: grid; gap: 8px; }
.price-level-editor-row { display: grid; grid-template-columns: 1.1fr 1.4fr .7fr .7fr .7fr auto; align-items: end; gap: 7px; padding: 9px; border: 1px solid #e4deeb; border-radius: 11px; }
.price-level-editor-row label { display: grid; gap: 4px; }
.price-level-editor-row label > span { color: #6d6578; font-size: 8px; font-weight: 800; }
.price-level-editor-row input,
.price-level-editor-row select { min-width: 0; min-height: 36px; padding: 0 8px; border: 1px solid #d9d2e4; border-radius: 8px; background: #fff; font: inherit; font-size: 9px; }
.price-level-editor-active { min-height: 36px; display: flex !important; align-items: center; gap: 5px !important; }
.price-level-editor-active input { min-height: 0; }

@media (max-width: 1024px) {
  .catalog-explorer-layout { display: block; }
  .catalog-category-trigger { display: inline-flex; margin: 0 0 7px; }
  .catalog-category-nav { position: fixed; top: 0; bottom: 0; left: 0; z-index: 1002; width: min(300px, 86vw); max-height: none; border-radius: 0 16px 16px 0; transform: translateX(-105%); transition: transform .18s ease; }
  .catalog-category-backdrop { position: fixed; inset: 0; z-index: 1001; background: rgba(24, 18, 38, .36); opacity: 0; pointer-events: none; transition: opacity .18s ease; }
  .catalog-explorer-layout.category-nav-open > .catalog-category-nav { display: grid; transform: translateX(0); }
  .catalog-explorer-layout.category-nav-open > .catalog-category-backdrop { display: block; opacity: 1; pointer-events: auto; }
  .catalog-explorer-layout.category-nav-collapsed > .catalog-category-trigger { display: inline-flex; }
  .price-level-editor-row { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 700px) {
  .catalog-facet-row { grid-template-columns: 1fr; }
  .catalog-facet-label { width: auto; }
  .catalog-brand-chip { min-height: 36px; }
  .commercial-list-card .purchase-card__image { width: 92px !important; min-height: 126px !important; }
  .commercial-levels-heading,
  .commercial-price-levels,
  .commercial-card-order,
  .commercial-private-layer { grid-column: 1 / -1; }
  .commercial-level-row { min-height: 40px; }
  .price-level-editor-row { grid-template-columns: 1fr; }
}

/* Price lists QA gate: compact catalog, safe cards and an off-canvas quote tray. */
.price-list-home-actions { display: flex; align-items: center; gap: 10px; }
.price-list-home-actions button b,
.commercial-cart-launch b { display: inline-grid; min-width: 22px; height: 22px; margin-left: 6px; place-items: center; border-radius: 999px; background: #eef0ff; color: #4740c4; font-size: 10px; }
.commercial-review-summary { display: flex; align-items: center; gap: 18px; margin-top: 18px; padding: 12px 15px; border: 1px solid #e2e6ed; border-radius: 13px; background: #fff; color: #697181; font-size: 12px; }
.commercial-review-summary span { white-space: nowrap; }
.commercial-review-summary b { color: #252d3e; font-size: 14px; }
.commercial-review-summary small { margin-left: auto; color: #7c8492; }

.price-list-result { position: relative; }
.price-list-result-header { padding-bottom: 12px; }
.price-list-result-title h2 { font-size: clamp(24px, 2.5vw, 34px); }
.price-list-viewbar { justify-content: flex-end; margin-bottom: 10px; }
.price-list-persona { margin-right: auto; }
.commercial-list-shell { overflow: visible; border-radius: 18px; background: #f6f7f9; }
.commercial-list-brand { align-items: center; padding: 15px 20px; border-radius: 18px 18px 0 0; background: #182033; }
.commercial-list-logo { margin: 0 0 5px; padding: 3px 7px; font-size: 8px; }
.commercial-list-brand h1 { font-size: clamp(20px, 2.4vw, 29px); letter-spacing: -.03em; }
.commercial-list-brand p { margin-top: 3px; font-size: 11px; }
.commercial-list-controls { top: 0; display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
.commercial-list-controls .search-box { min-width: min(100%, 320px); flex: 1 1 360px; }
.commercial-list-controls select { width: auto; min-width: 135px; max-width: 190px; height: 40px; border: 1px solid #dce1e9; border-radius: 9px; background: #fff; color: #343c4c; font-size: 11px; }
.commercial-list-controls > span { margin-left: auto; }
.commercial-list-layout { display: block; padding: 18px; }
.commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.commercial-list-card { isolation: isolate; min-height: 560px; overflow: hidden; border-radius: 18px; box-shadow: 0 5px 18px rgba(24, 32, 51, .04); }
.commercial-card-media { position: relative; display: grid; width: 100%; height: 210px; min-height: 210px; max-height: 210px; flex: 0 0 210px; place-items: center; overflow: hidden; padding: 0; border: 0; border-bottom: 1px solid #eef0f4; background: linear-gradient(145deg, #fff, #f3f5f8); color: #a6aebb; font-size: 11px; cursor: pointer; }
.commercial-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; padding: 18px; object-fit: contain; object-position: center; background: #fff; }
.commercial-card-copy { display: flex; min-height: 170px; flex-direction: column; gap: 6px; padding: 15px 16px 10px; }
.commercial-card-copy > span { min-height: 14px; }
.commercial-card-title { display: -webkit-box; width: 100%; min-height: 58px; max-height: 58px; overflow: hidden; padding: 0; border: 0; background: transparent; color: #1f2738; text-align: left; font-size: 15px; font-weight: 780; line-height: 1.28; cursor: pointer; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.commercial-card-title:hover { color: #4338ca; }
.commercial-card-copy > small { min-height: 16px; color: #6f7786; font-size: 10px; font-weight: 700; }
.commercial-card-copy p { min-height: 50px; max-height: 50px; font-size: 11px; line-height: 1.5; -webkit-line-clamp: 3; }
.commercial-card-attributes { display: flex; min-height: 24px; gap: 5px; overflow: hidden; }
.commercial-card-attributes b { flex: 0 0 auto; padding: 4px 6px; border-radius: 6px; background: #f0f2f6; color: #626b7a; font-size: 8px; font-weight: 700; white-space: nowrap; }
.commercial-availability { margin: 0 16px 10px; }
.commercial-availability.availability-24_48h { background: #eef4ff; color: #315da8; }
.commercial-availability.availability-incoming { background: #fff4df; color: #98650d; }
.commercial-availability.availability-consult { background: #f0f1f4; color: #656d79; }
.commercial-price-row { min-height: 76px; padding: 12px 16px; }
.commercial-price-row strong { font-size: 19px; }
.commercial-add-button { width: calc(100% - 32px); margin: 0 16px 16px; }
.commercial-private-layer { margin: 0 16px 12px; }

.commercial-cart-backdrop { position: fixed; z-index: 39; inset: 0; visibility: hidden; background: rgba(20, 27, 42, .34); opacity: 0; transition: opacity .18s ease, visibility .18s ease; }
.commercial-cart-backdrop.open { visibility: visible; opacity: 1; }
.commercial-cart { position: fixed; z-index: 40; top: 0; right: 0; bottom: 0; width: min(420px, 94vw); min-height: 0; overflow-y: auto; padding: 24px; border: 0; border-radius: 0; box-shadow: -18px 0 45px rgba(19, 27, 44, .18); transform: translateX(105%); transition: transform .2s ease; }
.commercial-cart.open { transform: translateX(0); }
.commercial-cart-heading > button { display: grid; width: 36px; height: 36px; place-items: center; border: 0; border-radius: 50%; background: #f0f2f6; color: #4f5766; font-size: 22px; cursor: pointer; }
.commercial-cart-item { grid-template-columns: minmax(0, 1fr) 54px auto 28px; }
.commercial-safe-empty { display: grid; min-height: 230px; place-content: center; justify-items: center; gap: 7px; color: #747d8c; text-align: center; }
.commercial-safe-empty strong { color: #30384a; font-size: 17px; }
.commercial-safe-empty button { margin-top: 8px; }

.commercial-product-modal { width: min(880px, calc(100vw - 32px)); max-width: 880px; }
.commercial-product-sheet { display: grid; grid-template-columns: minmax(260px, .85fr) minmax(0, 1.15fr); gap: 24px; }
.commercial-product-sheet-media { position: relative; display: grid; min-height: 330px; place-items: center; overflow: hidden; border-radius: 14px; background: #f4f6f9; color: #9ba3b1; }
.commercial-product-sheet-media img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 22px; object-fit: contain; background: #fff; }
.commercial-product-sheet-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.commercial-product-sheet-copy > span:first-child { color: #5b56cf; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.commercial-product-sheet-copy > strong { font-size: 14px; }
.commercial-product-sheet-copy > p { margin: 5px 0; color: #5f6877; line-height: 1.65; }
.commercial-product-sheet-price { display: grid; gap: 3px; margin-top: auto; }
.commercial-product-sheet-price strong { font-size: 25px; }
.commercial-product-sheet-price span { color: #717988; font-size: 11px; }

.commercial-review { max-width: 1320px; margin: 0 auto; padding: 8px 0 50px; }
.commercial-review-header { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 16px; align-items: start; }
.commercial-review-header h2 { margin: 5px 0; font-size: clamp(27px, 3vw, 39px); letter-spacing: -.035em; }
.commercial-review-header p { margin: 0; color: #6f7786; }
.commercial-review-controls { position: sticky; z-index: 3; top: 0; display: grid; grid-template-columns: minmax(300px, 1fr) 210px auto; align-items: center; gap: 10px; margin: 22px 0 14px; padding: 12px; border: 1px solid #e1e5ed; border-radius: 13px; background: rgba(255,255,255,.96); }
.commercial-review-controls select { height: 40px; border: 1px solid #dce1e9; border-radius: 9px; background: #fff; }
.commercial-review-controls > span { color: #757e8d; font-size: 11px; }
.commercial-review-list { display: grid; gap: 10px; }
.commercial-review-row { display: grid; grid-template-columns: 110px minmax(260px, 1fr) minmax(190px, .55fr) 150px; align-items: center; gap: 16px; min-height: 132px; padding: 11px; border: 1px solid #e2e6ed; border-radius: 15px; background: #fff; }
.commercial-review-image { position: relative; display: grid; width: 110px; height: 110px; place-items: center; overflow: hidden; border-radius: 11px; background: #f3f5f8; color: #a3abb7; font-size: 10px; }
.commercial-review-image img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 8px; object-fit: contain; background: #fff; }
.commercial-review-copy { display: grid; min-width: 0; gap: 3px; }
.commercial-review-copy > span { color: #625dcc; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.commercial-review-copy h3 { margin: 0; font-size: 14px; }
.commercial-review-copy small { color: #7b8492; font-size: 10px; }
.commercial-review-copy p { display: -webkit-box; max-height: 38px; margin: 5px 0 0; overflow: hidden; color: #6f7786; font-size: 10px; line-height: 1.5; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.commercial-review-state { display: grid; justify-items: start; gap: 7px; }
.commercial-review-state small { color: #9a6010; font-size: 10px; line-height: 1.4; }
.commercial-review-state small.ready { color: #247847; }
.commercial-review-chip { padding: 5px 8px; border-radius: 999px; background: #fff3d7; color: #97620e; font-size: 9px; font-weight: 800; }
.commercial-review-chip.published { background: #e7f7ed; color: #247847; }
.commercial-review-chip.blocked { background: #f1f2f5; color: #626a76; }
.commercial-review-actions { display: grid; gap: 6px; }
.commercial-review-actions button { width: 100%; min-height: 34px; font-size: 10px; }
.commercial-review-more { display: block; margin: 18px auto; }

@media (max-width: 1080px) {
  .commercial-list-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .commercial-review-row { grid-template-columns: 90px minmax(220px, 1fr) 180px; }
  .commercial-review-image { width: 90px; height: 90px; }
  .commercial-review-actions { grid-column: 2 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .price-list-home-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .commercial-review-summary { align-items: flex-start; flex-wrap: wrap; }
  .commercial-review-summary small { width: 100%; margin-left: 0; }
  .price-list-viewbar { display: grid; grid-template-columns: 1fr auto; }
  .price-list-persona { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  .price-list-persona select { width: 100%; }
  .commercial-list-brand { align-items: flex-start; flex-direction: row; padding: 13px 14px; }
  .commercial-list-rate { margin-left: auto; text-align: right; }
  .commercial-list-controls { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 10px; }
  .commercial-list-controls .search-box { grid-column: 1 / -1; min-width: 0; }
  .commercial-list-controls select { width: 100%; max-width: none; min-width: 0; }
  .commercial-list-controls > span { grid-column: 1 / -1; margin-left: 0; }
  .commercial-list-layout { padding: 10px; }
  .commercial-list-grid { grid-template-columns: 1fr; gap: 13px; }
  .commercial-list-card { min-height: 0; }
  .commercial-card-media { height: 200px; min-height: 200px; max-height: 200px; flex-basis: 200px; }
  .commercial-card-copy { min-height: 165px; }
  .commercial-cart { top: auto; width: 100%; max-height: min(78vh, 620px); border-radius: 20px 20px 0 0; transform: translateY(105%); }
  .commercial-cart.open { transform: translateY(0); }
  .commercial-product-sheet { grid-template-columns: 1fr; }
  .commercial-product-sheet-media { min-height: 230px; }
  .commercial-review { padding-inline: 0; }
  .commercial-review-header { grid-template-columns: 1fr; }
  .commercial-review-controls { position: relative; grid-template-columns: 1fr; }
  .commercial-review-row { grid-template-columns: 76px minmax(0, 1fr); gap: 10px; }
  .commercial-review-image { width: 76px; height: 76px; }
  .commercial-review-state,
  .commercial-review-actions { grid-column: 1 / -1; }
  .commercial-review-actions { grid-template-columns: 1fr 1fr; }
}

/* Commercial price-list workspace */
.price-lists-toolbar {
  align-items: flex-end;
}

.price-list-index {
  margin-bottom: 16px;
  padding: 16px;
}

.price-list-index-controls,
.price-list-index-controls form,
.price-list-card-top,
.price-list-builder-heading,
.price-list-section-heading,
.price-list-preview-controls,
.price-list-activation-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.price-list-index-controls form {
  flex: 1;
  justify-content: flex-start;
}

.price-list-index-controls .search-box {
  width: min(520px, 100%);
}

.price-list-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.price-list-card {
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
  color: var(--ink);
  text-align: left;
}

.price-list-card:hover,
.price-list-card.selected {
  border-color: rgba(111, 91, 211, .55);
  background: var(--primary-soft);
}

.price-list-card.selected {
  box-shadow: inset 3px 0 0 var(--primary);
}

.price-list-card b,
.price-list-card span,
.price-list-card small {
  min-width: 0;
}

.price-list-card small,
.price-list-card > span:not(.price-list-card-top) {
  color: var(--muted);
  font-size: 12px;
}

.price-list-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(360px, .8fr);
  align-items: start;
  gap: 16px;
}

.price-list-builder,
.price-list-preview {
  padding: 18px;
}

.price-list-builder-heading h3,
.price-list-preview-controls h3,
.price-list-section-heading h4 {
  margin: 2px 0 0;
}

.price-list-builder-heading p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.price-list-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 5px;
  margin: 16px 0;
}

.price-list-steps span {
  padding: 8px 6px;
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-align: center;
  text-transform: uppercase;
}

.price-list-form {
  display: grid;
  gap: 14px;
}

.price-list-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
}

.price-list-form legend {
  padding: 0 7px;
  color: var(--primary-deep);
  font-size: 12px;
  font-weight: 850;
}

.price-list-policy-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.price-list-product-picker {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.price-list-product-picker .search-box {
  flex: 1;
}

.price-list-product-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  max-height: 280px;
  margin-top: 10px;
  overflow: auto;
}

.price-list-product-option {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 2px 7px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.price-list-product-option > span {
  grid-row: 1 / 3;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--success-soft);
  color: var(--success);
  font-weight: 900;
}

.price-list-product-option.excluded > span {
  background: var(--surface-soft);
  color: var(--muted);
}

.price-list-product-option small {
  color: var(--muted);
  font-size: 10px;
}

.price-list-permissions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
}

.price-list-permissions > label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #4f4b5a;
  font-size: 13px;
  font-weight: 650;
}

.price-list-activation-row p {
  flex: 1;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.price-list-rules {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.price-list-rule-rows {
  display: grid;
  gap: 7px;
  margin: 12px 0;
}

.price-list-rule-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.price-list-rule-row.inherited {
  background: var(--surface-soft);
}

.price-list-rule-row > span {
  color: var(--primary-deep);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
}

.price-list-rule-row strong,
.price-list-rule-row small {
  display: block;
}

.price-list-rule-row strong {
  font-size: 12px;
}

.price-list-rule-row small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.new-pricing-rule-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  align-items: end;
  gap: 9px;
  padding: 12px;
  border-radius: 12px;
  background: var(--surface-soft);
}

.price-list-preview {
  position: sticky;
  top: calc(var(--topbar-height) + 14px);
}

.price-list-preview-controls {
  align-items: flex-start;
}

.price-list-preview-controls form {
  display: grid;
  grid-template-columns: minmax(100px, 1fr) 74px auto;
  gap: 6px;
}

.price-list-preview-controls input {
  min-width: 0;
}

.price-list-preview-stack {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.internal-price-preview,
.recipient-price-preview {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
}

.internal-price-preview {
  background: #211e2b;
  color: #f8f7fb;
}

.internal-price-preview header,
.internal-price-preview dl,
.rule-trace,
.recipient-price-preview {
  padding: 14px;
}

.internal-price-preview header > span,
.recipient-price-preview header > span {
  display: block;
  color: #b8aaff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .1em;
}

.internal-price-preview header strong,
.internal-price-preview header small {
  display: block;
  margin-top: 3px;
}

.internal-price-preview header small,
.rule-trace span {
  color: #b8b3c5;
  font-size: 10px;
}

.internal-price-preview dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  background: rgba(255,255,255,.08);
}

.internal-price-preview dl > div {
  padding: 9px;
  background: #211e2b;
}

.internal-price-preview dt {
  color: #aaa4b6;
  font-size: 9px;
}

.internal-price-preview dd {
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 750;
}

.price-floor-alert {
  margin: 0 14px 10px;
  padding: 9px;
  border-radius: 8px;
  background: rgba(44, 185, 126, .16);
  color: #c9f9df;
  font-size: 10px;
}

.price-floor-alert.warning {
  background: rgba(225, 163, 67, .15);
  color: #ffe1a8;
}

.rule-trace {
  display: grid;
  gap: 3px;
  border-top: 1px solid rgba(255,255,255,.1);
}

.recipient-price-preview {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  background: #fff;
}

.recipient-price-preview.neutral header > span {
  color: #4b5563;
}

.recipient-price-preview header,
.recipient-price-preview .recipient-availability,
.recipient-price-preview .recipient-price,
.recipient-price-preview .recipient-conditions,
.recipient-price-preview > button,
.recipient-price-preview .recipient-safety-note {
  grid-column: 1 / -1;
}

.recipient-price-preview header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.recipient-price-preview header small,
.recipient-product-copy > span,
.recipient-product-copy > small,
.recipient-conditions,
.recipient-safety-note {
  color: var(--muted);
  font-size: 10px;
}

.recipient-product-image {
  min-height: 92px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--primary);
  font-size: 28px;
}

.recipient-product-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.recipient-product-copy h4,
.recipient-product-copy p {
  margin: 3px 0;
}

.recipient-product-copy p {
  color: #565262;
  font-size: 11px;
}

.recipient-availability {
  width: max-content;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--success-soft);
  color: var(--success);
  font-size: 10px;
  font-weight: 800;
}

.recipient-price {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.recipient-price strong {
  color: var(--primary-deep);
  font-size: 22px;
}

.recipient-price span {
  color: var(--muted);
  font-size: 10px;
}

.recipient-conditions {
  margin: 0;
}

.recipient-safety-note {
  text-align: center;
}

@media (max-width: 1180px) {
  .price-list-workspace {
    grid-template-columns: 1fr;
  }

  .price-list-preview {
    position: static;
  }

  .price-list-preview-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .price-list-index-controls,
  .price-list-index-controls form,
  .price-list-preview-controls,
  .price-list-activation-row {
    align-items: stretch;
    flex-direction: column;
  }

  .price-list-index-controls select,
  .price-list-index-controls button,
  .price-list-product-picker button,
  .price-list-activation-row button {
    width: 100%;
  }

  .price-list-steps {
    grid-template-columns: repeat(2, 1fr);
  }

  .price-list-policy-grid,
  .price-list-product-options,
  .price-list-permissions,
  .price-list-preview-stack,
  .internal-price-preview dl {
    grid-template-columns: 1fr;
  }

  .new-pricing-rule-form,
  .price-list-preview-controls form {
    grid-template-columns: 1fr;
  }

  .price-list-rule-row {
    grid-template-columns: 60px minmax(0, 1fr);
  }

  .price-list-rule-row button {
    grid-column: 2;
    justify-self: start;
  }
}

/* Commercial price lists: the list itself is the product, configuration stays secondary. */
.price-list-home,
.price-list-result,
.price-list-wizard { max-width: 1480px; margin: 0 auto; color: #172033; }
.price-list-home { padding: 22px 4px 60px; }
.price-list-home-header { align-items: flex-end; border-bottom: 0; padding: 0; }
.price-list-home-header h2 { margin: 5px 0 7px; font-size: clamp(28px, 3vw, 42px); letter-spacing: -.035em; }
.price-list-home-header p { max-width: 620px; margin: 0; color: #6b7280; font-size: 15px; }
.price-list-home-search { max-width: 520px; margin: 28px 0 22px; }
.price-list-home-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.price-list-home-card { display: flex; min-height: 272px; flex-direction: column; padding: 22px; border: 1px solid #e4e8f0; border-radius: 20px; background: #fff; box-shadow: 0 10px 30px rgba(20, 30, 55, .05); transition: transform .18s ease, box-shadow .18s ease; }
.price-list-home-card:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(20, 30, 55, .09); }
.price-list-home-card-top { display: flex; align-items: center; justify-content: space-between; }
.price-list-home-card-icon { display: grid; width: 48px; height: 48px; margin: 22px 0 15px; place-items: center; border-radius: 15px; background: #eef2ff; color: #4f46e5; font-size: 21px; font-weight: 800; }
.price-list-home-card h3 { margin: 0; font-size: 20px; letter-spacing: -.02em; }
.price-list-home-card > p { min-height: 40px; margin: 7px 0 18px; color: #6b7280; line-height: 1.45; }
.price-list-home-meta { display: flex; gap: 17px; margin: auto 0 18px; color: #8a93a3; font-size: 11px; }
.price-list-home-meta span { display: grid; gap: 3px; }
.price-list-home-meta strong { color: #30384a; font-size: 14px; }

.price-list-back { margin: 0 0 13px; }
.price-list-result { padding: 8px 0 50px; }
.price-list-result-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 12px 0 20px; }
.price-list-result-title { display: flex; align-items: center; gap: 12px; }
.price-list-result-title h2 { margin: 0; font-size: clamp(25px, 3vw, 38px); letter-spacing: -.035em; }
.price-list-result-header p { margin: 7px 0 0; color: #7a8291; }
.price-list-result-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.price-list-viewbar { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; }
.price-list-preview-banner { display: flex; min-width: 280px; flex: 1; align-items: center; gap: 11px; padding: 11px 14px; border: 1px solid #cfd8ff; border-radius: 13px; background: #f6f7ff; color: #343c5d; }
.price-list-preview-banner > span { display: grid; width: 31px; height: 31px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #e0e7ff; color: #4338ca; font-weight: 800; }
.price-list-preview-banner div { display: grid; gap: 2px; }
.price-list-preview-banner small { color: #68708a; line-height: 1.35; }
.price-list-persona { display: grid; gap: 3px; color: #737b8c; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.price-list-persona select { min-width: 170px; height: 38px; border: 1px solid #d9deea; border-radius: 10px; background: #fff; color: #283044; font-size: 12px; text-transform: none; }
.price-list-view-toggle { display: inline-flex; flex: 0 0 auto; padding: 4px; border: 1px solid #dfe3ec; border-radius: 12px; background: #f3f5f8; }
.price-list-view-toggle button { min-height: 36px; padding: 7px 12px; border: 0; border-radius: 9px; background: transparent; color: #6d7585; font-weight: 750; cursor: pointer; }
.price-list-view-toggle button.active { background: #fff; color: #3338a0; box-shadow: 0 2px 8px rgba(33, 42, 74, .1); }

.commercial-list-shell { overflow: hidden; border: 1px solid #e1e5ed; border-radius: 23px; background: #f6f7f9; box-shadow: 0 20px 50px rgba(28, 36, 58, .08); }
.commercial-list-brand { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 30px 32px 25px; background: #11182a; color: #fff; }
.commercial-list-logo { display: inline-flex; margin-bottom: 13px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.2); border-radius: 7px; color: #c9d0ff; font-size: 10px; font-weight: 850; letter-spacing: .13em; }
.commercial-list-brand h1 { margin: 0; font-size: clamp(29px, 4vw, 47px); letter-spacing: -.045em; }
.commercial-list-brand p { margin: 7px 0 0; color: #aeb7ca; }
.commercial-list-rate { display: grid; gap: 3px; text-align: right; font-size: 13px; font-weight: 800; }
.commercial-list-rate small { color: #aeb7ca; font-weight: 500; }
.commercial-list-controls { position: sticky; z-index: 2; top: 0; display: grid; grid-template-columns: minmax(260px, 1fr) minmax(180px, 260px) auto; align-items: center; gap: 12px; padding: 15px 22px; border-bottom: 1px solid #e2e6ed; background: rgba(255,255,255,.96); backdrop-filter: blur(12px); }
.commercial-list-controls > span { color: #7b8494; font-size: 12px; white-space: nowrap; }
.commercial-list-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; align-items: start; gap: 18px; padding: 22px; }
.commercial-list-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.commercial-list-card { position: relative; display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid #e1e5ec; border-radius: 16px; background: #fff; }
.commercial-card-image { display: grid; height: 156px; place-items: center; border-bottom: 1px solid #eef0f4; background: linear-gradient(145deg, #fbfcfe, #f1f3f7); color: #aeb5c1; font-size: 34px; }
.commercial-card-image img { width: 100%; height: 100%; object-fit: contain; padding: 14px; }
.commercial-card-copy { display: grid; gap: 5px; padding: 15px 15px 10px; }
.commercial-card-copy > span { color: #6965c9; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.commercial-card-copy h3 { min-height: 41px; margin: 0; font-size: 15px; line-height: 1.35; }
.commercial-card-copy p { display: -webkit-box; min-height: 35px; margin: 0; overflow: hidden; color: #737b88; font-size: 11px; line-height: 1.5; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.commercial-card-copy small { overflow: hidden; color: #a0a6b2; text-overflow: ellipsis; white-space: nowrap; }
.commercial-availability { align-self: flex-start; margin: 0 15px 10px; padding: 5px 8px; border-radius: 999px; background: #ecf8f0; color: #20844e; font-size: 10px; font-weight: 750; }
.commercial-price-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-top: auto; padding: 12px 15px; border-top: 1px solid #eef0f4; }
.commercial-price-row > div { display: grid; gap: 3px; min-width: 0; }
.commercial-price-row strong { font-size: 17px; }
.commercial-price-row span { color: #777f8c; font-size: 9px; }
.commercial-tier-note { color: #4338ca !important; font-weight: 750; }
.commercial-quantity { display: grid; gap: 3px; color: #7e8693; font-size: 9px; }
.commercial-quantity input { width: 58px; height: 34px; padding: 5px 7px; border: 1px solid #dce1e9; border-radius: 8px; }
.commercial-add-button { width: calc(100% - 30px); min-height: 40px; margin: 0 15px 15px; }
.commercial-request-disabled { margin: 0 15px 15px; color: #858d9a; font-size: 10px; text-align: center; }
.commercial-private-layer { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 12px 12px; padding: 11px; border: 1px solid #f0d4a0; border-radius: 11px; background: #fff9ec; }
.commercial-private-layer > div { display: grid; gap: 2px; min-width: 0; }
.commercial-private-layer span { color: #8f7445; font-size: 9px; text-transform: uppercase; }
.commercial-private-layer strong { overflow-wrap: anywhere; font-size: 10px; }
.commercial-private-layer > p,
.commercial-private-layer > small { grid-column: 1 / -1; margin: 0; color: #87621f; font-size: 9px; line-height: 1.4; }
.commercial-cart { position: sticky; top: 84px; min-height: 225px; padding: 18px; border: 1px solid #e0e4eb; border-radius: 16px; background: #fff; }
.commercial-cart-heading { display: flex; align-items: flex-start; justify-content: space-between; }
.commercial-cart-heading h3 { margin: 3px 0 0; font-size: 20px; }
.commercial-cart-heading > span { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #eef0ff; color: #4f46e5; font-size: 11px; font-weight: 800; }
.commercial-cart-empty { display: grid; justify-items: center; padding: 32px 12px 12px; color: #7c8492; text-align: center; }
.commercial-cart-empty > span { display: grid; width: 42px; height: 42px; margin-bottom: 10px; place-items: center; border-radius: 50%; background: #f0f2f7; font-size: 22px; }
.commercial-cart-empty strong { color: #303749; }
.commercial-cart-empty p { margin: 6px 0 0; font-size: 11px; line-height: 1.5; }
.commercial-cart-items { display: grid; gap: 10px; margin: 16px 0; }
.commercial-cart-item { display: grid; grid-template-columns: minmax(0, 1fr) 48px auto 24px; align-items: center; gap: 7px; padding-bottom: 9px; border-bottom: 1px solid #edf0f4; }
.commercial-cart-item div { display: grid; min-width: 0; }
.commercial-cart-item strong,
.commercial-cart-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.commercial-cart-item strong { font-size: 10px; }
.commercial-cart-item small { color: #989fab; font-size: 8px; }
.commercial-cart-item input { width: 48px; min-width: 0; padding: 5px; }
.commercial-cart-item > span { font-size: 9px; font-weight: 750; white-space: nowrap; }
.commercial-cart-item button { border: 0; background: transparent; color: #a0a7b3; font-size: 17px; cursor: pointer; }
.commercial-cart-total { display: grid; gap: 4px; padding: 12px 0; }
.commercial-cart-total span { color: #737b89; font-size: 11px; }
.commercial-cart-total strong { font-size: 21px; }
.commercial-cart-total small { color: #9299a5; line-height: 1.4; }
.commercial-cart > .primary-button { width: 100%; }
.commercial-show-more { display: block; margin: 18px auto 3px; }
.commercial-list-empty { display: grid; grid-column: 1 / -1; min-height: 160px; place-content: center; justify-items: center; gap: 5px; color: #858d9a; text-align: center; }
.commercial-list-empty strong { color: #333b4c; }

.price-list-wizard { padding: 6px 0 50px; }
.price-list-wizard-header { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 8px 0 20px; }
.price-list-wizard-header > div { text-align: center; }
.price-list-wizard-header h2 { margin: 4px 0 0; font-size: clamp(25px, 3vw, 38px); letter-spacing: -.035em; }
.price-list-wizard-header > span { color: #7a8291; font-size: 12px; font-weight: 750; }
.price-list-wizard-progress { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: 920px; margin: 0 auto 27px; }
.price-list-wizard-progress button { position: relative; display: grid; justify-items: center; gap: 7px; border: 0; background: transparent; color: #8d94a2; font-size: 10px; }
.price-list-wizard-progress button::before { position: absolute; z-index: -1; top: 14px; right: 50%; left: -50%; height: 2px; background: #e1e5eb; content: ""; }
.price-list-wizard-progress button:first-child::before { display: none; }
.price-list-wizard-progress b { display: grid; width: 30px; height: 30px; place-items: center; border: 2px solid #dfe3ea; border-radius: 50%; background: #fff; }
.price-list-wizard-progress button.active,
.price-list-wizard-progress button.done { color: #4338ca; }
.price-list-wizard-progress button.active b,
.price-list-wizard-progress button.done b { border-color: #4f46e5; background: #4f46e5; color: #fff; }
.price-list-wizard-progress button.done::before,
.price-list-wizard-progress button.active::before { background: #7370e7; }
.price-list-wizard-body { min-height: 520px; padding: 28px; border: 1px solid #e2e6ed; border-radius: 22px; background: #fff; box-shadow: 0 15px 45px rgba(29, 38, 60, .06); }
.price-list-wizard-footer { position: sticky; z-index: 5; bottom: 8px; display: grid; grid-template-columns: 140px 1fr 160px; align-items: center; gap: 16px; margin-top: 15px; padding: 13px 16px; border: 1px solid #dfe3eb; border-radius: 15px; background: rgba(255,255,255,.96); box-shadow: 0 10px 30px rgba(26, 35, 55, .12); backdrop-filter: blur(12px); }
.price-list-wizard-footer > span { color: #777f8e; text-align: center; font-size: 12px; }
.wizard-source-stage { max-width: 900px; margin: 32px auto; }
.wizard-source-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.wizard-source-grid button { display: grid; min-height: 190px; justify-items: start; align-content: start; gap: 9px; padding: 22px; border: 2px solid #e2e5ec; border-radius: 17px; background: #fff; color: #30374a; text-align: left; cursor: pointer; }
.wizard-source-grid button > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; background: #f0f2f7; color: #777f91; font-size: 19px; }
.wizard-source-grid button strong { margin-top: 12px; font-size: 16px; }
.wizard-source-grid button small { color: #7b8493; line-height: 1.5; }
.wizard-source-grid button.active { border-color: #5b56df; background: #f8f8ff; box-shadow: 0 0 0 3px rgba(91, 86, 223, .08); }
.wizard-source-grid button.active > span { background: #e5e4ff; color: #4f46d2; }
.wizard-source-select,
.wizard-list-name,
.wizard-recipient-name { display: grid; max-width: 560px; gap: 7px; margin: 22px auto 0; color: #3e4657; font-size: 12px; font-weight: 750; }
.wizard-source-select select,
.wizard-list-name input,
.wizard-recipient-name input { height: 47px; border: 1px solid #d9dee7; border-radius: 11px; background: #fff; font-size: 14px; }
.wizard-product-mode { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
.wizard-product-mode button { display: grid; gap: 4px; padding: 15px 17px; border: 2px solid #e2e5eb; border-radius: 13px; background: #fff; color: #303748; text-align: left; cursor: pointer; }
.wizard-product-mode button span { color: #7e8694; font-size: 11px; }
.wizard-product-mode button.active { border-color: #5d57df; background: #f8f8ff; }
.wizard-all-products { display: flex; max-width: 620px; align-items: center; gap: 18px; margin: 70px auto; padding: 26px; border-radius: 18px; background: #f5f7fb; }
.wizard-all-products > span { display: grid; width: 54px; height: 54px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #dcf5e5; color: #1e8b50; font-size: 22px; }
.wizard-all-products p { margin: 5px 0 0; color: #747d8c; }
.wizard-catalog-controls { display: grid; grid-template-columns: minmax(280px, 1fr) 190px 190px; gap: 10px; margin-bottom: 14px; }
.wizard-product-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; align-items: start; gap: 16px; }
.wizard-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wizard-product-card { display: grid; min-height: 124px; grid-template-columns: 84px minmax(0, 1fr); gap: 11px; overflow: hidden; padding: 11px; border: 1px solid #e2e6ed; border-radius: 14px; background: #fff; }
.wizard-product-card.selected { border-color: #5d57df; box-shadow: inset 0 0 0 1px #5d57df; }
.wizard-product-image { display: grid; width: 84px; height: 84px; grid-row: 1 / 3; place-items: center; border-radius: 10px; background: #f3f5f8; color: #adb4c0; }
.wizard-product-image img { width: 100%; height: 100%; object-fit: contain; padding: 6px; }
.wizard-product-card > div:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.wizard-product-card span,
.wizard-product-card small { overflow: hidden; color: #818997; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.wizard-product-card h4 { display: -webkit-box; margin: 0; overflow: hidden; font-size: 12px; line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.wizard-product-card > button { grid-column: 2; min-height: 30px; border: 0; border-radius: 8px; background: #eff1f5; color: #4f5869; font-size: 9px; font-weight: 800; cursor: pointer; }
.wizard-product-card.selected > button { background: #e8e7ff; color: #4338ca; }
.wizard-selection-tray { position: sticky; top: 10px; display: grid; gap: 8px; padding: 16px; border-radius: 14px; background: #f5f6f9; }
.wizard-selection-tray > div { display: grid; gap: 3px; margin-bottom: 4px; }
.wizard-selection-tray > button { display: grid; grid-template-columns: 1fr auto; gap: 6px; padding: 8px; border: 0; border-radius: 8px; background: #fff; color: #404758; text-align: left; cursor: pointer; }
.wizard-selection-tray > button span { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.wizard-selection-tray > button b { color: #9ba2ae; }
.wizard-selection-tray p,
.wizard-selection-tray small { margin: 5px 0; color: #818997; font-size: 10px; line-height: 1.45; }
.wizard-rule-stage { max-width: 920px; margin: 0 auto; }
.wizard-base-price { padding: 20px 22px; border-radius: 15px; background: #11182a; color: #fff; }
.wizard-base-price > span { color: #aeb7c9; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.wizard-base-price strong { display: block; margin-top: 6px; font-size: 20px; }
.wizard-base-price p { max-width: 650px; margin: 5px 0 0; color: #b9c1d0; font-size: 12px; line-height: 1.5; }
.wizard-rule-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin: 25px 0 13px; }
.wizard-rule-heading h3 { margin: 0; }
.wizard-rule-heading p { margin: 4px 0 0; color: #7f8795; font-size: 12px; }
.wizard-rule-list { display: grid; gap: 8px; }
.wizard-rule-sentence { display: grid; grid-template-columns: 25px 1fr 30px; align-items: center; gap: 8px; padding: 12px 14px; border: 1px solid #e3e6ed; border-radius: 11px; }
.wizard-rule-sentence > span { color: #5953d6; }
.wizard-rule-sentence strong { font-size: 12px; }
.wizard-rule-sentence button { border: 0; background: transparent; color: #9da4af; font-size: 17px; cursor: pointer; }
.wizard-empty-rules { display: grid; gap: 4px; padding: 25px; border: 1px dashed #d8dde6; border-radius: 12px; color: #858d99; text-align: center; }
.wizard-empty-rules strong { color: #3d4556; }
.wizard-condition-form { display: grid; grid-template-columns: 1fr 1.3fr .7fr 1.2fr .7fr auto; align-items: end; gap: 9px; margin-top: 13px; padding: 15px; border-radius: 13px; background: #f4f5f8; }
.wizard-condition-form label { display: grid; gap: 5px; color: #697181; font-size: 9px; font-weight: 750; }
.wizard-condition-form input,
.wizard-condition-form select { width: 100%; min-width: 0; height: 39px; border: 1px solid #d9dee6; border-radius: 8px; background: #fff; font-size: 10px; }
.wizard-value-input { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px; }
.wizard-advanced { margin-top: 18px; border-top: 1px solid #e5e8ed; }
.wizard-advanced summary { padding: 16px 2px; color: #666e7e; font-size: 11px; font-weight: 750; cursor: pointer; }
.wizard-advanced > div { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 0 2px 10px; }
.wizard-advanced label { display: grid; gap: 6px; color: #4f5767; font-size: 11px; font-weight: 700; }
.wizard-advanced small { color: #858d99; font-weight: 400; }
.wizard-recipient-stage { max-width: 880px; margin: 18px auto; }
.wizard-audience-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; }
.wizard-audience-grid button { display: grid; min-height: 145px; align-content: start; justify-items: start; gap: 7px; padding: 17px; border: 2px solid #e1e5eb; border-radius: 14px; background: #fff; color: #303748; text-align: left; cursor: pointer; }
.wizard-audience-grid button > span { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 10px; background: #f0f2f6; color: #727b8d; }
.wizard-audience-grid small { color: #808896; line-height: 1.4; }
.wizard-audience-grid button.active { border-color: #5b56dc; background: #f8f8ff; }
.wizard-permission-list { display: grid; max-width: 650px; gap: 8px; margin: 24px auto 0; }
.wizard-permission-list > label { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid #e1e5eb; border-radius: 11px; }
.wizard-permission-list input[type="checkbox"] { width: 19px; height: 19px; }
.wizard-permission-list span { display: grid; gap: 3px; }
.wizard-permission-list small { color: #7d8594; }
.wizard-markup-limit { display: grid !important; grid-template-columns: 1fr 90px auto; }
.wizard-markup-limit input { width: 90px; }
.wizard-preview-stage { margin: -28px; }
.wizard-preview-toolbar { display: flex; align-items: center; gap: 12px; padding: 14px 16px; }
.wizard-commercial-preview { border: 0; border-top: 1px solid #e1e5ed; border-radius: 0 0 22px 22px; box-shadow: none; }
.wizard-commercial-preview .commercial-list-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1180px) {
  .price-list-home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .commercial-list-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wizard-commercial-preview .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wizard-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wizard-condition-form { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 800px) {
  .price-list-home,
  .price-list-result,
  .price-list-wizard { width: 100%; padding-inline: 0; }
  .price-list-home { padding-top: 8px; }
  .price-list-home-header,
  .price-list-result-header { align-items: stretch; flex-direction: column; }
  .price-list-home-header .primary-button { width: 100%; }
  .price-list-home-grid { grid-template-columns: 1fr; }
  .price-list-home-card { min-height: 240px; }
  .price-list-result-actions { width: 100%; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; padding: 1px 0 5px; scrollbar-width: none; }
  .price-list-result-actions::-webkit-scrollbar { display: none; }
  .price-list-result-actions button { min-width: 112px; min-height: 42px; flex: 0 0 auto; }
  .price-list-viewbar { align-items: stretch; flex-direction: column; }
  .price-list-persona select { width: 100%; }
  .price-list-view-toggle { display: grid; grid-template-columns: 1fr 1fr; }
  .commercial-list-brand { align-items: flex-start; flex-direction: column; padding: 24px 18px; }
  .commercial-list-rate { text-align: left; }
  .commercial-list-controls { position: relative; grid-template-columns: 1fr; padding: 12px; }
  .commercial-list-layout { grid-template-columns: 1fr; padding: 12px; }
  .commercial-list-grid,
  .wizard-commercial-preview .commercial-list-grid { grid-template-columns: 1fr; }
  .commercial-card-image { height: 190px; }
  .commercial-cart { position: relative; top: auto; }
  .price-list-wizard-header { grid-template-columns: 1fr auto; }
  .price-list-wizard-header > button { grid-column: 1 / -1; justify-self: start; }
  .price-list-wizard-header > div { text-align: left; }
  .price-list-wizard-progress { overflow-x: auto; justify-content: start; grid-template-columns: repeat(5, 105px); padding-bottom: 7px; }
  .price-list-wizard-progress span { display: none; }
  .price-list-wizard-body { min-height: 480px; padding: 14px; border-radius: 16px; }
  .price-list-wizard-footer { grid-template-columns: 90px 1fr 125px; }
  .wizard-source-stage { margin: 4px auto; }
  .wizard-source-grid,
  .wizard-product-mode,
  .wizard-audience-grid { grid-template-columns: 1fr; }
  .wizard-source-grid button { min-height: 125px; }
  .wizard-catalog-controls { grid-template-columns: 1fr; }
  .wizard-product-layout { grid-template-columns: 1fr; }
  .wizard-product-grid { grid-template-columns: 1fr; }
  .wizard-selection-tray { position: relative; top: auto; grid-row: 1; }
  .wizard-condition-form,
  .wizard-advanced > div { grid-template-columns: 1fr; }
  .wizard-rule-heading { align-items: stretch; flex-direction: column; }
  .wizard-audience-grid { grid-template-columns: 1fr 1fr; }
  .wizard-audience-grid button { min-height: 125px; }
  .wizard-preview-stage { margin: -14px; }
  .wizard-preview-toolbar { align-items: stretch; flex-direction: column; }
}

* {
  box-sizing: border-box;
}

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

html {
  min-height: 100%;
  background: var(--bg);
}

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background:
    linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,.3)),
    repeating-linear-gradient(0deg, transparent, transparent 31px, rgba(113, 99, 76, .025) 32px),
    repeating-linear-gradient(90deg, transparent, transparent 31px, rgba(113, 99, 76, .025) 32px),
    var(--bg);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
select,
input[type="file"] {
  cursor: pointer;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible {
  outline: 3px solid rgba(111, 91, 211, .22);
  outline-offset: 2px;
}

button[disabled] {
  cursor: not-allowed;
  opacity: .5;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40;
  width: var(--sidebar-width);
  display: flex;
  flex-direction: column;
  padding: 22px 16px 18px;
  background: rgba(252, 250, 246, .94);
  border-right: 1px solid var(--line);
  backdrop-filter: blur(18px);
  overflow-y: auto;
}

.brand-row {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 4px 8px 25px;
}

.brand-mark {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--primary);
}

.brand-mark svg {
  width: 100%;
  height: 100%;
}

.brand-name {
  font-weight: 850;
  font-size: 17px;
  letter-spacing: -.025em;
  white-space: nowrap;
}

.brand-subtitle {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.nav-list {
  display: grid;
  gap: 5px;
}

.nav-item {
  width: 100%;
  min-height: 44px;
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #666274;
  text-align: left;
  font-weight: 700;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}

.nav-item:hover {
  background: rgba(111, 91, 211, .07);
  color: var(--ink);
}

.nav-item.active {
  color: var(--primary-deep);
  background: var(--primary-soft);
  box-shadow: inset 3px 0 0 var(--primary);
}

.nav-item:active {
  transform: translateY(1px);
}

.nav-icon {
  width: 24px;
  text-align: center;
  font-size: 18px;
  font-weight: 800;
}

.nav-badge {
  padding: 3px 6px;
  border-radius: 999px;
  background: #e3dcff;
  color: var(--primary-deep);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.sidebar-spacer {
  flex: 1;
  min-height: 30px;
}

.prototype-status {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 0 4px 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
}

.prototype-status .status-dot {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 4px rgba(36, 138, 99, .12);
}

.prototype-status strong,
.prototype-status span {
  display: block;
}

.prototype-status strong {
  font-size: 12px;
}

.prototype-status span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}

.sidebar-profile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 9px 0;
  border-top: 1px solid var(--line);
}

.avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--primary), #9587e4);
  color: #fff;
  font-size: 12px;
  font-weight: 850;
  box-shadow: 0 7px 20px rgba(111, 91, 211, .23);
}

.profile-copy strong,
.profile-copy span {
  display: block;
}

.profile-copy strong {
  font-size: 13px;
}

.profile-copy span {
  color: var(--muted);
  font-size: 11px;
}

.main-column {
  grid-column: 2;
  min-width: 0;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  height: var(--topbar-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 34px;
  background: rgba(245, 242, 234, .84);
  border-bottom: 1px solid rgba(213, 206, 192, .75);
  backdrop-filter: blur(18px);
}

.topbar-context h1 {
  margin: 1px 0 0;
  font-size: 25px;
  line-height: 1.15;
  letter-spacing: -.035em;
}

.eyebrow,
.panel-kicker,
.hero-kicker {
  color: var(--primary);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

.desktop-sidebar-toggle { display: none !important; flex: 0 0 auto; }

.app-shell.catalog-compare-active .environment-banner,
.app-shell.catalog-compare-active .global-breadcrumb-bar,
.app-shell.catalog-compare-active .env-mode-chip { display: none !important; }

/* En el catálogo el encabezado pertenece al inicio de la página: al bajar deja
   todo el alto útil al buscador y sus controles. */
.app-shell.catalog-compare-active .topbar { position: relative; }
.app-shell.catalog-compare-active .product-catalog-panel.catalog-mode--compare .catalog-sticky-controls { top: 0; }

.cloud-chip,
.live-pill,
.count-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.65);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.cloud-icon {
  color: var(--primary);
  font-size: 15px;
}

.cloud-chip[data-status="synced"] {
  border-color: rgba(36, 138, 99, .2);
  background: var(--success-soft);
  color: var(--success);
}

.cloud-chip[data-status="syncing"],
.cloud-chip[data-status="pending"],
.cloud-chip[data-status="connecting"] {
  border-color: rgba(111, 91, 211, .22);
  background: var(--primary-soft);
  color: var(--primary-deep);
}

.cloud-chip[data-status="offline"],
.cloud-chip[data-status="error"] {
  border-color: rgba(200, 122, 33, .25);
  background: var(--warning-soft);
  color: #945913;
}

.logout-button[hidden] {
  display: none;
}

.content-area {
  padding: 28px 34px 50px;
}

.view {
  display: none;
  animation: viewIn .22s ease;
}

.view.active {
  display: block;
}

@keyframes viewIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero-panel {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  padding: 28px 30px;
  border: 1px solid rgba(111, 91, 211, .15);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 86% 18%, rgba(111, 91, 211, .16), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(244,240,255,.9));
  box-shadow: var(--shadow-soft);
}

.hero-panel::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  right: -70px;
  bottom: -130px;
  border: 30px solid rgba(111, 91, 211, .05);
  border-radius: 50%;
}

.hero-panel h2 {
  max-width: 760px;
  margin: 8px 0 7px;
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.hero-panel p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.hero-actions {
  position: relative;
  z-index: 1;
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  flex-shrink: 0;
}

.primary-button,
.secondary-button,
.danger-button,
.text-button,
.icon-button,
.mode-button {
  border: 0;
  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.primary-button,
.secondary-button,
.danger-button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  border-radius: 11px;
  font-weight: 800;
}

.primary-button {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 20px rgba(111, 91, 211, .22);
}

.primary-button:hover {
  background: var(--primary-deep);
  transform: translateY(-1px);
  box-shadow: 0 11px 24px rgba(111, 91, 211, .27);
}

.secondary-button {
  border: 1px solid var(--line-strong);
  background: rgba(255,255,255,.82);
  color: var(--ink);
}

.secondary-button:hover {
  border-color: rgba(111, 91, 211, .35);
  background: var(--surface-solid);
  transform: translateY(-1px);
}

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

.danger-button:hover {
  background: #a93d4c;
}

.compact {
  min-height: 36px;
  padding: 0 13px;
  font-size: 12px;
}

.text-button {
  padding: 4px 0;
  background: transparent;
  color: var(--primary-deep);
  font-size: 12px;
  font-weight: 850;
}

.text-button:hover {
  text-decoration: underline;
}

.icon-button {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  font-size: 18px;
}

.icon-button:hover {
  background: rgba(111, 91, 211, .08);
  color: var(--primary-deep);
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.kpi-card {
  position: relative;
  overflow: hidden;
  min-height: 126px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.kpi-card::after {
  content: "";
  position: absolute;
  width: 72px;
  height: 72px;
  right: -22px;
  top: -22px;
  border-radius: 50%;
  background: var(--primary-soft);
}

.kpi-icon {
  position: relative;
  z-index: 1;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 17px;
  font-weight: 900;
}

.kpi-card.success .kpi-icon { background: var(--success-soft); color: var(--success); }
.kpi-card.warning .kpi-icon { background: var(--warning-soft); color: var(--warning); }
.kpi-card.info .kpi-icon { background: var(--info-soft); color: var(--info); }

.kpi-label {
  display: block;
  margin-top: 13px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .075em;
}

.kpi-value {
  display: block;
  margin-top: 3px;
  font-size: 27px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.035em;
}

.kpi-note {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.panel {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.panel-span-2 {
  grid-column: span 2;
}

.panel-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 15px;
  margin-bottom: 17px;
}

.panel-header h3,
.section-toolbar h2,
.backup-card h3,
.architecture-note h3 {
  margin: 3px 0 0;
  letter-spacing: -.025em;
}

.panel-header h3 {
  font-size: 18px;
}

.attention-list {
  display: grid;
  gap: 8px;
}

.attention-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(250, 248, 243, .72);
}

.attention-symbol {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 900;
}

.attention-symbol.danger { background: var(--danger-soft); color: var(--danger); }
.attention-symbol.warning { background: var(--warning-soft); color: var(--warning); }
.attention-symbol.info { background: var(--info-soft); color: var(--info); }
.attention-symbol.success { background: var(--success-soft); color: var(--success); }

.attention-copy strong,
.attention-copy span {
  display: block;
}

.attention-copy strong {
  font-size: 13px;
}

.attention-copy span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.status-chip {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.status-chip.available,
.status-chip.success { background: var(--success-soft); color: var(--success); }
.status-chip.in-transit,
.status-chip.info { background: var(--info-soft); color: var(--info); }
.status-chip.prepared,
.status-chip.primary { background: var(--primary-soft); color: var(--primary-deep); }
.status-chip.third-party,
.status-chip.warning { background: var(--warning-soft); color: var(--warning); }
.status-chip.quarantine,
.status-chip.danger { background: var(--danger-soft); color: var(--danger); }
.status-chip.neutral { background: #efede8; color: #6f6b61; }

.live-pill {
  color: var(--success);
  border-color: rgba(36,138,99,.2);
  background: var(--success-soft);
}

.live-pill span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  animation: pulse 1.8s infinite;
}

@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(36,138,99,.26); }
  50% { box-shadow: 0 0 0 6px rgba(36,138,99,0); }
}

.empty-state {
  min-height: 240px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 26px;
  border: 1px dashed var(--line-strong);
  border-radius: 15px;
  background: var(--surface-soft);
  color: var(--muted);
  text-align: center;
}

.compact-empty {
  min-height: 216px;
}

.empty-state strong {
  color: var(--ink);
}

.empty-state span {
  max-width: 360px;
  font-size: 12px;
}

.empty-icon {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
  border-radius: 13px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 22px;
}

.table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.data-table th,
.data-table td {
  padding: 12px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

.data-table th {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.data-table tr:last-child td {
  border-bottom: 0;
}

.data-table tbody tr:hover {
  background: rgba(111,91,211,.035);
}

tr[data-product-id] {
  cursor: pointer;
}

tr[data-event-product-id] {
  cursor: pointer;
}

.table-primary {
  font-weight: 800;
}

.table-secondary {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.mini-bar {
  width: 120px;
  max-width: 100%;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #ebe7df;
}

.mini-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--primary), #9b8ee5);
}

.timeline {
  position: relative;
  display: grid;
  gap: 0;
}

.timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 10px;
  padding: 0 0 16px;
}

.timeline-item:last-child {
  padding-bottom: 0;
}

.timeline-item:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 29px;
  left: 14px;
  bottom: -1px;
  width: 1px;
  background: var(--line);
}

.timeline-dot {
  position: relative;
  z-index: 1;
  width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface-solid);
  color: var(--primary-deep);
  font-size: 12px;
}

.timeline-copy strong,
.timeline-copy span {
  display: block;
}

.timeline-copy strong {
  font-size: 12px;
}

.timeline-copy span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

/* Scanner */
.scan-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(300px, .75fr);
  gap: 17px;
}

.scanner-console {
  padding: 24px;
  border: 1px solid rgba(111, 91, 211, .19);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(rgba(255,255,255,.93), rgba(255,255,255,.93)),
    repeating-linear-gradient(90deg, transparent, transparent 19px, rgba(111,91,211,.035) 20px);
  box-shadow: var(--shadow);
}

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

.scanner-heading h2 {
  margin: 4px 0 5px;
  font-size: 28px;
  letter-spacing: -.04em;
}

.scanner-heading p {
  max-width: 690px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.scanner-connection {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  padding: 8px 11px;
  border-radius: 999px;
  background: var(--success-soft);
  color: var(--success);
  font-size: 11px;
  font-weight: 850;
}

.scanner-connection span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.scanner-connection.reading {
  background: var(--primary-soft);
  color: var(--primary-deep);
}

.scanner-connection.error {
  background: var(--danger-soft);
  color: var(--danger);
}

.scanner-connection.focus {
  background: var(--warning-soft);
  color: var(--warning);
}

.mode-switcher {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 23px 0 18px;
}

.mode-button {
  min-height: 92px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 8px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
  color: var(--ink);
  text-align: left;
}

.mode-button > span {
  grid-row: 1 / 3;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #ece8df;
  color: var(--muted);
  font-size: 16px;
  font-weight: 900;
}

.mode-button strong {
  align-self: end;
  font-size: 12px;
}

.mode-button small {
  align-self: start;
  color: var(--muted);
  font-size: 9px;
}

.mode-button:hover {
  border-color: rgba(111,91,211,.35);
  transform: translateY(-1px);
}

.mode-button.active {
  border-color: rgba(111,91,211,.4);
  background: var(--primary-soft);
  box-shadow: inset 0 0 0 1px rgba(111,91,211,.12);
}

.mode-button.active > span {
  background: var(--primary);
  color: #fff;
}

.scan-settings {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 17px;
}

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

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

.form-field label,
.scan-entry > label,
.field-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.form-field input,
.form-field select,
.form-field textarea,
.search-box input,
.scan-input-shell input,
.modal input,
.modal select,
.modal textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: rgba(255,255,255,.88);
  color: var(--ink);
  padding: 0 12px;
}

.form-field textarea,
.modal textarea {
  min-height: 92px;
  padding-top: 11px;
  resize: vertical;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus,
.search-box input:focus,
.scan-input-shell input:focus,
.modal input:focus,
.modal select:focus,
.modal textarea:focus {
  border-color: var(--primary);
  outline: 3px solid rgba(111,91,211,.13);
}

.scan-entry {
  margin-top: 6px;
}

.camera-entry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 18px;
  padding: 14px 15px;
  border: 1px solid rgba(111, 91, 211, .2);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(240, 236, 255, .88), rgba(255, 255, 255, .82));
}

.camera-entry strong,
.camera-entry span {
  display: block;
}

.camera-entry strong {
  font-size: 13px;
}

.camera-entry > div > span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.camera-open-button {
  flex: 0 0 auto;
}

.scan-entry > label {
  display: block;
  margin-bottom: 7px;
}

.scan-input-shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
}

.scan-input-shell input {
  min-height: 62px;
  padding-left: 20px;
  border: 2px solid rgba(111,91,211,.34);
  border-radius: 14px;
  background: #fff;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 20px;
  font-weight: 750;
  letter-spacing: .035em;
  box-shadow: inset 0 0 0 5px rgba(111,91,211,.035);
}

.scan-input-shell input:focus {
  border-color: var(--primary);
  box-shadow: inset 0 0 0 5px rgba(111,91,211,.04), 0 0 0 4px rgba(111,91,211,.1);
}

.scan-input-shell .primary-button {
  min-width: 116px;
  border-radius: 14px;
}

.scan-beam {
  position: absolute;
  z-index: 2;
  top: 7px;
  bottom: 7px;
  left: 8px;
  width: 2px;
  border-radius: 999px;
  background: var(--primary);
  opacity: 0;
  pointer-events: none;
}

.scan-input-shell.scanning .scan-beam {
  opacity: 1;
  animation: scanBeam 1s ease-in-out infinite;
}

@keyframes scanBeam {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(min(560px, 55vw)); }
}

.input-help {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}

.input-help span {
  padding: 3px 6px;
  border-radius: 5px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 10px;
  font-weight: 900;
}

.scan-result {
  margin-top: 18px;
}

.product-result {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--surface-solid);
}

.product-result-head {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  padding: 17px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, #fff, var(--surface-soft));
}

.product-symbol {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 25px;
  font-weight: 900;
}

.product-result-head h3 {
  margin: 0 0 3px;
  font-size: 17px;
}

.product-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  color: var(--muted);
  font-size: 10px;
}

.product-result-stock {
  min-width: 100px;
  text-align: right;
}

.product-result-stock strong,
.product-result-stock span {
  display: block;
}

.product-result-stock strong {
  font-size: 27px;
  line-height: 1;
}

.product-result-stock span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.stock-breakdown {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}

.stock-cell {
  min-height: 80px;
  padding: 13px 15px;
  border-right: 1px solid var(--line);
}

.stock-cell:last-child {
  border-right: 0;
}

.stock-cell span,
.stock-cell strong,
.stock-cell small {
  display: block;
}

.stock-cell span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.stock-cell strong {
  margin-top: 5px;
  font-size: 20px;
}

.stock-cell small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.result-banner {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 14px 15px;
  border-radius: 13px;
}

.result-banner.success { background: var(--success-soft); color: var(--success); }
.result-banner.warning { background: var(--warning-soft); color: var(--warning); }
.result-banner.danger { background: var(--danger-soft); color: var(--danger); }
.result-banner.info { background: var(--info-soft); color: var(--info); }

.result-banner strong,
.result-banner span {
  display: block;
}

.result-banner span {
  margin-top: 2px;
  color: currentColor;
  opacity: .8;
  font-size: 11px;
}

.scan-side {
  display: grid;
  align-content: start;
  gap: 14px;
}

.sticky-panel {
  position: sticky;
  top: calc(var(--topbar-height) + 18px);
}

.session-body {
  display: grid;
  gap: 9px;
}

.session-empty {
  padding: 20px 12px;
  border: 1px dashed var(--line-strong);
  border-radius: 12px;
  color: var(--muted);
  text-align: center;
  font-size: 11px;
}

.session-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.session-line:last-child {
  border-bottom: 0;
}

.session-line strong,
.session-line span {
  display: block;
}

.session-line strong {
  font-size: 12px;
}

.session-line span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.quantity-control {
  display: inline-grid;
  grid-template-columns: 28px 34px 28px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 9px;
  overflow: hidden;
  background: #fff;
}

.quantity-control button {
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: var(--primary-deep);
  font-weight: 900;
}

.quantity-control button:hover {
  background: var(--primary-soft);
}

.quantity-control strong {
  text-align: center;
  font-size: 11px;
}

.session-footer {
  display: grid;
  gap: 8px;
  margin-top: 15px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.session-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
}

.session-summary-row strong {
  color: var(--ink);
}

.scanner-help-card {
  display: grid;
  gap: 9px;
}

.shortcut-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
}

kbd {
  min-width: 42px;
  padding: 5px 7px;
  border: 1px solid var(--line-strong);
  border-bottom-width: 2px;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  font-family: inherit;
  font-size: 9px;
  font-weight: 850;
  text-align: center;
}

/* Sections */
.section-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 17px;
}

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

.inline-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  white-space: nowrap;
  font-size: 12px;
}

.section-toolbar h2 {
  font-size: 28px;
}

.section-toolbar p {
  max-width: 720px;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.filter-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}

.catalog-filter-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
  min-width: 0;
}

.product-catalog-panel.catalog-mode--compare .catalog-sticky-controls {
  position: sticky;
  top: calc(var(--topbar-height) + 7px);
  z-index: 24;
  margin: -7px -7px 8px;
  padding: 7px;
  border: 1px solid rgba(228, 223, 212, .86);
  border-radius: 13px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 7px 22px rgba(43, 38, 61, .07);
  backdrop-filter: blur(16px);
}

.product-catalog-panel.catalog-mode--compare .catalog-sticky-controls .catalog-filter-bar {
  position: static;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.catalog-quick-filters {
  display: flex;
  gap: 7px;
  min-width: 0;
  margin-top: 7px;
  padding: 0 1px 1px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.catalog-mode--manage .catalog-quick-filters { display: none; }

.catalog-quick-filters button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: #fff;
  color: #5f596b;
  font: inherit;
  font-size: 10px;
  font-weight: 780;
  cursor: pointer;
  touch-action: manipulation;
}

.catalog-quick-filters button.active {
  border-color: #b6a6f4;
  background: var(--primary-soft);
  color: var(--primary-deep);
  box-shadow: inset 0 0 0 1px rgba(108, 82, 224, .08);
}

.catalog-quick-filters button:focus-visible,
.catalog-search-history button:focus-visible {
  outline: 3px solid rgba(111,79,224,.2);
  outline-offset: 2px;
}

.catalog-quick-separator {
  flex: 0 0 1px;
  align-self: stretch;
  min-height: 28px;
  margin-inline: 2px;
  background: #e2dce9;
}

.catalog-quick-label {
  flex: 0 0 auto;
  align-self: center;
  color: #736b82;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.catalog-provider-quick-filters {
  display: contents;
}

.catalog-provider-quick-filters button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.catalog-provider-quick-filters button small {
  color: #777083;
  font-size: 8px;
  font-weight: 750;
}

.catalog-provider-quick-filters button.active small { color: var(--primary-deep); }

.catalog-search-history {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
  margin-top: 7px;
  padding: 8px 10px;
  border: 1px solid #e6e0ed;
  border-radius: 11px;
  background: #fbfaff;
  overflow-x: auto;
}

.catalog-search-history[hidden] { display: none; }
.catalog-search-history > div { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.catalog-search-history > div > strong {
  color: #736b82;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.catalog-history-chip {
  display: inline-flex;
  flex: 0 0 auto;
}
.catalog-search-history .catalog-history-query {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid #ddd6e8;
  border-radius: 999px 0 0 999px;
  background: #fff;
  color: #554d63;
  font: inherit;
  font-size: 9px;
  font-weight: 740;
  cursor: pointer;
}
.catalog-search-history .catalog-history-query:hover { border-color: #b9ace7; color: var(--primary-deep); }
.catalog-search-history .catalog-history-query small { color: var(--muted); font-size: 8px; }
.catalog-search-history .catalog-history-delete {
  width: 28px;
  min-height: 30px;
  padding: 0;
  border: 1px solid #ddd6e8;
  border-left: 0;
  border-radius: 0 999px 999px 0;
  background: #fff;
  color: #8b8495;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.catalog-search-history .catalog-history-delete:hover { background: #fff3f3; color: var(--danger); }
.catalog-search-history .catalog-history-clear {
  flex: 0 0 auto;
  align-self: center;
  min-height: 30px;
  padding: 0 7px;
  border: 0;
  background: transparent;
  color: #746b80;
  font: inherit;
  font-size: 9px;
  font-weight: 780;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

.quick-filter-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 50%;
  background: #928b9b;
}
.quick-filter-dot--stock { background: var(--success); }
.quick-filter-dot--incoming { background: #d59a29; }
.quick-filter-dot--own { background: var(--primary); }

@media (max-width: 700px) {
  .product-catalog-panel.catalog-mode--compare .catalog-filter-bar {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .product-catalog-panel.catalog-mode--compare .catalog-filter-details {
    grid-column: 1;
  }

  .product-catalog-panel.catalog-mode--compare .catalog-clear-button {
    grid-column: 2;
    width: auto;
    min-width: 92px;
  }
}

.catalog-view-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.catalog-view-heading > div:first-child { display: grid; gap: 2px; }
.catalog-view-heading strong { font-size: 14px; }
.catalog-view-heading span { color: var(--muted); font-size: 11px; }
.catalog-view-switch {
  display: inline-flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}
.catalog-view-switch button {
  min-height: 34px;
  padding: 0 11px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 11px;
  font-weight: 780;
  cursor: pointer;
}
.catalog-view-switch button.active { background: #fff; color: var(--primary-deep); box-shadow: 0 1px 5px rgba(45,32,82,.12); }

.catalog-filter-bar .search-box { min-width: 240px; }

.catalog-filter-details,
.catalog-filter-options {
  display: contents;
}

.catalog-filter-details summary { display: none; }

.catalog-filter-field { display: contents; }
.catalog-filter-field > span { display: none; }

.catalog-filter-options select {
  flex: 0 1 155px;
  min-width: 145px;
  min-height: 42px;
  padding: 0 11px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
}

.search-box {
  flex: 1;
  min-width: 200px;
  position: relative;
  display: flex;
  align-items: center;
}

.compact-search {
  min-width: 150px;
}

.search-box > span {
  position: absolute;
  left: 12px;
  color: var(--muted);
}

.search-box input {
  padding-left: 36px;
}

.filter-row > select {
  flex: 0 1 190px;
  min-width: 180px;
  min-height: 42px;
  padding: 0 11px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
}

.catalog-clear-button {
  min-height: 42px;
  padding-inline: 14px;
}

.catalog-clear-button[hidden] {
  display: none;
}

.catalog-facet-browser {
  display: grid;
  gap: 6px;
  margin: -2px 0 11px;
  padding: 9px 10px;
  border: 1px solid #e7e1ef;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(251,249,255,.94), rgba(247,250,255,.94));
}

.catalog-facet-row {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.catalog-facet-label {
  color: #736b82;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.catalog-facet-track {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
  padding: 1px 2px 3px;
}

.catalog-facet-chip {
  min-height: 31px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid #ddd6e8;
  border-radius: 10px;
  background: rgba(255,255,255,.9);
  color: #514a5d;
  font: inherit;
  font-size: 10px;
  font-weight: 760;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}

.catalog-facet-chip:hover { border-color: #bdb0ed; color: var(--primary-deep); transform: translateY(-1px); }
.catalog-facet-chip:focus-visible { outline: 3px solid rgba(111,79,224,.2); outline-offset: 2px; }
.catalog-facet-chip.active { border-color: #a990f2; background: var(--primary-soft); color: var(--primary-deep); }
.catalog-facet-chip small {
  min-width: 21px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #f0edf5;
  color: #756e80;
  font-size: 9px;
  font-weight: 850;
  text-align: center;
}
.catalog-facet-chip.active small { background: rgba(111,79,224,.14); color: var(--primary-deep); }
.catalog-facet-chip .catalog-facet-stock { background: #edf7f0; color: #267447; white-space: nowrap; }
.catalog-facet-chip.active .catalog-facet-stock { background: #e4f3e9; color: #1f6b3f; }
.catalog-specification-row[hidden] { display: none; }

.catalog-result-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.catalog-result-toolbar > div:first-child { flex: 1; min-width: 0; }

.catalog-result-toolbar .catalog-list-summary { flex: 1; margin: 0; padding-top: 7px; }
.catalog-copy-comparison { min-height: 38px; flex: 0 0 auto; padding-inline: 12px; }
.catalog-comparison-actions { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.catalog-share-comparison { min-height: 38px; padding-inline: 12px; }
.catalog-sync-freshness { min-height: 18px; margin-top: 2px; color: #5f7569; font-size: 10px; font-weight: 720; }
.catalog-sync-freshness .is-warning { color: var(--warning); }
.catalog-health-details { width: max-content; max-width: 100%; }
.catalog-health-details > summary {
  width: max-content;
  max-width: 100%;
  min-height: 22px;
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  cursor: pointer;
}
.catalog-health-details > summary::-webkit-details-marker { display: none; }
.catalog-health-headline { min-width: 0; }
.catalog-health-action { color: var(--primary-deep); font-size: 9px; white-space: nowrap; }
.catalog-health-action::after { content: " ▾"; }
.catalog-health-details[open] .catalog-health-action::after { content: " ▴"; }
.catalog-provider-health-list { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.catalog-provider-health {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 7px;
  padding: 3px 7px;
  border: 1px solid #dfe9e3;
  border-radius: 999px;
  background: #f6faf8;
  color: #627269;
  line-height: 1.25;
}
.catalog-provider-health strong { color: #31493d; }
.catalog-provider-health.is-warning { border-color: #f0d9b0; background: #fffaf0; }

.catalog-columns { position: relative; }
.catalog-columns > summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 0 13px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}
.catalog-columns > summary::-webkit-details-marker { display: none; }
.catalog-columns-menu {
  position: absolute;
  z-index: 20;
  right: 0;
  top: calc(100% + 6px);
  width: 210px;
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--shadow);
}
.catalog-columns-menu label { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.table-sort-button { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; }
.table-sort-button:hover { color: var(--primary-deep); }
.table-sort-button.active { color: var(--primary-deep); }
.table-sort-button.active::after { margin-left: 5px; font-size: 10px; content: "↑"; }
.table-sort-button.active[data-sort-direction="down"]::after { content: "↓"; }
.product-table [hidden] { display: none; }

.filter-row > input[type="date"] {
  flex: 0 1 170px;
  min-width: 170px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
}

.movement-sensitive-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  white-space: nowrap;
}

.movement-sensitive-toggle input {
  margin: 0;
}

.product-cell {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-width: 290px;
}

.product-thumb-shell {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.product-mini-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  padding: 3px;
}

.product-mini-icon {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 15px;
  font-weight: 900;
}

.catalog-list-summary {
  min-height: 26px;
  margin: -3px 0 10px;
  color: var(--muted);
  font-size: 12px;
}

.catalog-list-summary strong {
  color: var(--ink);
  font-size: 14px;
}

.catalog-list-summary span:not(.catalog-summary-divider) {
  color: var(--primary-deep);
}

.catalog-summary-divider {
  margin: 0 5px;
}

.catalog-summary-filter {
  min-height: 28px;
  margin: -5px 0;
  padding: 3px 7px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 760;
  cursor: pointer;
}

.catalog-summary-filter:hover {
  border-color: var(--line-strong);
  background: var(--surface-soft);
  color: var(--primary-deep);
}

.catalog-summary-filter:focus-visible {
  outline: 3px solid rgba(111,79,224,.22);
  outline-offset: 2px;
}

.catalog-summary-filter.active {
  border-color: #bcaaf5;
  background: var(--primary-soft);
  color: var(--primary-deep);
}

.catalog-list-footer {
  display: flex;
  justify-content: center;
  padding: 16px 0 2px;
}

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

.product-card-list { display: none; }
#view-products.catalog-view--compare > .section-toolbar { display: none; }
.product-catalog-panel.catalog-mode--compare .catalog-table-navigation,
.product-catalog-panel.catalog-mode--compare .catalog-table-wrap { display: none !important; }
.product-catalog-panel.catalog-mode--compare .product-card-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
  gap: 12px;
}
.supplier-search-state {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: -2px 0 11px;
  padding: 8px 10px;
  border: 1px solid #dbe3f5;
  border-radius: 10px;
  background: #f6f9ff;
  color: #50617c;
  font-size: 11px;
}
.supplier-search-state[hidden] { display: none; }
.supplier-search-state strong { color: var(--ink); }
.supplier-search-state--error { border-color: #f2d2c2; background: #fff8f3; }
.supplier-search-spinner {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  border: 2px solid #d8d0f1;
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: supplier-search-spin .8s linear infinite;
}
@keyframes supplier-search-spin { to { transform: rotate(360deg); } }

.purchase-card {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid #e4dfeb;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(45,32,82,.055);
}
.purchase-card__image {
  height: 128px;
  min-height: 0;
  overflow: hidden;
  display: grid;
  place-items: center;
  padding: 12px 18px;
  border-bottom: 1px solid #eeeaf3;
  background: linear-gradient(180deg, #fff, #fbfbfd);
}
.purchase-card__image img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 104px;
  min-width: 0;
  min-height: 0;
  object-fit: contain;
}
.purchase-card__image--empty { color: #8d8796; font-size: 10px; background: linear-gradient(180deg, #fff, #fbfbfd); }
.purchase-card__image--empty span {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border: 1px dashed #d9d4df;
  border-radius: 12px;
  background: #fff;
  font-weight: 760;
}
.purchase-card__body { flex: 1; display: flex; flex-direction: column; gap: 9px; padding: 12px; }
.purchase-card__identity { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.purchase-card__identity > div { min-width: 0; display: grid; gap: 3px; }
.purchase-card__identity > div > strong { overflow-wrap: anywhere; color: #17152a; font-size: 13px; line-height: 1.32; }
.purchase-card__identity > div > span { color: var(--muted); font-size: 9px; font-weight: 760; text-transform: uppercase; letter-spacing: .045em; }
.purchase-card__identity > .status-chip { flex: 0 0 auto; font-size: 8px; }
.purchase-card__specs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-height: 20px;
}
.purchase-card__specs span {
  padding: 3px 6px;
  border: 1px solid #e1dbea;
  border-radius: 999px;
  background: #faf8ff;
  color: #645b72;
  font-size: 8px;
  font-weight: 780;
  line-height: 1.1;
}
.purchase-card__description {
  min-height: 64px;
  margin: 0;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  color: #5d5868;
  font-size: 11px;
  line-height: 1.45;
}
.purchase-card__suppliers { display: grid; gap: 6px; margin-top: auto; }
.purchase-card__supplier.is-secondary { display: none; }
.purchase-card__suppliers.is-expanded .purchase-card__supplier.is-secondary { display: grid; }
.purchase-card__supplier {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border-left: 3px solid #ddd6e8;
  border-radius: 9px;
  background: #f8f7fa;
}
.purchase-card__supplier > div { min-width: 0; display: grid; gap: 2px; }
.purchase-card__supplier > div:last-child { text-align: right; }
.purchase-card__supplier small { color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .05em; }
.purchase-card__supplier > div:last-child strong { white-space: nowrap; font-size: 12px; }
.ocrl-price-toggle {
  position: relative;
  z-index: 1;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #a84918;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.ocrl-price-toggle .supplier-color-badge { pointer-events: none; }
.purchase-card__supplier > div:last-child { pointer-events: none; }
.ocrl-price-toggle__flip {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 850;
  line-height: 1;
  transition: transform .2s ease;
}
.ocrl-price-toggle[data-ocrl-price-mode="list"] .ocrl-price-toggle__flip { transform: rotate(180deg); }
.ocrl-price-toggle small {
  overflow: hidden;
  color: #a84918;
  font-size: 7px;
  font-weight: 800;
  line-height: 1.1;
  text-overflow: ellipsis;
  text-transform: none;
  letter-spacing: 0;
  white-space: nowrap;
}
.ocrl-price-toggle:hover .supplier-color-badge,
.ocrl-price-toggle:focus-visible .supplier-color-badge { border-color: #e58b58; box-shadow: 0 0 0 2px rgba(229, 139, 88, .16); }
[data-ocrl-price-scope].is-flipping [data-ocrl-price-value] { animation: ocrl-price-flip .2s ease; }
@keyframes ocrl-price-flip {
  0% { opacity: 1; transform: rotateX(0deg); }
  50% { opacity: .28; transform: rotateX(78deg); }
  100% { opacity: 1; transform: rotateX(0deg); }
}
.purchase-card__stock {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 780;
}
.purchase-card__stock::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 15%, transparent);
}
.purchase-card__stock--available { color: var(--success); }
.purchase-card__stock--incoming { color: #b7791f; }
.purchase-card__stock--consult { color: #b36b00; }
.purchase-card__stock--unavailable { color: var(--danger); }
.purchase-card__incoming { color: #8a6d2e; font-size: 8px; font-weight: 760; line-height: 1.25; }
.purchase-card__incoming.is-stale { color: #9a6212; }
.purchase-card__observed { color: var(--muted); font-size: 7px; font-weight: 680; line-height: 1.2; }
.purchase-card__supplier--empty { display: block; color: var(--muted); font-size: 10px; }
.purchase-card__supplier.is-best {
  box-shadow: inset 0 0 0 1px rgba(55, 45, 82, .08), 0 2px 7px rgba(45, 32, 82, .045);
}
.purchase-card__supplier-toggle {
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px;
  border: 1px dashed #d8d1e6;
  border-radius: 9px;
  background: #fff;
  color: var(--primary-deep);
  cursor: pointer;
  font: inherit;
}
.purchase-card__supplier-toggle strong { font-size: 10px; }
.purchase-card__supplier-toggle span { color: var(--muted); font-size: 9px; font-weight: 720; }
.purchase-card__supplier-toggle:hover { border-color: #ad9be0; background: #fbf9ff; }
.quick-filter-dot--manual { background: #f08c45; }
.purchase-card__sale-price-value {
  font-size: 15px;
  font-weight: 850;
  line-height: 1;
}
.purchase-card__footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: end;
  padding-top: 8px;
  border-top: 1px solid #eeeaf3;
}
.purchase-card__footer-price {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  min-height: 46px;
  padding: 7px 8px;
  border: 1px solid #ece7f6;
  border-radius: 11px;
  background: linear-gradient(135deg, #fbfaff 0%, #f7f3ff 100%);
}
.purchase-card__footer-label {
  min-width: 0;
  display: grid;
  justify-items: start;
  gap: 3px;
}
.purchase-card__footer-label span {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #ece6ff;
  color: #6750c8;
  font-size: 8px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}
.purchase-card__footer-price .own-price-copy-button {
  width: auto;
  flex: 0 0 auto;
  min-height: 32px;
  padding: 2px 0 2px 6px;
  touch-action: manipulation;
}
.purchase-card__footer-price .own-price-copy-value > * {
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}
.purchase-card__footer-price .own-price-copy-icon { width: 28px; height: 28px; }
.purchase-card__footer-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 8px;
}
.purchase-card__action-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.purchase-card__action-buttons .primary-button,
.purchase-card__action-buttons .secondary-button { min-height: 34px; padding-inline: 9px; font-size: 9px; }

.purchase-quote {
  display: grid;
  gap: 12px;
  margin: 10px 0 14px;
  padding: 15px;
  border: 1px solid #d8cef4;
  border-radius: 15px;
  background: linear-gradient(135deg, #fbf9ff, #f4f8ff);
  box-shadow: 0 10px 25px rgba(56, 42, 104, .07);
}
.purchase-quote[hidden] { display: none; }
.purchase-quote__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.purchase-quote__header h3 { margin: 3px 0; color: #201b35; font-size: 16px; }
.purchase-quote__header p { margin: 0; color: var(--muted); font-size: 10px; }
.purchase-quote__header > div:last-child { display: flex; align-items: center; gap: 7px; }
.purchase-quote__lines { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 7px; }
.purchase-quote__lines label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 62px auto;
  align-items: center;
  gap: 5px 8px;
  padding: 8px 9px;
  border: 1px solid #e5dff2;
  border-radius: 10px;
  background: rgba(255,255,255,.84);
}
.purchase-quote__lines label > span { min-width: 0; overflow-wrap: anywhere; color: #25203b; font-size: 10px; font-weight: 800; }
.purchase-quote__lines input { width: 62px; min-height: 34px; padding: 5px 7px; border: 1px solid #d7cfe6; border-radius: 8px; background: #fff; }
.purchase-quote__lines small { grid-column: 1 / 3; color: var(--muted); font-size: 8px; }
.purchase-quote__lines .icon-button { grid-column: 3; grid-row: 1 / 3; }
.purchase-quote__plans { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 10px; }
.purchase-quote__recommended,
.purchase-quote__same { display: grid; gap: 7px; padding: 11px; border-radius: 11px; background: #fff; border: 1px solid #e3dced; }
.purchase-quote__recommended > div:first-child { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.purchase-quote__recommended > div:first-child > span:first-child,
.purchase-quote__same > span { color: #63577b; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.purchase-quote__recommended > strong { color: #2b1d5d; font-size: 21px; }
.purchase-quote__recommended > small { color: var(--muted); font-size: 9px; }
.purchase-quote__recommended > div:last-child { display: grid; gap: 3px; color: #4f4760; font-size: 9px; }
.purchase-quote__same { align-content: start; }
.purchase-quote__supplier { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 7px 8px; border-radius: 8px; background: #f6fbf8; }
.purchase-quote__supplier strong, .purchase-quote__supplier span { font-size: 10px; }
.purchase-quote__supplier small { grid-column: 1 / -1; color: var(--muted); font-size: 8px; }
.purchase-quote__supplier.is-incomplete { background: #fff8ef; }
@media (max-width: 760px) {
  .purchase-quote { padding: 11px; }
  .purchase-quote__header { display: grid; }
  .purchase-quote__header > div:last-child { display: grid; grid-template-columns: 1fr auto; }
  .purchase-quote__plans { grid-template-columns: 1fr; }
  .purchase-card__footer-actions { align-items: stretch; }
  .purchase-card__action-buttons { display: grid; grid-template-columns: 1fr 1fr; }
}
.purchase-card__footer-actions > div { display: grid; gap: 2px; }
.purchase-card__footer small { color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .05em; }
.purchase-card__footer strong { font-size: 10px; }
.purchase-card__footer .secondary-button { min-height: 34px; padding-inline: 10px; font-size: 10px; }
.purchase-card__pending { color: #8a6a16; font-size: 9px; font-weight: 760; }
.catalog-grid-empty { grid-column: 1 / -1; min-height: 150px; display: grid; place-items: center; align-content: center; gap: 7px; color: var(--muted); text-align: center; }
.catalog-grid-empty strong { color: var(--ink); }

.stock-state-uncounted { color: #a16207; }
.stock-state-confirmed_zero { color: var(--muted); }
.stock-state-confirmed_positive { color: var(--success); }

.supplier-preview {
  display: grid;
  gap: 2px;
  min-width: 145px;
}

.supplier-preview strong {
  font-size: 12px;
}

.supplier-preview span,
.supplier-preview small,
.external-availability,
.stock-compact-warning {
  color: var(--muted);
  font-size: 10px;
}

.supplier-preview small {
  color: var(--primary-deep);
}

.supplier-color-badge {
  display: inline-flex !important;
  align-items: center;
  width: max-content;
  max-width: 100%;
  min-height: 23px;
  padding: 3px 9px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.1;
  letter-spacing: .025em;
}

.supplier-color-badge--getterson {
  color: #2946a6 !important;
  border-color: #c8d5ff;
  background: #e9efff;
}

.supplier-color-badge--ocrl {
  color: #a84918 !important;
  border-color: #ffd0b4;
  background: #fff0e5;
}

.supplier-color-badge--neutral {
  color: #625a73 !important;
  border-color: #ded8e8;
  background: #f5f2f8;
}

.supplier-preview {
  padding: 6px 8px;
  border-left: 3px solid transparent;
  border-radius: 9px;
}

.supplier-tone--getterson {
  border-color: #becdff !important;
  background: linear-gradient(135deg, #f2f5ff, #e8eeff) !important;
}

.supplier-tone--ocrl {
  border-color: #ffcaaa !important;
  background: linear-gradient(135deg, #fff7f0, #ffeadb) !important;
}

.product-catalog-card__identity-button {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.product-catalog-card__identity-button:hover strong,
.product-catalog-card__identity-button:focus-visible strong {
  color: var(--primary-deep);
}

.product-catalog-card__identity-button:focus-visible {
  outline: 3px solid rgba(111, 79, 224, .2);
  outline-offset: 5px;
  border-radius: 10px;
}

.external-availability {
  margin-top: 5px;
  color: var(--success);
  white-space: nowrap;
}

.stock-compact-warning {
  display: inline-block;
  margin-top: 5px;
  color: #b45309;
  white-space: nowrap;
}

.product-table tbody tr:hover {
  background: #faf9ff;
}

.product-table td {
  vertical-align: middle;
  padding-top: 9px;
  padding-bottom: 9px;
}

.product-table td[data-catalog-col="own-stock"] .table-secondary { display: none; }

.product-table {
  min-width: 1180px;
}

.catalog-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}

.catalog-table-navigation {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 34px minmax(120px, 1fr) 34px;
  align-items: center;
  gap: 7px;
  margin: 0 0 7px;
  padding: 6px 8px;
  border: 1px solid #e5dfeb;
  border-radius: 10px;
  background: linear-gradient(135deg, #fbf9ff, #f7f5fb);
}

.catalog-table-navigation[hidden] { display: none !important; }
.catalog-table-navigation__label { color: #736b82; font-size: 10px; font-weight: 800; white-space: nowrap; }
.catalog-table-navigation__button {
  width: 34px;
  height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #d9d1e3;
  border-radius: 8px;
  background: #fff;
  color: var(--primary-deep);
  font: inherit;
  font-size: 16px;
  font-weight: 850;
  cursor: pointer;
}
.catalog-table-navigation__button:hover:not(:disabled) { border-color: #bcaaf2; background: #f3efff; }
.catalog-table-navigation__button:disabled { opacity: .35; cursor: default; }
.catalog-table-scrollbar {
  width: 100%;
  min-width: 0;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  accent-color: #745fc0;
  cursor: ew-resize;
}
.catalog-table-scrollbar::-webkit-slider-runnable-track { height: 8px; border-radius: 999px; background: #ddd6e8; }
.catalog-table-scrollbar::-webkit-slider-thumb { width: 28px; height: 18px; margin-top: -5px; border: 2px solid #fff; border-radius: 999px; background: #806bd0; box-shadow: 0 1px 4px rgba(66,45,120,.25); -webkit-appearance: none; }
.catalog-table-scrollbar::-moz-range-track { height: 8px; border-radius: 999px; background: #ddd6e8; }
.catalog-table-scrollbar::-moz-range-thumb { width: 28px; height: 18px; border: 2px solid #fff; border-radius: 999px; background: #806bd0; box-shadow: 0 1px 4px rgba(66,45,120,.25); }
.catalog-table-scrollbar:focus-visible { outline: 3px solid rgba(111,79,224,.22); outline-offset: 3px; border-radius: 999px; }
.catalog-table-wrap::-webkit-scrollbar { height: 12px; }
.catalog-table-wrap::-webkit-scrollbar-track { background: #e9e4f0; border-radius: 999px; }
.catalog-table-wrap::-webkit-scrollbar-thumb { min-width: 44px; border: 2px solid #e9e4f0; border-radius: 999px; background: #9784d7; }
.catalog-table-wrap::-webkit-scrollbar-thumb:hover { background: #745fc0; }

.product-table th:nth-child(1),
.product-table td:nth-child(1) {
  width: 34%;
}

.product-table th:nth-child(2),
.product-table td:nth-child(2) {
  width: 15%;
}

.product-table th:nth-child(3),
.product-table td:nth-child(3) {
  width: 15%;
}

.product-table th:nth-child(4),
.product-table td:nth-child(4) {
  width: 18%;
}

.product-table th:nth-child(5),
.product-table td:nth-child(5) {
  width: 10%;
}

.product-actions {
  min-width: 108px;
  white-space: nowrap;
}

.readonly-value {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-soft);
  font-weight: 800;
}

.finance-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 14px; }
.finance-rate-card, .finance-stat-card { display: grid; gap: 7px; align-content: center; min-height: 150px; }
.finance-rate-card > strong { color: var(--primary-deep); font-size: clamp(34px, 5vw, 58px); line-height: 1; }
.finance-rate-card > span, .finance-stat-card > span, .finance-rate-card > small, .finance-stat-card > small { color: var(--muted); }
.finance-stat-card > strong { font-size: 32px; }
.simple-history-list { display: grid; }
.simple-history-list > div { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
.simple-history-list > div:last-child { border-bottom: 0; }
.simple-history-list span, .simple-history-list small { color: var(--muted); }

.internal-price-list-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin-top: 14px;
}

.internal-price-list-card > div:first-child { display: grid; gap: 6px; }
.internal-price-list-card p, .internal-price-list-card small { color: var(--muted); }
.internal-price-list-card p { max-width: 850px; }
.internal-price-list-actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.price-sync-review-card { margin-top: 14px; }
.price-sync-review-list { display: grid; gap: 8px; }
.price-sync-review-list > button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  padding: 11px 12px;
  border: 1px solid #efd8a5;
  border-radius: 10px;
  background: #fffaf0;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.price-sync-review-list > button span { display: grid; gap: 3px; min-width: 0; }
.price-sync-review-list small { color: var(--muted); }
.price-sync-review-list b { flex: 0 0 auto; color: var(--primary); font-size: 11px; }

.price-intelligence-section { display: grid; gap: 12px; margin-top: 16px; }
.price-intelligence-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.price-intelligence-heading > div:first-child { display: grid; gap: 5px; }
.price-intelligence-heading p { max-width: 850px; color: var(--muted); }
.price-intelligence-controls { display: flex; gap: 8px; flex: 0 0 auto; }
.price-intelligence-controls select {
  min-height: 42px;
  padding: 0 11px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
}
.price-intelligence-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.price-intelligence-kpis button {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.price-intelligence-kpis button:hover { border-color: var(--primary); box-shadow: 0 8px 20px rgba(95, 72, 190, .08); }
.price-intelligence-kpis span { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.price-intelligence-kpis strong { font-size: 24px; line-height: 1; }
.price-intelligence-kpis small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.price-intelligence-results { padding: 14px; }
.price-intelligence-results .panel-header small, .price-intelligence-limit { color: var(--muted); }
.price-intelligence-result-meta { display: flex !important; align-items: center; justify-content: flex-end; flex: 0 0 auto; gap: 8px !important; }
.price-intelligence-limit { margin: 10px 2px 0; font-size: 11px; }

.catalog-price-state { display: grid; justify-items: start; gap: 4px; min-width: 130px; }
.catalog-price-state small { color: var(--muted); font-size: 10px; white-space: nowrap; }
.catalog-price-state .catalog-price-source,
.catalog-price-source { white-space: normal; }
.catalog-price-source.unverified,
.product-price-intelligence__source.unverified,
.price-source-warning { color: #a24b1d !important; font-weight: 750; }
.price-source-link {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  color: var(--primary-deep);
  font-weight: 800;
  text-decoration: none;
}
.price-source-link:hover { text-decoration: underline; }

.product-price-intelligence {
  display: grid;
  gap: 12px;
  margin: 12px 0 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: 12px;
  background: var(--surface-soft);
}
.product-price-intelligence.danger { border-left-color: var(--danger); background: var(--danger-soft); }
.product-price-intelligence.warning { border-left-color: var(--warning); background: var(--warning-soft); }
.product-price-intelligence.info { border-left-color: var(--info); background: var(--info-soft); }
.product-price-intelligence.success { border-left-color: var(--success); background: var(--success-soft); }
.product-price-intelligence__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.product-price-intelligence__head > div { display: grid; gap: 4px; }
.product-price-intelligence__head > div > strong { font-size: 16px; }
.product-price-intelligence__head p { color: var(--muted); font-size: 12px; }
.product-price-intelligence__suppliers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.product-price-intelligence__suppliers > div { display: grid; gap: 3px; min-width: 0; padding: 10px; border: 1px solid rgba(15, 23, 42, .08); border-radius: 10px; background: rgba(255,255,255,.75); }
.product-price-intelligence__suppliers span { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.product-price-intelligence__suppliers small, .product-price-intelligence__source { color: var(--muted); font-size: 10px; line-height: 1.4; }

.own-price-reference-note {
  display: grid;
  gap: 3px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(59, 130, 246, .2);
  color: var(--info);
}

.code-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.alias-stack {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.code-row {
  display: grid;
  gap: 3px;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 5px 7px 6px;
  border-radius: 8px;
  background: #f5f4ef;
  color: #4e4a40;
  overflow: hidden;
}

.code-row small {
  color: var(--muted);
  font-size: 10px;
  overflow-wrap: anywhere;
}

.code-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 7px;
  border-radius: 6px;
  background: #f0eee9;
  color: #625e55;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
}

.alias-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 9px;
  font-weight: 700;
}

.code-pill.internal {
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-weight: 800;
}

.location-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}

.location-card {
  position: relative;
  overflow: hidden;
  min-height: 220px;
  padding: 19px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.location-card::after {
  content: attr(data-code);
  position: absolute;
  right: 13px;
  bottom: 9px;
  color: rgba(39,37,49,.045);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 28px;
  font-weight: 900;
}

.location-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.location-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 19px;
}

.location-card h3 {
  margin: 13px 0 3px;
  font-size: 16px;
}

.compact-meta {
  display: grid;
  gap: 4px;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 12px;
}

.compact-meta span {
  display: block;
}

.location-path {
  min-height: 31px;
  color: var(--muted);
  font-size: 10px;
}

.location-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 14px;
}

.location-metric {
  padding: 10px;
  border-radius: 10px;
  background: var(--surface-soft);
}

.location-metric span,
.location-metric strong {
  display: block;
}

.location-metric span {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .065em;
}

.location-metric strong {
  margin-top: 3px;
  font-size: 17px;
}

.location-actions {
  margin-top: 12px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.location-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.location-detail-tab-controls {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.location-detail-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 11px;
  background: var(--surface-soft);
  color: var(--ink);
  font-size: 11px;
  font-weight: 700;
}

.location-detail-tab.active {
  border-color: var(--primary-soft);
  background: var(--primary-soft);
  color: var(--primary-deep);
}

.location-tab-panel {
  display: none;
}

.location-tab-panel.active {
  display: block;
}

.location-detail-inventory-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.location-detail-inventory-header h3 {
  margin: 0;
}

.summary-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin: 10px 0 14px;
}

.movement-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 15px;
}

.summary-card {
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.summary-card span,
.summary-card strong {
  display: block;
}

.summary-card span {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.summary-card strong {
  margin-top: 4px;
  font-size: 21px;
}

.pending-transfers-panel {
  margin-bottom: 15px;
}

.count-pill {
  min-width: 34px;
  justify-content: center;
  color: var(--primary-deep);
  background: var(--primary-soft);
  border-color: transparent;
  font-weight: 900;
}

.pending-transfer-list {
  display: grid;
  gap: 9px;
}

.pending-transfer-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
}

.transfer-symbol {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--info-soft);
  color: var(--info);
  font-weight: 900;
}

.pending-transfer-card strong,
.pending-transfer-card span {
  display: block;
}

.pending-transfer-card span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.event-legs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.leg-chip {
  display: inline-flex;
  padding: 4px 6px;
  border-radius: 6px;
  font-size: 9px;
  font-weight: 800;
}

.leg-chip.positive { background: var(--success-soft); color: var(--success); }
.leg-chip.negative { background: var(--danger-soft); color: var(--danger); }

.count-session-list {
  display: grid;
  gap: 10px;
}

.count-session-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
}

.count-session-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--success-soft);
  color: var(--success);
  font-weight: 900;
}

.count-session-card strong,
.count-session-card span {
  display: block;
}

.count-session-card span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.backup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}

.backup-card {
  min-height: 250px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.backup-icon {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 22px;
  font-weight: 900;
}

.backup-card p {
  flex: 1;
  color: var(--muted);
  font-size: 12px;
}

.danger-card .backup-icon {
  background: var(--danger-soft);
  color: var(--danger);
}

.file-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.architecture-note {
  display: grid;
  grid-template-columns: minmax(500px, 1.2fr) minmax(0, 1fr);
  align-items: center;
  gap: 30px;
  margin-top: 15px;
}

.architecture-diagram {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 150px;
  padding: 20px;
  border-radius: 15px;
  background: var(--surface-soft);
}

.architecture-diagram > span {
  color: var(--muted);
  font-weight: 900;
}

.arch-node {
  min-width: 105px;
  padding: 14px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 11px;
  background: #fff;
  text-align: center;
  font-weight: 850;
}

.arch-node small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 600;
}

.arch-node.active {
  border-color: rgba(111,91,211,.35);
  background: var(--primary-soft);
  color: var(--primary-deep);
}

.arch-node.future {
  border-style: dashed;
  color: var(--muted);
}

.product-detail {
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(0, 1fr);
}

.product-detail-row {
  display: grid;
  gap: 6px;
}

.product-detail-row-top {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.product-detail-row-bottom {
  grid-template-columns: minmax(0, 42%) minmax(0, 58%);
}

.product-detail .product-detail-section {
  align-self: stretch;
}

.product-detail-section {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
}

.product-detail-section h3 {
  margin: 0 0 6px;
  font-size: 13px;
  letter-spacing: -.015em;
}

.product-detail-activity {
  grid-column: 1 / -1;
}

.product-detail-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  margin-top: 2px;
}

.product-detail > .product-detail-header-actions {
  width: 100%;
}

.product-detail-header-actions.product-detail-header-actions--chips {
  justify-content: flex-start;
  margin-top: 0;
}

.product-detail-identity .product-detail-meta {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.product-activity-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 4px;
}

.product-activity-count {
  color: var(--muted);
  font-size: 10px;
}

.product-activity-scroll {
  max-height: none;
  overflow: visible;
  border-radius: 8px;
}

.product-detail .table-wrap .data-table {
  width: 100%;
}

.product-detail-header {
  display: grid;
  gap: 4px;
  margin-bottom: 4px;
}

.product-detail-title strong {
  display: block;
  font-size: 16px;
  line-height: 1.2;
}

.product-detail-title span {
  display: block;
  color: var(--muted);
  margin-top: 0;
  font-size: 12px;
}

.product-detail-title-placeholder {
  min-height: 0;
}

.product-detail-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
}

.product-detail-meta span {
  display: grid;
  gap: 2px;
  padding: 5px 6px;
  border-radius: 9px;
  background: #fcfbf8;
  color: var(--ink);
}

.product-detail-meta span strong {
  display: block;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .05em;
  color: var(--muted);
  text-transform: uppercase;
}

.product-stock-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.product-stock-grid article {
  display: grid;
  gap: 2px;
  padding: 6px;
  border-radius: 10px;
  background: #fff;
}

.product-stock-grid span {
  color: var(--muted);
  font-size: 9px;
}

.product-stock-grid strong {
  font-size: 16px;
}

.product-location-table-wrap {
  overflow: auto;
}

.product-location-table-wrap .data-table {
  min-width: 0;
  width: 100%;
  table-layout: fixed;
}

.product-location-table-wrap .data-table th,
.product-location-table-wrap .data-table td {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.product-location-table-wrap .data-table th:last-child,
.product-location-table-wrap .data-table td:last-child {
  text-align: right;
  white-space: nowrap;
}

.product-id-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.product-id-grid--compact {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, 1.1fr) auto;
  gap: 6px;
}

.product-id-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.product-id-grid > div > strong {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}

.product-id-grid .code-stack .code-row {
  margin-bottom: 4px;
}

.product-id-value {
  width: fit-content;
  max-width: 100%;
  padding: 6px 8px;
  border-radius: 9px;
  background: #fcfbf8;
  font-size: 12px;
  display: inline-flex;
}

.product-activity-list {
  list-style: none;
  margin: 0;
  padding: 1px 0;
  display: grid;
  gap: 3px;
}

.product-activity-item {
  display: grid;
  grid-template-columns: 62px 80px 1fr;
  gap: 3px 4px;
  align-items: baseline;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: 2px 4px;
  background: #fff;
  line-height: 1.06;
}

.product-activity-time {
  font-size: 8px;
  color: var(--muted);
  white-space: nowrap;
}

.product-activity-actor {
  font-size: 8px;
  color: var(--ink);
  font-weight: 800;
  white-space: nowrap;
}

.product-activity-description {
  font-size: 9px;
  color: var(--ink);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-activity-footer {
  margin-top: 4px;
  display: flex;
  justify-content: flex-end;
}

.secondary-button.compact,
.primary-button.compact {
  padding: 6px 9px;
  min-height: auto;
  font-size: 11px;
}

.architecture-note p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 12px;
}

/* Cloud authentication */
.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: none;
  place-items: center;
  padding: 24px;
  overflow-y: auto;
  background:
    radial-gradient(circle at 16% 15%, rgba(111, 91, 211, .26), transparent 28%),
    radial-gradient(circle at 88% 86%, rgba(36, 138, 99, .15), transparent 24%),
    rgba(239, 235, 225, .94);
  backdrop-filter: blur(18px);
}

.auth-gate.open {
  display: grid;
}

body.auth-required {
  overflow: hidden;
}

.auth-card {
  width: min(470px, 100%);
  padding: 30px;
  border: 1px solid rgba(111, 91, 211, .17);
  border-radius: 24px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 30px 90px rgba(43, 38, 61, .18);
}

.auth-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 28px;
}

.auth-brand .brand-mark {
  width: 38px;
  height: 38px;
}

.auth-brand strong,
.auth-brand span {
  display: block;
}

.auth-brand strong {
  font-size: 17px;
}

.auth-brand span {
  color: var(--muted);
  font-size: 11px;
}

.auth-card h1 {
  margin: 8px 0 10px;
  font-size: clamp(28px, 7vw, 39px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.auth-card > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.google-auth-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  min-height: 50px;
  width: 100%;
  margin-top: 24px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-weight: 850;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(43, 38, 61, .07);
}

.google-auth-button:hover { border-color: var(--primary); }
.google-auth-button:disabled { cursor: wait; opacity: .65; }
.google-auth-button svg { width: 20px; height: 20px; flex: 0 0 auto; }
.google-auth-button[hidden],
.auth-divider[hidden],
.auth-form[hidden] { display: none; }

.auth-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 -5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.auth-divider::before,
.auth-divider::after {
  content: "";
  height: 1px;
  flex: 1;
  background: var(--line);
}

.auth-form {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.auth-form label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
}

.auth-form input {
  min-height: 47px;
  width: 100%;
  padding: 0 13px;
  border: 1px solid var(--line-strong);
  border-radius: 11px;
  background: #fff;
  color: var(--ink);
}

.auth-form input:focus {
  border-color: var(--primary);
}

.auth-form button {
  width: 100%;
}

.auth-message {
  min-height: 20px;
  margin-top: 13px !important;
  color: var(--success) !important;
  text-align: center;
}

.auth-message.error {
  color: var(--danger) !important;
}

.auth-logout {
  width: 100%;
  margin-top: 3px;
}

.auth-safety {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 9px;
  margin-top: 18px;
  padding: 12px;
  border-radius: 12px;
  background: var(--success-soft);
  color: var(--success);
}

.auth-safety > span {
  font-weight: 900;
}

.auth-safety p {
  margin: 0;
  color: #397760;
  font-size: 10px;
  line-height: 1.45;
}

/* Modal */
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(30, 27, 40, .5);
  backdrop-filter: blur(6px);
}

.modal-backdrop.open {
  display: flex;
}

.modal {
  width: min(680px, 100%);
  max-height: min(88vh, 820px);
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 20px;
  background: var(--surface-solid);
  box-shadow: 0 28px 85px rgba(24,21,33,.26);
  animation: modalIn .2s ease;
}

.own-price-modal {
  width: min(760px, 100%);
  max-width: 100%;
}

.own-price-modal .modal-header,
.own-price-modal .modal-body,
.own-price-modal .modal-footer,
.own-price-editor,
.own-price-form-grid,
.own-price-form-grid > *,
.own-price-risk-panel,
.own-price-risk-ack {
  min-width: 0;
}

.own-price-modal .modal-body {
  overflow-x: hidden;
}

.own-price-editor {
  display: grid;
  gap: 12px;
}

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

.own-price-form-grid .form-field {
  min-width: 0;
}

.own-price-tier-editor {
  grid-column: 1 / -1;
  min-width: 0;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) minmax(0, 1fr);
  align-items: end;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
}

.own-price-tier-editor > strong {
  align-self: center;
  color: var(--ink);
  font-size: 12px;
}

.tier-margin-detail {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
}

.own-price-override-field {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, .55fr);
  align-items: end;
  gap: 10px;
}

.own-price-modal input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
  flex: 0 0 18px;
}

.own-price-modal .inline-toggle {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  line-height: 1.35;
  white-space: normal;
}

.own-price-modal .inline-toggle span,
.own-price-risk-ack span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.own-price-cost-note {
  margin: 0;
}

@keyframes modalIn {
  from { opacity: 0; transform: translateY(9px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.modal-header,
.modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 18px 20px;
}

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

.modal-header h2 {
  margin: 3px 0 0;
  font-size: 21px;
  letter-spacing: -.03em;
}

.modal-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 20px;
}

.product-detail-modal {
  width: min(1150px, 94vw);
  max-height: 90vh;
}

.modal-breadcrumb-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
  margin-bottom: 12px;
  padding: 8px 12px;
  background: var(--surface-soft, rgba(0,0,0,0.02));
  border: 1px solid var(--line);
  border-radius: 8px;
  flex-wrap: wrap;
}

.modal-breadcrumb-nav a {
  color: var(--primary, #3b82f6);
  text-decoration: none;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s;
}

.modal-breadcrumb-nav a:hover {
  text-decoration: underline;
  opacity: 0.85;
}

.modal-breadcrumb-nav .sep {
  color: var(--muted);
  font-size: 11px;
  opacity: 0.6;
}

.modal-breadcrumb-nav .active {
  color: var(--text);
  font-weight: 700;
}

.product-detail-modal .modal-body {
  overflow-y: auto;
  max-height: calc(90vh - 84px);
  padding: 12px;
}

.product-detail-modal .modal-footer {
  padding: 14px 18px;
}

.product-detail-modal .modal-footer:empty {
  display: none;
}

.product-detail-modal .modal-header {
  padding: 10px 14px;
}

.modal-footer {
  justify-content: flex-end;
  border-top: 1px solid var(--line);
  background: var(--surface-soft);
  border-radius: 0 0 20px 20px;
}

.product-edit-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.product-edit-column {
  min-width: 0;
  display: grid;
}

.product-edit-section {
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
  display: grid;
  gap: 5px;
}

.product-edit-section h3 {
  margin: 0;
  font-size: 12px;
  letter-spacing: -.015em;
}

.product-edit-section .form-grid {
  margin: 0;
}

.auto-grow-textarea {
  resize: none;
  min-height: 44px;
  overflow: hidden;
}

.product-id-grid__actions {
  justify-self: end;
  margin-top: auto;
  min-height: 30px;
  display: flex;
  justify-content: flex-end;
}

.product-location-actions {
  margin-top: 6px;
  display: flex;
  justify-content: flex-end;
}

.product-location-actions .text-button {
  padding: 0;
  min-height: auto;
}

.product-detail > .product-detail-header-actions {
  display: flex;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.modal-note {
  margin-bottom: 14px;
  padding: 12px 13px;
  border-radius: 11px;
  background: var(--info-soft);
  color: var(--info);
  font-size: 11px;
}

.own-price-risk-panel {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 12px 13px;
  border: 1px solid #f1b9b0;
  border-radius: 11px;
  background: #fff3f0;
  color: #9f2f22;
  font-size: 11px;
}

.own-price-risk-panel[hidden],
.own-price-risk-ack[hidden] {
  display: none;
}

.own-price-risk-panel > div {
  display: grid;
  gap: 2px;
  padding-top: 7px;
  border-top: 1px solid rgba(159, 47, 34, .15);
}

.own-price-risk-panel b {
  font-weight: 750;
}

.own-price-risk-ack {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 10px;
  padding: 11px 12px;
  border: 1px solid #e8c36f;
  border-radius: 11px;
  background: #fff9e9;
  color: #7b5412;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}

.own-price-risk-ack input {
  margin-top: 2px;
  flex: 0 0 auto;
}

.own-price-copy-button {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  padding: 5px 7px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: copy;
}

.own-price-copy-button:not(:disabled):hover,
.own-price-copy-button:not(:disabled):focus-visible {
  border-color: rgba(111, 91, 211, .25);
  background: rgba(111, 91, 211, .07);
  outline: none;
}

.own-price-copy-button:disabled {
  cursor: default;
  opacity: .72;
}

.own-price-copy-value {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.own-price-copy-value > * {
  min-width: 0;
  overflow-wrap: anywhere;
}

.own-price-copy-icon {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 15px;
  font-weight: 900;
}

.own-price-copy-button:disabled .own-price-copy-icon {
  display: none;
}

.price-sync-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 12px 0;
}

.price-sync-summary > div {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-soft);
}

.price-sync-summary span, .price-sync-diff-row span { color: var(--muted); font-size: 10px; }
.price-sync-summary strong { font-size: 17px; }
.price-sync-ok { padding: 11px 12px; border-radius: 10px; background: #eefbf3; color: #18794e; font-size: 11px; font-weight: 700; }
.price-sync-diffs { display: grid; margin-top: 12px; border-top: 1px solid var(--line); }
.price-sync-diffs > small { padding-top: 9px; color: var(--muted); }
.price-sync-diff-row { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.price-sync-diff-row > div { display: grid; gap: 2px; min-width: 0; }
.price-sync-diff-row > div strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.price-sync-diff-row > span { flex: 0 0 auto; }

.external-lookup {
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}

.external-lookup-status,
.external-lookup-heading,
.external-suggestion {
  display: flex;
  align-items: center;
  gap: 10px;
}

.external-lookup-status > span:first-child {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--primary-soft);
  color: var(--primary);
}

.external-lookup-status strong,
.external-lookup-status span,
.external-lookup-heading strong,
.external-lookup-heading span,
.external-suggestion strong,
.external-suggestion span {
  display: block;
}

.external-lookup-status span,
.external-lookup-heading span,
.external-suggestion span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.external-lookup-status.muted > span:first-child {
  background: var(--surface);
  color: var(--muted);
}

.external-lookup-status.serial-help {
  align-items: flex-start;
}

.external-lookup-status.serial-help > span:first-child {
  width: 34px;
  border-radius: 7px;
  font-size: 9px;
  font-weight: 800;
}

.external-lookup-status.serial-help button {
  margin-top: 9px;
}

.spinner-dot {
  animation: lookup-pulse 1s ease-in-out infinite alternate;
}

.external-lookup-heading {
  justify-content: space-between;
  margin-bottom: 10px;
}

.external-suggestion-list {
  display: grid;
  gap: 8px;
}

.external-suggestion {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
}

.external-suggestion img,
.suggestion-placeholder {
  width: 42px;
  height: 42px;
  border-radius: 7px;
  object-fit: contain;
  background: var(--surface-soft);
}

.external-suggestion-copy p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.external-suggestion-copy p b {
  color: var(--ink);
}

.external-suggestion-copy .suggestion-clarifier {
  padding: 7px 8px;
  border-radius: 7px;
  background: var(--warning-soft);
  color: var(--warning);
}

.product-plain-language {
  display: grid;
  gap: 5px;
  padding: 13px 14px;
  border-top: 1px solid var(--line);
  background: var(--surface-soft);
}

.product-plain-language strong,
.product-plain-language span,
.product-plain-language small {
  display: block;
}

.product-plain-language span,
.product-plain-language small {
  color: var(--muted);
  line-height: 1.45;
}

.product-plain-language .clarifier {
  color: var(--warning);
}

.suggestion-placeholder {
  display: grid;
  place-items: center;
  color: var(--muted);
}

@keyframes lookup-pulse {
  from { opacity: .4; transform: scale(.8); }
  to { opacity: 1; transform: scale(1); }
}

@media (max-width: 620px) {
  .external-suggestion {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .external-suggestion > button {
    grid-column: 1 / -1;
    width: 100%;
  }
}

.choice-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 16px;
}

.choice-tab {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
  color: var(--ink);
  text-align: left;
}

.choice-tab strong,
.choice-tab span {
  display: block;
}

.choice-tab span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.choice-tab.active {
  border-color: rgba(111,91,211,.4);
  background: var(--primary-soft);
}

.receive-lines {
  display: grid;
  gap: 8px;
}

.receive-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 90px;
  align-items: center;
  gap: 10px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}

.receive-line strong,
.receive-line span {
  display: block;
}

.receive-line span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

/* Camera scanner */
.camera-backdrop {
  position: fixed;
  inset: 0;
  z-index: 180;
  display: none;
  place-items: center;
  padding: max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  background: rgba(13, 12, 18, .92);
}

.camera-backdrop.open {
  display: grid;
}

.camera-dialog {
  width: min(720px, 100%);
  max-height: 100%;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 22px;
  background: #181720;
  color: #fff;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .45);
}

.camera-header,
.camera-footer {
  padding: 16px 18px;
}

.camera-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.camera-header h2 {
  margin: 3px 0 0;
  font-size: clamp(19px, 4vw, 27px);
}

.camera-icon-button {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 50%;
  background: rgba(255, 255, 255, .09);
  color: #fff;
  font-size: 25px;
}

.camera-stage {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #050507;
}

.camera-stage video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.camera-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, .22), transparent 27%, transparent 73%, rgba(0, 0, 0, .28));
  pointer-events: none;
}

.camera-frame {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(82%, 560px);
  height: 34%;
  translate: -50% -50%;
  border: 2px solid rgba(255, 255, 255, .88);
  border-radius: 17px;
  box-shadow: 0 0 0 999px rgba(0, 0, 0, .2);
  pointer-events: none;
}

.camera-frame span {
  position: absolute;
  left: 8%;
  right: 8%;
  top: 50%;
  height: 2px;
  background: #ff6e70;
  box-shadow: 0 0 12px #ff6e70;
  animation: cameraBeam 1.8s ease-in-out infinite;
}

@keyframes cameraBeam {
  0%, 100% { transform: translateY(-34px); opacity: .7; }
  50% { transform: translateY(34px); opacity: 1; }
}

.camera-status {
  position: absolute;
  left: 50%;
  bottom: 16px;
  translate: -50% 0;
  width: max-content;
  max-width: calc(100% - 28px);
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  background: rgba(12, 11, 16, .82);
  color: rgba(255, 255, 255, .88);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  backdrop-filter: blur(12px);
}

.camera-status.success { background: rgba(24, 116, 80, .92); color: #fff; }
.camera-status.error { background: rgba(151, 47, 49, .94); color: #fff; }
.camera-status.loading::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: currentColor; animation: cameraPulse 1s ease-in-out infinite; }

@keyframes cameraPulse { 50% { opacity: .32; } }

.camera-footer p {
  margin: 0 0 13px;
  color: rgba(255, 255, 255, .68);
  font-size: 12px;
}

.camera-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  flex-wrap: wrap;
}

.camera-control,
.camera-close-button {
  min-height: 43px;
  padding: 0 15px;
  border-radius: 11px;
  font-weight: 800;
}

.camera-control {
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

.camera-close-button {
  border: 0;
  background: #fff;
  color: #25222d;
}

/* Toast */
.toast-region {
  position: fixed;
  z-index: 150;
  right: 20px;
  bottom: 20px;
  display: grid;
  gap: 8px;
  pointer-events: none;
}

.toast {
  width: min(380px, calc(100vw - 40px));
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: flex-start;
  gap: 10px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(255,255,255,.97);
  box-shadow: var(--shadow);
  animation: toastIn .22s ease;
}

.toast.success { border-left: 4px solid var(--success); }
.toast.warning { border-left: 4px solid var(--warning); }
.toast.danger { border-left: 4px solid var(--danger); }
.toast.info { border-left: 4px solid var(--info); }

.toast strong,
.toast span {
  display: block;
}

.toast strong {
  font-size: 12px;
}

.toast span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

@keyframes toastIn {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: translateX(0); }
}

/* Utilities */
.muted { color: var(--muted); }
.text-right { text-align: right; }
.nowrap { white-space: nowrap; }
.hidden { display: none !important; }
.mobile-only { display: none; }
.sidebar-scrim { display: none; }

/* Mobile app navigation and universal search */
.mobile-bottom-nav { display: none; }

.global-search-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: none;
  place-items: center;
  padding: 22px;
  background: rgba(29, 26, 39, .46);
  backdrop-filter: blur(10px);
}

.global-search-backdrop.open { display: grid; }
body.global-search-open { overflow: hidden; }
body.sidebar-modal-open { overflow: hidden; }

.global-search-sheet {
  width: min(760px, 100%);
  max-height: min(780px, calc(100vh - 44px));
  display: flex;
  flex-direction: column;
  padding: 22px;
  border: 1px solid rgba(213, 206, 192, .9);
  border-radius: 24px;
  background: #fcfaf6;
  box-shadow: 0 28px 80px rgba(26, 22, 42, .26);
}

.global-search-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.global-search-header h2 {
  margin: 2px 0 0;
  font-size: 23px;
  letter-spacing: -.03em;
}

.global-search-back {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
  color: var(--ink);
  font-size: 20px;
}

.global-search-control {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 7px 8px 7px 15px;
  border: 2px solid rgba(111, 91, 211, .24);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 9px 26px rgba(75, 60, 140, .08);
}

.global-search-control:focus-within {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(111, 91, 211, .1);
}

.global-search-symbol { color: var(--primary); font-size: 22px; }
.global-search-control input {
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 16px;
}

.global-search-voice {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 13px;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 18px;
}

.global-search-voice.listening {
  background: #fee2e2;
  color: #dc2626;
  animation: globalVoicePulse 1.1s ease-in-out infinite;
}

@keyframes globalVoicePulse {
  50% { box-shadow: 0 0 0 7px rgba(220, 38, 38, .1); }
}

.global-search-help {
  margin: 10px 2px 13px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.global-search-results {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 2px 18px;
}

.global-search-section + .global-search-section { margin-top: 18px; }
.global-search-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 2px 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.global-search-result {
  width: 100%;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255, 255, 255, .9);
  color: var(--ink);
  text-align: left;
}

.global-search-result + .global-search-result { margin-top: 8px; }
.global-search-result:active { transform: scale(.992); }
.global-search-result-media {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
  color: var(--primary);
  font-weight: 850;
}
.global-search-result-media img { width: 100%; height: 100%; object-fit: contain; }
.global-search-result-copy { min-width: 0; }
.global-search-result-copy strong,
.global-search-result-copy span,
.global-search-result-copy small { display: block; min-width: 0; overflow-wrap: anywhere; }
.global-search-result-copy strong { font-size: 13px; line-height: 1.3; }
.global-search-result-copy span { margin-top: 2px; color: var(--muted); font-size: 11px; }
.global-search-result-copy small { margin-top: 5px; color: #5c5670; font-size: 10px; line-height: 1.4; }
.global-search-result-copy .global-search-supplier-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 6px;
}
.global-search-result-copy .global-search-supplier-meta > span:not(.supplier-color-badge) {
  display: inline;
  margin: 0;
  color: #5c5670;
  font-size: 10px;
}
.global-search-result-price { text-align: right; }
.global-search-result-price strong { display: block; color: var(--primary); font-size: 13px; }
.global-search-result-price span { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.global-search-empty {
  display: grid;
  place-items: center;
  gap: 6px;
  min-height: 180px;
  padding: 24px;
  border: 1px dashed var(--line-strong);
  border-radius: 17px;
  color: var(--muted);
  text-align: center;
}
.global-search-empty strong { color: var(--ink); }
.global-search-quick-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.global-search-quick-grid button {
  min-height: 64px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  font-weight: 750;
}
.global-search-quick-grid button span { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; font-weight: 600; }

@media (max-width: 1180px) {
  :root { --sidebar-width: 230px; }
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .panel-span-2 { grid-column: span 2; }
  .scan-layout { grid-template-columns: minmax(0, 1.4fr) minmax(280px, .72fr); }
  .mode-switcher { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .architecture-note { grid-template-columns: 1fr; }
}

@media (min-width: 921px) and (max-width: 1450px) {
  :root { --sidebar-width: 220px; }
  .sidebar { padding-inline: 12px; }
  .content-area { padding: 18px 20px 38px; }
  .topbar { padding-inline: 22px; }
  .panel.product-catalog-panel { padding: 14px; border-radius: 17px; }
  .product-catalog-panel.catalog-mode--compare .product-card-list {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 10px;
  }
  .catalog-facet-browser { margin-inline: 0; }
  .purchase-card__body { gap: 7px; padding: 10px; }
  .purchase-card__identity > div > strong { font-size: 12px; }
  .purchase-card__supplier { padding: 6px 7px; }
}

@media (min-width: 921px) and (max-height: 820px) {
  :root { --topbar-height: 60px; }
  .topbar-context h1 { font-size: 21px; }
  .content-area { padding-top: 14px; }
  .section-toolbar { margin-bottom: 10px; }
  .section-toolbar h2 { font-size: 24px; }
  .section-toolbar p { font-size: 11px; }
  .catalog-view-heading { margin-bottom: 8px; }
  .catalog-filter-bar { margin-bottom: 9px; }
  .catalog-result-toolbar { margin-block: 8px; }
  .purchase-card__image { height: 86px; padding: 8px 16px; }
  .purchase-card__image img { max-height: 68px; }
  .purchase-card__body { gap: 6px; padding: 9px; }
  .purchase-card__description { min-height: 47px; -webkit-line-clamp: 3; font-size: 10px; }
  .purchase-card__suppliers { gap: 4px; }
  .purchase-card__supplier { padding-block: 5px; }
  .purchase-card__footer { padding-top: 6px; }
  .purchase-card__footer .secondary-button { min-height: 30px; }
}

@media (max-width: 920px) {
  :root { --topbar-height: 72px; }
  .app-shell { display: block; }
  .sidebar {
    width: min(300px, 88vw);
    transform: translateX(-105%);
    transition: transform .22s ease;
    box-shadow: 20px 0 60px rgba(30,27,40,.16);
  }
  .app-shell.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-scrim {
    position: fixed;
    inset: 0;
    z-index: 35;
    display: block;
    visibility: hidden;
    background: rgba(29,26,39,.38);
    opacity: 0;
    transition: opacity .22s ease, visibility .22s ease;
  }
  .app-shell.sidebar-open .sidebar-scrim { visibility: visible; opacity: 1; }
  .main-column { min-width: 0; }
  .mobile-only { display: inline-grid; }
  .sidebar-close { margin-left: auto; }
  .topbar { padding: 0 20px; }
  .content-area { padding: 22px 20px calc(112px + env(safe-area-inset-bottom)); }
  .cloud-chip { display: none; }
  .scan-layout { grid-template-columns: 1fr; }
  .sticky-panel { position: static; }
  .scan-side { grid-template-columns: 1fr 1fr; }
  .architecture-diagram { overflow-x: auto; justify-content: flex-start; }
  .mobile-bottom-nav {
    position: fixed;
    inset: auto 0 0;
    z-index: 70;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: end;
    min-height: calc(67px + env(safe-area-inset-bottom));
    padding: 7px 6px max(7px, env(safe-area-inset-bottom));
    border-top: 1px solid rgba(213, 206, 192, .88);
    background: rgba(252, 250, 246, .96);
    box-shadow: 0 -12px 34px rgba(31, 27, 48, .1);
    backdrop-filter: blur(18px);
  }
  .mobile-nav-item {
    position: relative;
    min-width: 0;
    min-height: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 4px 2px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #777085;
    font-size: 10px;
    font-weight: 750;
  }
  .mobile-nav-icon { font-size: 21px; line-height: 1; }
  .mobile-nav-dots { font-size: 15px; letter-spacing: 1px; }
  .mobile-nav-item.active { color: var(--primary); background: rgba(111, 91, 211, .08); }
  .mobile-nav-item[data-open-mobile-menu][aria-expanded="true"] { color: var(--primary); background: rgba(111, 91, 211, .08); }
  .mobile-nav-search { overflow: visible; color: var(--primary); }
  .mobile-nav-search-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    margin-top: -25px;
    border: 5px solid #fcfaf6;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--primary), #8c79e3);
    color: #fff;
    font-size: 25px;
    box-shadow: 0 10px 25px rgba(111, 91, 211, .32);
  }
  body.global-search-open .mobile-bottom-nav { display: none; }
}

@media (max-width: 700px) {
  .global-search-backdrop { padding: 0; place-items: stretch; }
  .global-search-sheet {
    width: 100%;
    max-height: none;
    min-height: 100%;
    padding: max(15px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom));
    border: 0;
    border-radius: 0;
  }
  .global-search-header { margin-bottom: 12px; }
  .global-search-header h2 { font-size: 21px; }
  .global-search-help { margin-bottom: 10px; }
  .global-search-results { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
  .global-search-result { grid-template-columns: 48px minmax(0, 1fr); }
  .global-search-result-media { width: 48px; height: 48px; }
  .global-search-result-price { grid-column: 2; display: flex; align-items: center; justify-content: space-between; text-align: left; }
  .global-search-result-price span { margin: 0 0 0 8px; text-align: right; }
  .finance-grid { grid-template-columns: 1fr; }
  .finance-toolbar .primary-button { width: 100%; }
  .internal-price-list-card { align-items: stretch; flex-direction: column; }
  .internal-price-list-actions { align-items: stretch; flex-direction: column; }
  .internal-price-list-actions .primary-button { width: 100%; }
  .price-sync-review-list > button { align-items: flex-start; flex-direction: column; }
  .price-sync-review-list > button span { width: 100%; }
  .price-sync-review-list strong { line-height: 1.35; overflow-wrap: anywhere; }
  .price-sync-review-list small { display: block; margin-top: 4px; line-height: 1.4; }
  .price-sync-review-list b { align-self: flex-start; }
  .price-intelligence-heading { align-items: stretch; flex-direction: column; }
  .price-intelligence-controls { flex-direction: column; }
  .price-intelligence-controls select { width: 100%; }
  .price-intelligence-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .price-intelligence-result-meta { align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; }
  .product-price-intelligence__head { flex-direction: column; }
  .product-price-intelligence__suppliers { grid-template-columns: 1fr; }
  .price-sync-summary { grid-template-columns: 1fr 1fr; }
  .price-sync-diff-row { align-items: flex-start; flex-direction: column; gap: 4px; }
  .simple-history-list > div { grid-template-columns: 1fr; gap: 3px; }
  .catalog-columns { width: 100%; }
  .catalog-columns > summary { justify-content: center; }
  .catalog-columns-menu { position: static; width: 100%; margin-top: 6px; box-shadow: none; }
  .topbar-context h1 { font-size: 20px; }
  .topbar-actions .primary-button { display: none; }
  .hero-panel { align-items: flex-start; flex-direction: column; padding: 23px; }
  .hero-panel h2 { font-size: 30px; }
  .kpi-grid,
  .dashboard-grid,
  .backup-grid,
  .location-grid,
  .movement-summary { grid-template-columns: 1fr; }
  .panel-span-2 { grid-column: auto; }
  .section-toolbar { align-items: flex-start; flex-direction: column; }
  .section-toolbar > button { width: 100%; }
  .scanner-heading { flex-direction: column; }
  .mode-switcher { grid-template-columns: 1fr 1fr; }
  .scan-settings { grid-template-columns: 1fr; }
  .scan-input-shell { grid-template-columns: 1fr; }
  .scan-input-shell .primary-button { width: 100%; }
  .camera-entry { align-items: stretch; flex-direction: column; }
  .camera-open-button { width: 100%; }
  .scan-side { grid-template-columns: 1fr; }
  .stock-breakdown { grid-template-columns: 1fr 1fr; }
  .stock-cell { border-bottom: 1px solid var(--line); }
  .stock-cell:nth-child(2) { border-right: 0; }
  .stock-cell:nth-child(3), .stock-cell:nth-child(4) { border-bottom: 0; }
  .filter-row { flex-direction: column; }
  .filter-row > select { width: 100%; }
  .catalog-filter-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 9px;
    margin-bottom: 12px;
  }
  .catalog-filter-bar .search-box { grid-column: 1 / -1; min-width: 0; }
  .catalog-filter-bar .search-box input { min-height: 48px; }
  .catalog-columns { display: none; }
  .catalog-filter-details {
    display: block;
    min-width: 0;
  }
  .catalog-filter-details:not([open]) > .catalog-filter-options { display: none !important; }
  .catalog-filter-details summary {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid var(--line-strong);
    border-radius: 14px;
    background: #fff;
    color: var(--ink);
    font-weight: 750;
    cursor: pointer;
    list-style: none;
  }
  .catalog-filter-details summary::-webkit-details-marker { display: none; }
  .catalog-filter-details summary::after { content: "⌄"; margin-left: auto; color: var(--muted); transition: transform .18s ease; }
  .catalog-filter-details[open] summary::after { transform: rotate(180deg); }
  .catalog-filter-details[open] summary { margin-bottom: 9px; }
  .catalog-filter-details.has-active-filters summary {
    border-color: #cfc2ff;
    background: linear-gradient(135deg, #fbf9ff, #f3efff);
    color: var(--primary-deep);
  }
  .catalog-filter-count {
    display: inline-grid;
    place-items: center;
    min-width: 23px;
    height: 23px;
    margin-left: auto;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--primary);
    color: #fff;
    font-size: 11px;
    font-weight: 850;
  }
  .catalog-filter-count[hidden] { display: none; }
  .catalog-filter-details summary:has(.catalog-filter-count:not([hidden]))::after { margin-left: 0; }
  .catalog-filter-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
    border: 1px solid #e2dceb;
    border-radius: 16px;
    background: #f8f6fb;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
  }
  .catalog-filter-field {
    display: grid;
    gap: 5px;
    min-width: 0;
  }
  .catalog-filter-field--wide { grid-column: 1 / -1; }
  .catalog-filter-field > span {
    display: block;
    padding-left: 2px;
    color: #736b82;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  .catalog-filter-options select {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 0 10px;
    border-radius: 12px;
    background: #fff;
    font-size: 13px;
  }
  .catalog-clear-button { width: 100%; min-height: 46px; }
  .catalog-facet-browser { margin-top: 0; padding: 11px 0 11px 11px; overflow: hidden; }
  .catalog-facet-row { grid-template-columns: 1fr; gap: 6px; }
  .catalog-facet-label { padding-left: 2px; }
  .catalog-facet-track { padding-right: 11px; scroll-snap-type: x proximity; }
  .catalog-facet-chip { min-height: 40px; scroll-snap-align: start; }
  .catalog-result-toolbar { align-items: stretch; flex-direction: column; gap: 7px; }
  .catalog-result-toolbar .catalog-list-summary { padding-top: 0; }
  .catalog-comparison-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .catalog-copy-comparison, .catalog-share-comparison { width: 100%; min-height: 44px; padding-inline: 8px; }
  .product-table { display: none; }
  .product-card-list { display: grid; gap: 10px; }
  .product-catalog-card {
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255,255,255,.86);
  }
  .product-catalog-card__identity { display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 10px; align-items: center; }
  .product-catalog-card__identity-copy { min-width: 0; }
  .product-catalog-card__identity .product-thumb-shell { width: 60px; height: 60px; }
  .product-catalog-card__identity strong,
  .product-catalog-card__identity span,
  .product-catalog-card__facts span,
  .product-catalog-card__facts strong,
  .product-catalog-card__facts small { display: block; min-width: 0; overflow-wrap: anywhere; }
  .product-catalog-card__identity strong { font-size: 14px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .product-catalog-card__identity span { margin-top: 3px; color: var(--muted); font-size: 11px; }
  .product-catalog-card__facts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .product-catalog-card__facts > div { min-width: 0; padding: 9px; border-radius: 10px; background: var(--surface-soft); }
  .product-catalog-card__facts span { margin-bottom: 3px; color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
  .product-catalog-card__facts strong { font-size: 12px; line-height: 1.3; }
  .product-catalog-card__facts small { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.35; }
  .product-catalog-card__actions { display: flex; gap: 8px; }
  .product-catalog-card__actions .secondary-button { min-height: 44px; flex: 1; }
  .product-catalog-card__actions .text-button { min-height: 44px; padding-inline: 12px; }
  .form-grid { grid-template-columns: 1fr; }
  .pending-transfer-card { grid-template-columns: auto minmax(0, 1fr); }
  .pending-transfer-card > button { grid-column: 1 / -1; width: 100%; }
  .architecture-note { padding: 16px; }
  .architecture-diagram { gap: 5px; }
  .arch-node { min-width: 95px; font-size: 11px; }
  .product-detail-meta,
  .product-stock-grid,
  .product-id-grid,
  .product-id-grid--compact { grid-template-columns: 1fr; }
  .product-detail-row-top,
  .product-detail-row-bottom,
  .product-edit-layout { grid-template-columns: 1fr; }
  .location-detail-tab-controls,
  .summary-card-grid,
  .location-metric-grid {
    display: grid;
    grid-template-columns: 1fr;
  }
  .product-detail > .product-detail-header-actions {
    display: grid !important;
    width: 100% !important;
    max-width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
  }

  .product-detail > .product-detail-header-actions button {
    width: 100%;
    justify-content: center;
  }
  .product-detail {
    gap: 6px;
  }
  .product-detail-identity,
  .product-detail-stock,
  .product-detail-identifiers,
  .product-detail-locations {
    grid-column: 1;
  }
  .modal-backdrop { padding: 10px; align-items: flex-end; }
  .modal { max-height: 92vh; border-radius: 20px 20px 0 0; }
  .product-detail-modal {
    width: min(100%, 95vw);
    min-width: 0;
    max-height: 94vh;
  }
  .product-detail-modal .product-activity-scroll {
    max-height: 240px;
  }
  .product-activity-item {
    grid-template-columns: 80px 1fr;
    gap: 6px;
  }
  .product-activity-actor {
    white-space: normal;
  }
  .product-activity-description {
    grid-column: 1 / -1;
    white-space: normal;
  }
  .modal-footer { flex-wrap: wrap; }
  .modal-footer button { flex: 1; }
  .camera-backdrop { padding: 0; place-items: stretch; }
  .camera-dialog { width: 100%; min-height: 100%; border: 0; border-radius: 0; display: flex; flex-direction: column; }
  .camera-stage { flex: 1; min-height: 52vh; aspect-ratio: auto; }
  .camera-footer { padding-bottom: max(16px, env(safe-area-inset-bottom)); }
  .camera-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .camera-actions > :last-child { grid-column: 1 / -1; }
}

.inline-action-menu {
  position: relative;
  display: inline-block;
}

.inline-action-menu summary {
  list-style: none;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: var(--surface);
  font-weight: 700;
  font-size: 14px;
  color: var(--muted);
}

.inline-action-menu summary::-webkit-details-marker {
  display: none;
}

.inline-action-menu summary:hover {
  background: var(--surface-soft);
  color: var(--text);
}

.inline-action-menu__panel {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 100;
  min-width: 140px;
  margin-top: 4px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-medium);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.inline-action-menu__panel .text-button {
  text-align: left;
  width: 100%;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 12px;
}

.inline-action-menu__panel .text-button:hover {
  background: var(--surface-soft);
}

.blocked-notice {
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
  align-items: center;
  gap: 8px;
}

.blocked-notice.warning {
  background: rgba(234, 179, 8, 0.12);
  border: 1px solid rgba(234, 179, 8, 0.3);
  color: #854d0e;
}

.readonly-preview {
  background-color: var(--surface-soft) !important;
  color: var(--muted) !important;
  cursor: not-allowed;
  font-weight: 500;
}

.location-breadcrumb-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 12px;
  margin-bottom: 10px;
  color: var(--muted);
}

.location-breadcrumb-bar .breadcrumb-item {
  color: var(--primary-deep);
  text-decoration: none;
  font-weight: 500;
}

.location-breadcrumb-bar .breadcrumb-item:hover {
  text-decoration: underline;
}

.location-breadcrumb-bar .breadcrumb-item.active {
  color: var(--text);
  font-weight: 700;
  cursor: default;
}

.breadcrumb-separator {
  color: var(--muted);
  font-size: 11px;
}

.inventory-loading-state,
.inventory-error-state {
  padding: 36px 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.inventory-loading-state .spinner {
  width: 28px;
  height: 28px;
  border: 3px solid var(--line);
  border-top-color: var(--primary-deep);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

.inline-action-menu.drop-up .inline-action-menu__panel {
  top: auto;
  bottom: 100%;
  margin-bottom: 4px;
  margin-top: 0;
}

.table-scroll,
.table-wrapper,
.table-container {
  overflow-x: auto;
  overflow-y: visible;
}

.entry-method-switcher {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  padding: 4px;
  background: var(--surface-soft);
  border-radius: 10px;
}

.entry-method-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
}

.entry-method-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.05);
}

.entry-method-btn.active {
  background: var(--surface);
  color: var(--primary-deep);
  box-shadow: var(--shadow-small);
}

.manual-entry-panel {
  background: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px;
  margin-bottom: 16px;
}

.manual-form-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.manual-search-shell {
  position: relative;
}

.manual-product-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 200;
  max-height: 220px;
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-medium);
  margin-top: 4px;
}

.manual-product-item {
  padding: 10px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.manual-product-item:last-child {
  border-bottom: 0;
}

.manual-product-item:hover,
.manual-product-item.selected {
  background: var(--surface-soft);
  color: var(--primary-deep);
}

.manual-product-item strong {
  display: block;
  color: var(--text);
}

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

.global-breadcrumb-bar {
  padding: 8px 24px;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
}

.global-breadcrumb-bar .breadcrumb-link {
  color: var(--primary-deep);
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
}

.global-breadcrumb-bar .breadcrumb-link:hover {
  text-decoration: underline;
}

.global-breadcrumb-bar .breadcrumb-active {
  color: var(--text);
  font-weight: 700;
}

.cloud-chip[data-status="syncing"] {
  background: rgba(56, 189, 248, 0.15);
  border-color: #38bdf8;
  color: #38bdf8;
}

.cloud-chip[data-status="offline"],
.cloud-chip[data-status="local_backup"] {
  background: rgba(251, 191, 36, 0.15);
  border-color: #fbbf24;
  color: #fbbf24;
}

.cloud-chip[data-status="read_error"],
.cloud-chip[data-status="write_error"] {
  background: rgba(248, 113, 113, 0.15);
  border-color: #f87171;
  color: #f87171;
}

@media (max-width: 470px) {
  .content-area { padding: 18px 13px 32px; }
  .topbar { padding: 0 13px; }
  .hero-panel { border-radius: 17px; }
  .panel, .scanner-console { padding: 16px; border-radius: 17px; }
  .mode-switcher { grid-template-columns: 1fr; }
  .mode-button { min-height: 70px; }
  .stock-breakdown { grid-template-columns: 1fr; }
  .stock-cell { border-right: 0; border-bottom: 1px solid var(--line) !important; }
  .stock-cell:last-child { border-bottom: 0 !important; }
  .product-result-head { grid-template-columns: 48px minmax(0, 1fr); }
  .product-symbol { width: 48px; height: 48px; }
  .product-result-stock { grid-column: 1 / -1; text-align: left; }
  .attention-item { grid-template-columns: auto minmax(0, 1fr); }
  .attention-item .status-chip { grid-column: 1 / -1; justify-self: start; }
  .choice-tabs { grid-template-columns: 1fr; }
  .auth-gate { padding: 0; place-items: stretch; }
  .auth-card { min-height: 100vh; width: 100%; padding: max(28px, env(safe-area-inset-top)) 22px max(28px, env(safe-area-inset-bottom)); border: 0; border-radius: 0; }
}

@media print {
  .sidebar, .topbar, .hero-actions, button { display: none !important; }
  .main-column { grid-column: 1; }
  .content-area { padding: 0; }
  .panel, .hero-panel { box-shadow: none; break-inside: avoid; }
}

/* Environment Mode Chip & Banner Styles */
.env-mode-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  border: 1px solid var(--line);
}

.env-mode-chip.demo {
  background: rgba(234, 179, 8, 0.15);
  color: #b45309;
  border-color: rgba(234, 179, 8, 0.4);
}

.env-mode-chip.production {
  background: rgba(34, 197, 94, 0.15);
  color: #15803d;
  border-color: rgba(34, 197, 94, 0.4);
}

.environment-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 5px 16px;
  margin: 6px 34px 0;
  border-radius: 8px;
  font-size: 12px;
  border: 1px solid var(--line);
}

.environment-banner.demo {
  background: linear-gradient(135deg, rgba(254, 243, 199, 0.95), rgba(253, 230, 138, 0.7));
  color: #78350f;
  border-color: rgba(245, 158, 11, 0.4);
}

.environment-banner.production {
  background: linear-gradient(135deg, rgba(220, 252, 231, 0.95), rgba(187, 247, 208, 0.7));
  color: #14532d;
  border-color: rgba(34, 197, 94, 0.4);
}

.environment-banner .banner-text strong {
  font-weight: 800;
}

.environment-banner .banner-action-btn {
  padding: 3px 10px;
  border-radius: 6px;
  border: none;
  background: #78350f;
  color: #fff;
  font-weight: 700;
  font-size: 11px;
  cursor: pointer;
  white-space: nowrap;
}

.environment-banner.production .banner-action-btn {
  background: #14532d;
}

.environment-banner[hidden] { display: none; }

.banner-dismiss-btn {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: currentColor;
  font-size: 18px;
  cursor: pointer;
}

.preproduction-stat-card {
  background: var(--surface-soft);
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--line);
  text-align: center;
}

.preproduction-stat-card strong {
  display: block;
  font-size: 18px;
  font-weight: 850;
  color: var(--primary);
}

.preproduction-stat-card span {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

/* ==========================================================================
   OPSOS PRODUCT DETAIL FULL PAGE LAYOUT (SHADCN CLEAN OPERATIONAL LAYOUT)
   ========================================================================== */

.product-page-wrapper {
  padding: 4px 4px 16px 4px;
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-family: inherit;
  color: #0f172a;
}

.product-page-breadcrumbs {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.breadcrumb-trail {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
}

.breadcrumb-link {
  color: #475569;
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
  transition: color 0.15s ease;
  display: inline-flex;
  align-items: center;
}

.breadcrumb-link:hover {
  color: #4f46e5;
}

.breadcrumb-category {
  color: #475569;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: color 0.15s ease;
}

.breadcrumb-category:hover {
  color: #4f46e5;
}

.breadcrumb-current {
  color: #0f172a;
  font-weight: 700;
}

.product-page-top-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.notification-bell {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.location-select-pill {
  border: 1px solid #cbd5e1;
  border-radius: 9999px;
  padding: 4px 12px;
  font-size: 12px;
  font-weight: 600;
  color: #1e293b;
  background: #ffffff;
  cursor: pointer;
}

/* Hero Header Card */
.product-hero-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 12px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.product-hero-left {
  display: flex;
  align-items: center;
  gap: 16px;
}

.product-image-container {
  width: 68px;
  height: 68px;
  border-radius: 8px;
  border: 1px solid #f1f5f9;
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.product-hero-image {
  max-width: 92%;
  max-height: 92%;
  object-fit: contain;
}

.product-hero-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.product-hero-title {
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.product-hero-subtitle {
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
  margin: 0;
}

.product-hero-ids {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #64748b;
  margin-top: 2px;
}

.id-sep {
  color: #cbd5e1;
}

.product-hero-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

.active-pill {
  background: #dcfce7;
  color: #166534;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 9999px;
  border: 1px solid #bbf7d0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.compact-pill {
  border-radius: 6px;
  font-weight: 600;
  padding: 5px 12px;
  font-size: 12px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: all 0.15s;
}

.compact-pill:hover {
  background: #f8fafc;
  border-color: #94a3b8;
  color: #0f172a;
}

.options-dots-btn {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  font-size: 16px;
  font-weight: 700;
  color: #475569;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Tabs Bar */
.product-tabs-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid #e2e8f0;
  margin-top: 2px;
  margin-bottom: 6px;
}

.product-tab-btn {
  background: none;
  border: none;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: all 0.15s;
  display: flex;
  align-items: center;
  gap: 5px;
}

.product-tab-btn:hover {
  color: #0f172a;
}

.product-tab-btn.active {
  color: #4f46e5;
  border-bottom-color: #4f46e5;
  font-weight: 700;
}

/* Summary Grid: 4 Blocks in 1 Row on Desktop */
.product-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.supplier-cards-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.supplier-rules-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.supplier-source-card .card-header {
  flex-wrap: wrap;
  gap: 8px;
}

.supplier-source-card .status-chip {
  max-width: 100%;
  white-space: normal;
}

/* Supplier operations centre. It intentionally reuses the product-detail shell. */
.supplier-workspace,
.supplier-profile {
  min-width: 0;
}

.supplier-workspace .summary-card-panel,
.supplier-profile .summary-card-panel {
  gap: 10px;
}

.supplier-hub-icon {
  color: #5b4dd8;
  background: linear-gradient(145deg, #f3efff, #ffffff);
  border-color: #ddd6fe;
  font-size: 30px;
  font-weight: 750;
}

.supplier-directory-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.supplier-directory-card {
  min-width: 0;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.supplier-directory-card:hover,
.supplier-directory-card:focus-visible {
  border-color: #b9afff;
  box-shadow: 0 10px 24px rgba(79, 70, 229, .08);
  transform: translateY(-1px);
  outline: none;
}

.supplier-directory-card__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.supplier-directory-card__head h2 {
  margin: 1px 0 2px;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.2;
}

.supplier-directory-card__head p {
  margin: 0;
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}

.module-kicker {
  display: block;
  color: #6d5ce8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
}

.supplier-avatar {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8d1ff;
  border-radius: 12px;
  background: linear-gradient(145deg, #ede9fe, #fafafa);
  color: #5747d8;
  font-size: 19px;
  font-weight: 850;
  overflow: hidden;
}

.supplier-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.supplier-avatar--getterson,
.supplier-avatar--ocrl {
  padding: 8px;
  background: #fff;
}

.supplier-avatar--ocrl {
  border-color: #bae6fd;
  background: linear-gradient(145deg, #e0f2fe, #ffffff);
  color: #0369a1;
}

.supplier-avatar--hero {
  width: 68px;
  height: 68px;
  flex-basis: 68px;
  border-radius: 13px;
  font-size: 27px;
}

.supplier-avatar--hero.supplier-avatar--getterson,
.supplier-avatar--hero.supplier-avatar--ocrl {
  padding: 12px;
}

.supplier-directory-card__metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid #edf0f5;
  border-radius: 10px;
  background: #edf0f5;
}

.supplier-directory-card__metrics > div {
  min-width: 0;
  padding: 10px;
  background: #fafbfc;
}

.supplier-directory-card__metrics span,
.supplier-directory-card__metrics strong {
  display: block;
  overflow-wrap: anywhere;
}

.supplier-directory-card__metrics span {
  color: #64748b;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .035em;
}

.supplier-directory-card__metrics strong {
  margin-top: 3px;
  color: #0f172a;
  font-size: 15px;
}

.supplier-directory-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 13px;
  color: #64748b;
  font-size: 10px;
}

.supplier-global-rules {
  margin-top: 14px;
}

.supplier-profile-title-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.supplier-source-strip {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(240px, .7fr);
  gap: 1px;
  overflow: hidden;
  border: 1px solid #dbeafe;
  border-radius: 11px;
  background: #dbeafe;
}

.supplier-source-strip > div {
  min-width: 0;
  padding: 10px 13px;
  background: #f5f9ff;
}

.supplier-source-strip strong,
.supplier-source-strip span {
  display: block;
  overflow-wrap: anywhere;
}

.supplier-source-strip strong {
  color: #1e3a8a;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .045em;
}

.supplier-source-strip span {
  margin-top: 2px;
  color: #475569;
  font-size: 11px;
}

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

.supplier-rule-title {
  color: #0f172a;
  font-size: 15px;
}

.supplier-summary-lower {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(260px, .75fr);
  gap: 12px;
  margin-top: 12px;
}

.supplier-highlight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.supplier-highlight-product {
  min-width: 0;
  padding: 10px;
  border: 1px solid #edf0f5;
  border-radius: 9px;
  background: #fafbfc;
}

.supplier-highlight-product > span,
.supplier-highlight-product > div {
  display: block;
  margin-top: 3px;
}

.supplier-highlight-product > span {
  overflow: hidden;
  color: #64748b;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.supplier-highlight-product > div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: #334155;
  font-size: 11px;
}

.supplier-highlight-product b {
  color: #0f172a;
}

.supplier-last-run {
  display: grid;
  gap: 8px;
  align-content: start;
}

.supplier-last-run .status-chip {
  justify-self: start;
}

.supplier-last-run > strong {
  color: #0f172a;
  font-size: 14px;
}

.supplier-last-run > span:not(.status-chip),
.supplier-last-run > small {
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}

.supplier-catalog-header {
  gap: 14px;
}

.supplier-catalog-filters {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.supplier-catalog-filters input,
.supplier-catalog-filters select {
  min-height: 38px;
  border: 1px solid #d8dee8;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  font: inherit;
  font-size: 12px;
}

.supplier-catalog-filters input {
  min-width: 250px;
  padding: 7px 10px;
}

.supplier-catalog-filters select {
  padding: 7px 30px 7px 9px;
}

.supplier-catalog-result {
  margin: -2px 0 10px;
  color: #64748b;
  font-size: 11px;
}

.supplier-operational-table {
  min-width: 820px;
}

.table-entity-link {
  display: block;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: #1e293b;
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.table-entity-link:hover,
.table-entity-link:focus-visible {
  color: #5747d8;
  text-decoration: underline;
  outline: none;
}

.supplier-offer-card-list {
  display: none;
}

.supplier-offer-card[hidden],
tr[data-supplier-catalog-item][hidden] {
  display: none !important;
}

.supplier-stock-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.supplier-stock-summary > div {
  padding: 11px;
  border: 1px solid #edf0f5;
  border-radius: 9px;
  background: #fafbfc;
}

.supplier-stock-summary span,
.supplier-stock-summary strong {
  display: block;
}

.supplier-stock-summary span {
  color: #64748b;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.supplier-stock-summary strong {
  margin-top: 3px;
  color: #0f172a;
  font-size: 16px;
}

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

.supplier-rule-list {
  display: grid;
  gap: 1px;
  overflow: hidden;
  border: 1px solid #edf0f5;
  border-radius: 9px;
  background: #edf0f5;
}

.supplier-rule-list > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  background: #fafbfc;
  font-size: 11px;
}

.supplier-rule-list span {
  color: #64748b;
}

.supplier-rule-list strong {
  color: #0f172a;
  text-align: right;
}

.supplier-cost-meaning {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.supplier-cost-meaning > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid #edf0f5;
  border-radius: 9px;
  background: #fafbfc;
}

.supplier-cost-meaning span,
.supplier-cost-meaning strong,
.supplier-cost-meaning small {
  display: block;
  overflow-wrap: anywhere;
}

.supplier-cost-meaning span {
  color: #64748b;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.supplier-cost-meaning strong {
  margin-top: 5px;
  color: #0f172a;
  font-size: 15px;
}

.supplier-cost-meaning small {
  margin-top: 4px;
  color: #64748b;
  font-size: 10px;
  line-height: 1.4;
}

@media (max-width: 1180px) {
  .supplier-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .supplier-directory-card__metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .supplier-directory-grid,
  .supplier-summary-lower,
  .supplier-prices-grid {
    grid-template-columns: 1fr;
  }

  .supplier-catalog-header {
    align-items: stretch;
    flex-direction: column;
  }

  .supplier-catalog-filters {
    width: 100%;
    margin-left: 0;
  }

  .supplier-catalog-filters input,
  .supplier-catalog-filters select {
    min-width: 0;
    flex: 1;
  }
}

@media (max-width: 700px) {
  .supplier-directory-card {
    padding: 13px;
    border-radius: 12px;
  }

  .supplier-directory-card__head {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .supplier-directory-card__head > .status-chip {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .supplier-directory-card__metrics,
  .supplier-summary-grid,
  .supplier-stock-summary,
  .supplier-cost-meaning {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .supplier-source-strip {
    grid-template-columns: 1fr;
  }

  .supplier-avatar--hero {
    width: 56px;
    height: 56px;
    flex-basis: 56px;
    font-size: 22px;
  }

  .supplier-highlight-grid {
    grid-template-columns: 1fr;
  }

  .supplier-catalog-filters {
    flex-direction: column;
  }

  .supplier-catalog-filters input,
  .supplier-catalog-filters select {
    width: 100%;
    min-height: 44px;
  }

  .supplier-offer-table-wrap {
    display: none;
  }

  .supplier-offer-card-list {
    display: grid;
    gap: 9px;
  }

  .supplier-offer-card {
    min-width: 0;
    padding: 11px;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
    background: #fafbfc;
  }

  .supplier-offer-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
  }

  .supplier-offer-card__head > div {
    min-width: 0;
  }

  .supplier-offer-card__head strong,
  .supplier-offer-card__head span:not(.status-chip) {
    display: block;
    overflow-wrap: anywhere;
  }

  .supplier-offer-card__head strong {
    color: #0f172a;
    font-size: 12px;
  }

  .supplier-offer-card__head span:not(.status-chip) {
    margin-top: 3px;
    color: #64748b;
    font-size: 10px;
  }

  .supplier-offer-card__facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin: 10px 0;
  }

  .supplier-offer-card__facts > div {
    min-width: 0;
    padding: 8px;
    border-radius: 8px;
    background: #fff;
  }

  .supplier-offer-card__facts span,
  .supplier-offer-card__facts strong {
    display: block;
    overflow-wrap: anywhere;
  }

  .supplier-offer-card__facts span {
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
  }

  .supplier-offer-card__facts strong {
    margin-top: 3px;
    color: #0f172a;
    font-size: 11px;
  }

  .supplier-offer-card .secondary-button {
    width: 100%;
    min-height: 42px;
  }

  .supplier-rule-list > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .supplier-rule-list strong {
    text-align: left;
  }
}

@media (min-width: 1100px) {
  .product-summary-grid {
    grid-template-columns: 1fr 1fr 1.15fr 1.1fr;
  }

  .product-summary-grid--product {
    grid-template-areas:
      "quick stock pricing"
      "suppliers suppliers suppliers";
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .product-summary-grid--product > :nth-child(1) { grid-area: quick; }
  .product-summary-grid--product > :nth-child(2) { grid-area: stock; }
  .product-summary-grid--product > :nth-child(3) { grid-area: suppliers; }
  .product-summary-grid--product > :nth-child(4) { grid-area: pricing; }
}

@media (max-width: 768px) {
  .product-summary-grid,
  .supplier-cards-grid,
  .supplier-rules-grid {
    grid-template-columns: 1fr;
  }
}

.summary-card-panel {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 1px 2px rgba(0,0,0,0.02);
  min-height: 0;
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.card-title {
  font-size: 14px;
  font-weight: 750;
  color: #0f172a;
  display: flex;
  align-items: center;
  gap: 6px;
}

.card-title .icon {
  font-size: 15px;
}

.card-body-quick {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13px;
}

.metric-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12.5px;
}

.metric-line .label {
  color: #64748b;
  font-weight: 500;
}

.metric-line .value {
  color: #0f172a;
  font-weight: 700;
}

.metric-line .value-highlight {
  color: #4f46e5;
  font-weight: 800;
}

.metric-line .value-link {
  color: #4f46e5;
  font-weight: 600;
  text-decoration: none;
}

.stock-status-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  margin-bottom: 10px;
}

.stock-stat-box {
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 8px;
  padding: 6px 8px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.stat-label {
  font-size: 11px;
  font-weight: 600;
  color: #64748b;
}

.stat-val {
  font-size: 18px;
  font-weight: 850;
  color: #0f172a;
  line-height: 1.1;
}

.stat-val.green { color: #16a34a; }
.stat-val.amber { color: #d97706; }
.stat-val.blue { color: #0284c7; }
.stat-val.purple { color: #7c3aed; }

.physical-locations-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-top: 1px solid #f1f5f9;
  padding-top: 8px;
}

.physical-location-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  color: #334155;
}

.card-body-suppliers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.supplier-row {
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 8px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 7px;
}

.supplier-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.supplier-name {
  font-size: 13px;
  font-weight: 750;
  color: #0f172a;
}
.supplier-name .ocrl-price-toggle { min-height: 32px; }
.supplier-name .ocrl-price-toggle small { font-size: 9px; }

.supplier-details {
  font-size: 11.5px;
  color: #64748b;
  display: grid;
  gap: 3px;
}

.supplier-price-breakdown {
  display: grid;
  gap: 2px;
  padding-top: 4px;
  border-top: 1px solid #e2e8f0;
  color: #475569;
  font-size: 11px;
}

.supplier-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
}

@media (prefers-reduced-motion: reduce) {
  .ocrl-price-toggle__flip { transition: none; }
  [data-ocrl-price-scope].is-flipping [data-ocrl-price-value] { animation: none; }
}

.supplier-search-term {
  overflow: hidden;
  flex: 1;
  color: #64748b;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.supplier-copy-btn {
  min-width: max-content;
  padding-inline: 7px;
  cursor: pointer;
}

.product-source-description {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  margin: 12px 0 0;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.product-source-description strong,
.product-source-description p {
  margin: 0;
}

.product-detail-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}

.product-detail-specs span {
  padding: 4px 8px;
  border: 1px solid #ded7e9;
  border-radius: 999px;
  background: #faf8ff;
  color: #5f566d;
  font-size: 10px;
  font-weight: 780;
}

.product-technical-details { margin-top: 8px; }
.product-technical-details summary {
  color: var(--primary-deep);
  font-size: 11px;
  font-weight: 780;
  cursor: pointer;
}
.product-technical-details p { white-space: pre-line; }

.product-source-description p {
  margin-top: 4px;
  color: #475569;
  font-size: 12px;
  line-height: 1.5;
}

.price-card-actions {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 7px;
}

.price-risk-inline {
  display: block;
  margin-top: 3px;
  color: #b33a2b;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.3;
}

@media (max-width: 900px) {
  .card-body-suppliers,
  .product-source-description {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .catalog-clear-button {
    width: 100%;
  }

  .product-page-breadcrumbs,
  .product-hero-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .breadcrumb-trail,
  .product-hero-left,
  .product-hero-meta {
    min-width: 0;
    max-width: 100%;
  }

  .breadcrumb-trail {
    flex-wrap: wrap;
  }

  .product-hero-left {
    align-items: flex-start;
    width: 100%;
  }

  .product-hero-title,
  .product-hero-subtitle,
  .product-hero-ids {
    overflow-wrap: anywhere;
  }

  .product-hero-ids,
  .product-hero-right {
    flex-wrap: wrap;
  }

  .product-hero-right {
    width: 100%;
  }

  .product-tabs-bar {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
  }

  .product-tab-btn {
    flex: 0 0 auto;
  }

  .supplier-actions .supplier-search-term {
    flex-basis: 100%;
  }

  .supplier-actions .supplier-link-btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}

.supplier-link-btn {
  border: 1px solid #cbd5e1;
  background: #ffffff;
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 600;
  color: #4338ca;
  text-decoration: none;
  transition: background 0.15s;
}

.supplier-link-btn:hover {
  background: #f1f5f9;
}

.pricing-tier-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #f1f5f9;
}

.pricing-tier-row:last-child {
  border-bottom: none;
}

.tier-name {
  font-size: 13px;
  font-weight: 600;
  color: #334155;
}

.tier-prices {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.price-usd {
  font-size: 14.5px;
  font-weight: 800;
  color: #0f172a;
}

.price-ars {
  font-size: 11px;
  font-weight: 500;
  color: #64748b;
}

.card-footer-note {
  border-top: 1px solid #f1f5f9;
  padding-top: 8px;
  margin-top: 8px;
  font-size: 10.5px;
  color: #94a3b8;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Activity Timeline Panel */
.activity-timeline-panel {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 12px 16px;
  margin-top: 10px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.02);
}

.panel-header-timeline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.timeline-title {
  font-size: 14px;
  font-weight: 750;
  color: #0f172a;
  display: flex;
  align-items: center;
  gap: 6px;
}

.timeline-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.timeline-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  transition: background 0.15s;
  cursor: pointer;
}

.timeline-item:hover {
  background: #f1f5f9;
}

.timeline-left {
  display: flex;
  align-items: center;
  gap: 10px;
}

.timeline-avatar {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #e0e7ff;
  color: #4338ca;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.timeline-text {
  font-size: 12px;
  color: #334155;
  font-weight: 500;
}

.timeline-time {
  font-weight: 600;
  color: #64748b;
  margin-right: 6px;
}

.timeline-arrow {
  color: #94a3b8;
  font-weight: 700;
  font-size: 13px;
}

/* Product operations centre: layered data, compact density, and contained mobile UI. */
.product-page-wrapper { min-width: 0; max-width: 1500px; gap: 12px; }
.product-hero-card { gap: 16px; min-width: 0; }
.product-hero-left,
.product-hero-right { min-width: 0; }
.product-hero-right { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin-left: auto; align-items: stretch; }
.product-hero-kpis { display: grid; grid-template-columns: repeat(4, minmax(76px, 1fr)); min-width: 360px; border: 1px solid #eef0f5; border-radius: 10px; overflow: hidden; }
.product-hero-kpis > div { min-width: 0; padding: 7px 10px; border-right: 1px solid #eef0f5; }
.product-hero-kpis > div:last-child { border-right: 0; }
.product-hero-kpis span,
.product-hero-kpis strong { display: block; overflow-wrap: anywhere; }
.product-hero-kpis span { color: #64748b; font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.product-hero-kpis strong { margin-top: 2px; color: #0f172a; font-size: 12px; line-height: 1.28; }
.product-hero-actions { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.product-tabs-bar { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
.product-tab-btn { flex: 0 0 auto; min-height: 42px; white-space: nowrap; }
.module-subcopy { margin: 3px 0 0; color: #64748b; font-size: 11px; font-weight: 500; line-height: 1.35; }
.operational-empty-state { display: grid; gap: 4px; margin-top: 12px; padding: 11px 12px; border: 1px dashed #cbd5e1; border-radius: 9px; background: #f8fafc; color: #64748b; font-size: 12px; }
.operational-empty-state strong { color: #334155; }
.traceability-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.traceability-grid > div { min-width: 0; padding: 10px; border: 1px solid #eef0f5; border-radius: 9px; background: #f8fafc; }
.traceability-grid span,
.traceability-grid strong { display: block; overflow-wrap: anywhere; }
.traceability-grid span { color: #64748b; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.traceability-grid strong { margin-top: 4px; color: #0f172a; font-size: 12px; }
.owned-price-tier-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 12px; }
.product-table-scroll { width: 100%; max-width: 100%; }

@media (min-width: 1100px) {
  .product-summary-grid--product { grid-template-areas: "quick stock pricing" "suppliers suppliers suppliers"; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr); }
  .product-summary-grid--product > :nth-child(1) { grid-area: quick; }
  .product-summary-grid--product > :nth-child(2) { grid-area: stock; }
  .product-summary-grid--product > :nth-child(3) { grid-area: suppliers; }
  .product-summary-grid--product > :nth-child(4) { grid-area: pricing; }
}

@media (max-width: 1180px) {
  .product-hero-card { align-items: flex-start; flex-direction: column; }
  .product-hero-right { width: 100%; margin-left: 0; }
  .product-hero-kpis { width: 100%; min-width: 0; }
}

@media (min-width: 701px) and (max-width: 920px) {
  .catalog-filter-bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .catalog-filter-bar .search-box { grid-column: 1 / -1; min-width: 0; }
  .catalog-filter-details,
  .catalog-filter-options { display: contents; }
  .catalog-filter-details summary { display: none; }
  .catalog-filter-options select { width: 100%; min-width: 0; }
  .catalog-clear-button { justify-self: start; }
  .product-table { display: none; }
  .product-card-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .product-catalog-card { display: grid; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.86); }
  .product-catalog-card__identity { display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 10px; align-items: center; }
  .product-catalog-card__identity .product-thumb-shell { width: 60px; height: 60px; }
  .product-catalog-card__identity strong,
  .product-catalog-card__identity span,
  .product-catalog-card__facts span,
  .product-catalog-card__facts strong,
  .product-catalog-card__facts small { display: block; min-width: 0; overflow-wrap: anywhere; }
  .product-catalog-card__identity strong { font-size: 14px; line-height: 1.3; }
  .product-catalog-card__identity span { margin-top: 3px; color: var(--muted); font-size: 11px; }
  .product-catalog-card__facts { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .product-catalog-card__facts > div { padding: 9px; border-radius: 10px; background: var(--surface-soft); }
  .product-catalog-card__facts span { margin-bottom: 3px; color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; }
  .product-catalog-card__facts strong { font-size: 12px; }
  .product-catalog-card__facts small { margin-top: 3px; color: var(--muted); font-size: 10px; }
  .product-catalog-card__actions { display: flex; gap: 8px; }
  .product-catalog-card__actions .secondary-button { min-height: 44px; flex: 1; }
  .product-catalog-card__actions .text-button { min-height: 44px; }
}

/* Desktop keeps all catalog controls in one bounded, comparable toolbar row. */
@media (min-width: 921px) {
  .catalog-filter-bar {
    display: grid;
    grid-template-columns: minmax(340px, 1fr) auto auto auto;
    align-items: center;
    gap: 10px;
  }

  .catalog-filter-bar .search-box {
    grid-column: auto;
    min-width: 0;
  }

  .catalog-filter-details {
    display: block;
    position: relative;
    min-width: 0;
  }

  .catalog-filter-details summary {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 13px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    background: #fff;
    color: var(--ink);
    font-size: 12px;
    font-weight: 760;
    cursor: pointer;
    list-style: none;
    white-space: nowrap;
  }

  .catalog-filter-details summary::-webkit-details-marker { display: none; }
  .catalog-filter-details summary::after { content: "⌄"; color: var(--muted); }
  .catalog-filter-details[open] summary,
  .catalog-filter-details.has-active-filters summary { border-color: #bcaaf2; background: #f8f5ff; color: var(--primary-deep); }

  .catalog-filter-options {
    display: none;
    position: absolute;
    z-index: 35;
    top: calc(100% + 8px);
    right: 0;
    width: min(820px, calc(100vw - 380px));
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 12px;
    border: 1px solid #dfd7ea;
    border-radius: 14px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 18px 45px rgba(37,27,58,.16);
  }

  .catalog-filter-details[open] .catalog-filter-options { display: grid; }

  .catalog-filter-options .catalog-filter-field {
    display: grid;
    gap: 5px;
    min-width: 0;
  }

  .catalog-filter-options .catalog-filter-field > span {
    display: block;
    color: #736b82;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
  }

  .catalog-filter-options select {
    width: 100%;
    min-width: 0;
  }

  .catalog-clear-button {
    justify-self: end;
    white-space: nowrap;
  }
}

@media (min-width: 701px) {
  .app-shell.catalog-compare-active .topbar { position: relative; height: 50px; padding-inline: 18px; gap: 10px; }
  .app-shell.catalog-compare-active .topbar-context .eyebrow,
  .app-shell.catalog-compare-active .topbar-actions,
  .app-shell.catalog-compare-active .environment-banner,
  .app-shell.catalog-compare-active .global-breadcrumb-bar { display: none !important; }
  .app-shell.catalog-compare-active .topbar-context h1 { margin: 0; font-size: 18px; }
  .app-shell.catalog-compare-active .product-catalog-panel.catalog-mode--compare .catalog-sticky-controls { top: 0; }
}

@media (min-width: 921px) {
  .desktop-sidebar-toggle { display: inline-grid !important; }
  .app-shell.sidebar-collapsed { grid-template-columns: 72px minmax(0, 1fr); }
  .app-shell.sidebar-collapsed .sidebar { width: 72px; padding-inline: 9px; }
  .app-shell.sidebar-collapsed .brand-row { justify-content: center; }
  .app-shell.sidebar-collapsed .brand-row > div:not(.brand-mark),
  .app-shell.sidebar-collapsed .nav-item > span:not(.nav-icon),
  .app-shell.sidebar-collapsed .prototype-status > div,
  .app-shell.sidebar-collapsed .sidebar-profile .profile-copy,
  .app-shell.sidebar-collapsed .sidebar-profile .logout-button { display: none; }
  .app-shell.sidebar-collapsed .nav-item { justify-content: center; padding-inline: 0; }
  .app-shell.sidebar-collapsed .nav-icon { margin: 0; }
  .app-shell.sidebar-collapsed .prototype-status,
  .app-shell.sidebar-collapsed .sidebar-profile { justify-content: center; padding-inline: 5px; }
}

@media (max-width: 700px) {
  html, body { max-width: 100%; overflow-x: clip; }
  .own-price-modal { width: 100%; max-height: 94vh; }
  .own-price-modal .modal-header { padding: 14px 16px; align-items: flex-start; }
  .own-price-modal .modal-header h2 { font-size: 17px; line-height: 1.25; overflow-wrap: anywhere; }
  .own-price-modal .modal-body { padding: 14px; }
  .own-price-modal .modal-footer { padding: 12px 14px max(12px, env(safe-area-inset-bottom)); }
  .own-price-form-grid { grid-template-columns: 1fr; gap: 10px; }
  .own-price-tier-editor { grid-template-columns: 1fr 1fr; }
  .own-price-tier-editor > strong { grid-column: 1 / -1; }
  .own-price-override-field { grid-column: auto; grid-template-columns: 1fr; align-items: stretch; }
  .own-price-copy-button { min-height: 44px; padding: 7px 8px; }
  .own-price-risk-panel,
  .own-price-risk-ack { font-size: 11px; line-height: 1.4; }
  .environment-banner { margin: 4px 12px 0; padding: 7px 10px; align-items: flex-start; font-size: 11px; }
  .environment-banner .banner-action-btn { min-height: 32px; padding-inline: 8px; white-space: normal; }
  .global-breadcrumb-bar { display: none; }
  .product-page-wrapper { padding: 0 0 12px; gap: 9px; }
  .product-page-breadcrumbs { align-items: flex-start; }
  .breadcrumb-current, .breadcrumb-category { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .product-page-top-actions { display: none; }
  .product-hero-card { padding: 12px; border-radius: 13px; }
  .product-hero-left { gap: 10px; width: 100%; }
  .product-image-container { width: 56px; height: 56px; }
  .product-hero-title { font-size: 16px; overflow-wrap: anywhere; }
  .product-hero-subtitle { font-size: 11px; }
  .product-hero-ids { display: block; font-size: 10px; overflow-wrap: anywhere; }
  .id-sep { display: none; }
  .id-item { display: block; }
  .product-hero-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-hero-kpis > div:nth-child(2) { border-right: 0; }
  .product-hero-kpis > div:nth-child(-n+2) { border-bottom: 1px solid #eef0f5; }
  .product-hero-actions { justify-content: flex-start; width: 100%; }
  .product-hero-actions .active-pill { display: none; }
  .compact-pill { min-height: 42px; }
  .options-dots-btn { width: 42px; height: 42px; }
  .product-tab-btn { min-height: 46px; padding: 9px 12px; font-size: 12px; }
  .product-summary-grid { gap: 9px; }
  .summary-card-panel, .activity-timeline-panel { padding: 12px !important; border-radius: 12px; }
  .card-header { align-items: flex-start; gap: 8px; }
  .card-header .header-actions, .price-card-actions { flex-wrap: wrap; }
  #tab-content-prices .card-header { flex-direction: column; }
  #tab-content-prices .price-card-actions { width: 100%; min-width: 0; justify-content: flex-start; }
  #tab-content-prices .price-card-actions > * { max-width: 100%; }
  .card-body-suppliers { grid-template-columns: 1fr; }
  .traceability-grid { grid-template-columns: 1fr; }
  .owned-price-tier-grid { grid-template-columns: 1fr; gap: 9px; }
  .product-tab-content { max-width: 100%; min-width: 0; overflow: visible; }
  .product-table-scroll {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--line);
    border-radius: 10px;
  }
  .product-tab-content .product-operational-table {
    width: max-content;
    min-width: 610px;
    table-layout: auto;
  }
  .product-tab-content .product-supplier-table { min-width: 760px; }
  .product-tab-content .product-operational-table th,
  .product-tab-content .product-operational-table td { padding: 9px 10px; font-size: 11px; white-space: nowrap; }
  .product-tab-content .product-operational-table .secondary-button { min-height: 40px; padding: 6px 9px; font-size: 11px; }
  .catalog-view-heading { align-items: stretch; flex-direction: column; }
  .catalog-view-switch { width: 100%; }
  .catalog-view-switch button { flex: 1; }
  .supplier-search-state { align-items: flex-start; flex-wrap: wrap; }
  .product-catalog-panel.catalog-mode--compare .product-card-list { grid-template-columns: 1fr; }
  .purchase-card__image { height: 120px; }
  .purchase-card__image img { max-height: 96px; }
  .app-shell.catalog-compare-active .topbar { position: relative; }
  .app-shell.catalog-compare-active .product-catalog-panel.catalog-mode--compare .catalog-sticky-controls {
    top: 0;
    margin-inline: -8px;
    padding-inline: 8px;
  }
  .app-shell.catalog-compare-active .product-catalog-panel.catalog-mode--compare .catalog-sticky-controls .search-box {
    width: 100%;
  }
}

/* Keep the QA catalog overrides last in the cascade. */
.price-list-home-actions { display: flex; align-items: center; gap: 10px; }
.price-list-result { position: relative; }
.price-list-result-header { padding-bottom: 12px; }
.price-list-result-title h2 { font-size: clamp(24px, 2.5vw, 34px); }
.price-list-viewbar { justify-content: flex-end; margin-bottom: 10px; }
.price-list-persona { margin-right: auto; }
.commercial-list-shell { overflow: visible; border-radius: 18px; background: #f6f7f9; }
.commercial-list-brand { align-items: center; padding: 15px 20px; border-radius: 18px 18px 0 0; background: #182033; }
.commercial-list-logo { margin: 0 0 5px; padding: 3px 7px; font-size: 8px; }
.commercial-list-brand h1 { font-size: clamp(20px, 2.4vw, 29px); letter-spacing: -.03em; }
.commercial-list-brand p { margin-top: 3px; font-size: 11px; }
.commercial-list-controls { position: sticky; top: 0; display: flex; grid-template-columns: none; flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
.commercial-list-controls .search-box { min-width: min(100%, 320px); flex: 1 1 360px; }
.commercial-list-controls select { width: auto; min-width: 135px; max-width: 190px; height: 40px; border: 1px solid #dce1e9; border-radius: 9px; background: #fff; color: #343c4c; font-size: 11px; }
.commercial-list-controls > span { margin-left: auto; }
.commercial-list-layout { display: block; padding: 18px; }
.commercial-list-grid,
.wizard-commercial-preview .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.commercial-list-card { isolation: isolate; min-height: 560px; overflow: hidden; border-radius: 18px; box-shadow: 0 5px 18px rgba(24, 32, 51, .04); }
.commercial-card-media { position: relative; display: grid; width: 100%; height: 210px; min-height: 210px; max-height: 210px; flex: 0 0 210px; place-items: center; overflow: hidden; padding: 0; border: 0; border-bottom: 1px solid #eef0f4; background: linear-gradient(145deg, #fff, #f3f5f8); color: #a6aebb; font-size: 11px; cursor: pointer; }
.commercial-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; padding: 18px; object-fit: contain; object-position: center; background: #fff; }
.commercial-card-copy { display: flex; min-height: 170px; flex-direction: column; gap: 6px; padding: 15px 16px 10px; }
.commercial-card-copy > span { min-height: 14px; }
.commercial-card-title { display: -webkit-box; width: 100%; min-height: 58px; max-height: 58px; overflow: hidden; padding: 0; border: 0; background: transparent; color: #1f2738; text-align: left; font-size: 15px; font-weight: 780; line-height: 1.28; cursor: pointer; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.commercial-card-copy > small { min-height: 16px; color: #6f7786; font-size: 10px; font-weight: 700; }
.commercial-card-copy p { min-height: 50px; max-height: 50px; font-size: 11px; line-height: 1.5; -webkit-line-clamp: 3; }
.commercial-availability { margin: 0 16px 10px; }
.commercial-price-row { min-height: 76px; padding: 12px 16px; }
.commercial-price-row strong { font-size: 19px; }
.commercial-add-button { width: calc(100% - 32px); margin: 0 16px 16px; }
.commercial-private-layer { margin: 0 16px 12px; }
.commercial-cart-backdrop { position: fixed; z-index: 39; inset: 0; visibility: hidden; background: rgba(20, 27, 42, .34); opacity: 0; transition: opacity .18s ease, visibility .18s ease; }
.commercial-cart-backdrop.open { visibility: visible; opacity: 1; }
.commercial-cart { position: fixed; z-index: 40; top: 0; right: 0; bottom: 0; width: min(420px, 94vw); min-height: 0; overflow-y: auto; padding: 24px; border: 0; border-radius: 0; box-shadow: -18px 0 45px rgba(19, 27, 44, .18); transform: translateX(105%); transition: transform .2s ease; }
.commercial-cart.open { transform: translateX(0); }

@media (max-width: 1080px) {
  .commercial-list-grid,
  .wizard-commercial-preview .commercial-list-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .price-list-home-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .price-list-viewbar { display: grid; grid-template-columns: 1fr auto; }
  .price-list-persona { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  .price-list-persona select { width: 100%; }
  .commercial-list-brand { align-items: flex-start; flex-direction: row; padding: 13px 14px; }
  .commercial-list-controls { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 10px; }
  .commercial-list-controls .search-box { grid-column: 1 / -1; min-width: 0; }
  .commercial-list-controls select { width: 100%; max-width: none; min-width: 0; }
  .commercial-list-controls > span { grid-column: 1 / -1; margin-left: 0; }
  .commercial-list-layout { padding: 10px; }
  .commercial-list-grid,
  .wizard-commercial-preview .commercial-list-grid { grid-template-columns: 1fr; gap: 13px; }
  .commercial-list-card { min-height: 0; }
  .commercial-card-media { height: 200px; min-height: 200px; max-height: 200px; flex-basis: 200px; }
  .commercial-card-copy { min-height: 165px; }
  .commercial-cart { top: auto; width: 100%; max-height: min(78vh, 620px); border-radius: 20px 20px 0 0; transform: translateY(105%); }
  .commercial-cart.open { transform: translateY(0); }
}

/* Commercial list v3: scan prices first, configure second. */
.app-shell.price-list-detail-active .topbar { min-height: 56px; height: 56px; padding-block: 7px; }
.app-shell.price-list-detail-active .topbar-context { display: none; }
.app-shell.price-list-detail-active .global-breadcrumb-bar { display: none !important; }
.price-list-result { max-width: 1540px; padding-top: 0; }
.price-list-compact-header { display: grid; grid-template-columns: 38px minmax(260px, 1fr) auto; align-items: center; gap: 10px; padding: 8px 0 9px; }
.price-list-compact-back { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid #dfe3ea; border-radius: 10px; background: #fff; color: #4b45bd; font-size: 18px; cursor: pointer; }
.price-list-compact-title { min-width: 0; }
.price-list-compact-title > div { display: flex; align-items: center; gap: 8px; }
.price-list-compact-title h2 { overflow: hidden; margin: 0; font-size: 21px; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }
.price-list-compact-title p { margin: 2px 0 0; color: #747d8c; font-size: 10px; }
.price-list-result-actions { flex-wrap: nowrap; gap: 6px; }
.price-list-result-actions button { min-height: 34px; padding: 7px 10px; font-size: 10px; }
.price-list-viewbar { min-height: 44px; margin: 0 0 7px; padding: 5px 7px; border: 1px solid #e1e5ec; border-radius: 12px; background: #fff; }
.price-list-view-toggle button,
.price-list-density-toggle button { min-height: 30px; padding: 5px 10px; font-size: 10px; }
.price-list-persona { margin-right: auto; }
.price-list-persona select { min-width: 150px; height: 32px; font-size: 10px; }
.price-list-density-toggle { display: inline-flex; padding: 3px; border: 1px solid #e1e4ea; border-radius: 10px; background: #f2f4f7; }
.price-list-density-toggle button { border: 0; border-radius: 7px; background: transparent; color: #747d8c; font-weight: 750; cursor: pointer; }
.price-list-density-toggle button.active { background: #fff; color: #4039b0; box-shadow: 0 1px 5px rgba(31, 40, 62, .1); }
.commercial-cart-launch { min-height: 34px; padding-block: 6px; }
.commercial-list-shell { border-radius: 14px; box-shadow: 0 8px 24px rgba(28, 36, 58, .05); }
.commercial-list-controls { border-radius: 14px 14px 0 0; padding: 9px 12px; }
.commercial-list-controls .search-box input { min-height: 36px; }
.commercial-list-controls select { height: 36px; min-width: 125px; }
.commercial-list-layout { padding: 12px; }
.density-compact .commercial-list-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.density-compact .commercial-list-card { min-height: 390px; border-radius: 13px; }
.density-compact .commercial-card-media { height: 128px; min-height: 128px; max-height: 128px; flex-basis: 128px; }
.density-compact .commercial-card-media img { padding: 9px; }
.density-compact .commercial-card-copy { min-height: 116px; gap: 3px; padding: 10px 11px 7px; }
.density-compact .commercial-card-copy > span { min-height: 11px; font-size: 8px; }
.density-compact .commercial-card-title { min-height: 34px; max-height: 34px; font-size: 12px; line-height: 1.35; -webkit-line-clamp: 2; }
.density-compact .commercial-card-copy > small { min-height: 13px; font-size: 8px; }
.density-compact .commercial-card-copy p { min-height: 30px; max-height: 30px; font-size: 9px; line-height: 1.4; -webkit-line-clamp: 2; }
.density-compact .commercial-card-attributes { display: none; }
.density-compact .commercial-availability { margin: 0 11px 7px; padding: 4px 7px; font-size: 8px; }
.density-compact .commercial-price-row { min-height: 61px; padding: 8px 11px; }
.density-compact .commercial-price-row strong { font-size: 15px; }
.density-compact .commercial-price-row span { font-size: 8px; }
.density-compact .commercial-quantity input { width: 50px; height: 29px; }
.density-compact .commercial-private-layer { margin: 0 9px 8px; padding: 8px; }
.density-compact .commercial-add-button { width: calc(100% - 22px); min-height: 34px; margin: 0 11px 10px; padding-block: 6px; font-size: 9px; }
.density-detailed .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 1180px) {
  .density-compact .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .price-list-compact-header { grid-template-columns: 36px minmax(0, 1fr); }
  .price-list-result-actions { grid-column: 1 / -1; width: 100%; overflow-x: auto; padding-bottom: 2px; }
  .price-list-result-actions button { flex: 0 0 auto; }
  .price-list-viewbar { grid-template-columns: auto 1fr auto; }
  .price-list-persona { grid-column: auto; grid-row: auto; }
  .price-list-density-toggle { display: none; }
  .density-compact .commercial-list-grid,
  .density-detailed .commercial-list-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .app-shell.price-list-detail-active .topbar { min-height: 52px; height: 52px; }
  .price-list-result { padding-bottom: 88px; }
  .price-list-compact-header { gap: 7px; padding: 4px 0 6px; }
  .price-list-compact-title h2 { font-size: 18px; }
  .price-list-compact-title p { font-size: 9px; white-space: normal; }
  .price-list-result-actions { margin-top: 1px; }
  .price-list-result-actions button { min-height: 31px; }
  .price-list-viewbar { grid-template-columns: 1fr auto; gap: 6px; }
  .price-list-persona { display: none; }
  .commercial-list-controls { grid-template-columns: 1fr 1fr; gap: 6px; padding: 8px; }
  .commercial-list-controls .search-box { grid-column: 1 / -1; }
  .commercial-list-controls select { height: 34px; font-size: 9px; }
  .commercial-list-layout { padding: 8px; }
  .density-compact .commercial-list-grid,
  .density-detailed .commercial-list-grid { grid-template-columns: 1fr; gap: 8px; }
  .density-compact .commercial-list-card { display: grid; min-height: 0; grid-template-columns: 112px minmax(0, 1fr); align-items: start; }
  .density-compact .commercial-card-media { width: 112px; height: 112px; min-height: 112px; max-height: 112px; grid-column: 1; grid-row: 1; border-right: 1px solid #eef0f4; border-bottom: 0; }
  .density-compact .commercial-card-copy { min-height: 112px; grid-column: 2; grid-row: 1; padding: 9px 10px 5px; }
  .density-compact .commercial-card-copy p { min-height: 25px; max-height: 25px; -webkit-line-clamp: 2; }
  .density-compact .commercial-availability { grid-column: 1 / -1; margin: 7px 9px 3px; }
  .density-compact .commercial-price-row,
  .density-compact .commercial-private-layer,
  .density-compact .commercial-add-button { grid-column: 1 / -1; }
  .density-compact .commercial-price-row { min-height: 55px; }
  .density-compact .commercial-add-button { width: calc(100% - 18px); margin: 0 9px 9px; }
}

/* Keep the shared Products projection overrides last in the cascade. */
.app-shell.price-list-detail-active .topbar { min-height: 52px; height: 52px; padding-block: 5px; }
.app-shell.price-list-detail-active .environment-banner,
.app-shell.price-list-detail-active .env-mode-chip { display: none !important; }
.price-list-result { width: 100%; max-width: 1680px; padding: 0 0 20px; }
.commercial-list-shell.commercial-catalog-projection { overflow: visible; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: none; }
.commercial-catalog-projection .commercial-list-layout { display: block; padding: 9px; }
.density-compact .commercial-list-grid { grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 9px; }
.density-compact .commercial-list-card { min-height: 0; border-radius: 14px; }
.density-compact .commercial-list-card .commercial-availability { max-width: 98px; min-height: 20px; margin: 0; padding: 3px 6px; font-size: 7px; }
.density-compact .commercial-list-card .commercial-price-row { min-height: 54px; padding: 7px 8px; }
.density-compact .commercial-list-card .commercial-price-row strong { font-size: 14px; }
.density-compact .commercial-list-card .commercial-price-row span { font-size: 7px; }
.density-compact .commercial-list-card .commercial-private-layer { margin: 0; padding: 7px; }
.density-compact .commercial-list-card .commercial-add-button { width: 100%; min-height: 31px; margin: 0; padding: 5px 8px; font-size: 8px; }

@media (min-width: 1600px) {
  .density-compact .commercial-list-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (max-width: 920px) {
  .density-compact .commercial-list-grid,
  .density-detailed .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .app-shell.price-list-detail-active .topbar { min-height: 48px; height: 48px; }
  .commercial-catalog-projection .commercial-list-layout { padding: 7px; }
  .density-compact .commercial-list-grid,
  .density-detailed .commercial-list-grid { grid-template-columns: 1fr; gap: 7px; }
  .density-compact .commercial-list-card,
  .density-detailed .commercial-list-card { display: grid; min-height: 0; grid-template-columns: 94px minmax(0, 1fr); }
  .density-compact .commercial-list-card .purchase-card__image,
  .density-detailed .commercial-list-card .purchase-card__image { width: 94px; height: 100%; min-height: 150px; max-height: none; padding: 7px; border-right: 1px solid #eeeaf3; border-bottom: 0; }
  .density-compact .commercial-list-card .purchase-card__description,
  .density-detailed .commercial-list-card .purchase-card__description { min-height: 26px; max-height: 26px; -webkit-line-clamp: 2; }
}

/* Final cascade: four levels stay compact in the approved shared-card density. */
.density-compact .commercial-list-card .purchase-card__image { height: 94px; min-height: 94px; padding: 7px 12px; }
.density-compact .commercial-list-card .purchase-card__image img { max-height: 76px; }
.density-compact .commercial-list-card .purchase-card__body { gap: 5px; padding: 8px; }
.density-compact .commercial-list-card .purchase-card__description { min-height: 26px; max-height: 26px; -webkit-line-clamp: 2; }
.density-compact .commercial-list-card { content-visibility: auto; contain-intrinsic-size: 250px 440px; }
.commercial-catalog-explorer.density-compact .commercial-list-grid,
.price-list-result.density-compact .commercial-list-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.commercial-catalog-explorer .commercial-level-row > span strong,
.price-list-result .commercial-level-row > span strong { font-size: 9px; }
.commercial-catalog-explorer .commercial-level-row > span small,
.price-list-result .commercial-level-row > span small { font-size: 8px; }
.commercial-catalog-explorer .commercial-level-row > b,
.price-list-result .commercial-level-row > b { font-size: 11px; }
.commercial-catalog-explorer .commercial-level-row > em,
.price-list-result .commercial-level-row > em { padding: 5px 7px; font-size: 8px; }

@media (max-width: 1400px) {
  .commercial-catalog-explorer .commercial-list-grid,
  .price-list-result .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .commercial-catalog-explorer.density-compact .commercial-list-grid,
  .price-list-result.density-compact .commercial-list-grid,
  .price-list-result.density-detailed .commercial-list-grid { grid-template-columns: 1fr; }
  .density-compact .commercial-list-card,
  .density-detailed .commercial-list-card { grid-template-columns: 92px minmax(0, 1fr); }
  .density-compact .commercial-list-card .purchase-card__image,
  .density-detailed .commercial-list-card .purchase-card__image { width: 92px; height: 126px; min-height: 126px; }
  .density-compact .commercial-list-card .purchase-card__image img,
  .density-detailed .commercial-list-card .purchase-card__image img { max-height: 84px; }
  .commercial-levels-heading,
  .commercial-price-levels,
  .commercial-card-order,
  .commercial-private-layer { grid-column: 1 / -1; }
}

/* Commercial list v5: literal quote-list composition inspired by the approved wireframe. */
.commercial-reference-top {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr) 164px;
  align-items: stretch;
  gap: 10px;
  padding: 10px;
  border-bottom: 1px solid #ebe6ef;
  background: #f7f5fb;
}
.commercial-technical-heading {
  display: grid;
  place-content: center;
  min-height: 80px;
  padding: 10px;
  border: 1px solid #d9d1e4;
  border-radius: 12px;
  background: #fff;
  text-align: center;
}
.commercial-technical-heading span {
  color: #242033;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.commercial-technical-heading small { margin-top: 4px; color: #7b7285; font-size: 8px; font-weight: 760; }
.commercial-brand-showcase {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #ddd6e7;
  border-radius: 12px;
  background: #fff;
}
.commercial-brand-showcase > div:first-child { display: flex; align-items: baseline; gap: 8px; padding: 0 2px 6px; }
.commercial-brand-showcase > div:first-child > span { color: #332c3c; font-size: 10px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.commercial-brand-showcase > div:first-child > small { color: #817887; font-size: 8px; }
.commercial-brand-track { display: flex; min-width: 0; gap: 6px; overflow-x: auto; padding: 1px 1px 4px; scrollbar-width: thin; }
.commercial-brand-track .catalog-brand-chip {
  position: relative;
  min-width: 88px;
  min-height: 47px;
  flex: 0 0 auto;
  justify-content: center;
  padding: 7px 10px;
  border-color: #ddd6e7;
  border-radius: 10px;
  box-shadow: none;
}
.commercial-brand-track .catalog-brand-chip > img { width: auto; max-width: 72px; height: 25px; object-fit: contain; filter: grayscale(1); opacity: .78; }
.commercial-brand-track .catalog-brand-chip:hover > img,
.commercial-brand-track .catalog-brand-chip.active > img { filter: none; opacity: 1; }
.commercial-brand-track .catalog-brand-chip > small { position: absolute; right: 4px; bottom: 3px; min-width: 18px; font-size: 6px; opacity: .62; }
.commercial-brand-track .catalog-brand-chip:not(.has-logo) > span { font-size: 10px; }
.commercial-brand-track .catalog-facet-more { min-height: 47px; }
.commercial-budget-launch {
  display: grid;
  place-content: center;
  gap: 2px;
  min-height: 80px;
  padding: 10px;
  border: 0;
  border-radius: 17px;
  background: linear-gradient(145deg, #6f5bd3, #5140b1);
  box-shadow: 0 10px 22px rgba(85, 64, 178, .2);
  color: #fff;
  text-align: center;
  cursor: pointer;
}
.commercial-budget-launch > span { font-size: 9px; font-weight: 760; text-transform: uppercase; }
.commercial-budget-launch > strong { font-size: 16px; line-height: 1.05; text-transform: uppercase; }
.commercial-budget-launch > small { margin-top: 4px; color: #ddd7ff; font-size: 7px; }
.commercial-budget-launch:hover { background: linear-gradient(145deg, #604cc4, #44339f); transform: translateY(-1px); }
.commercial-catalog-projection > .commercial-sticky-controls { margin-left: 215px; border-radius: 0; border-left: 1px solid #ebe6ef; }
.commercial-catalog-explorer { padding: 10px; }
.commercial-catalog-explorer > .catalog-category-nav { top: 92px; padding: 10px; border-radius: 12px; box-shadow: none; }
.commercial-technical-panel { display: grid; gap: 9px; margin-top: 4px; padding-top: 9px; border-top: 2px solid #ece6f3; }
.commercial-technical-context { display: grid; gap: 2px; padding: 9px; border-radius: 9px; background: #f7f4fb; }
.commercial-technical-context > span,
.commercial-technical-group > span { color: #756b80; font-size: 7px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.commercial-technical-context > strong { color: #292335; font-size: 11px; }
.commercial-technical-context > small { color: #7d7486; font-size: 8px; line-height: 1.35; }
.commercial-technical-group { display: grid; gap: 5px; }
.commercial-technical-group > div { display: grid; gap: 3px; }
.catalog-technical-filter {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  padding: 5px 7px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #4f4858;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.catalog-technical-filter:hover { background: #faf8ff; color: var(--primary-deep); }
.catalog-technical-filter.active { border-color: #cdbff2; background: var(--primary-soft); color: var(--primary-deep); }
.catalog-technical-filter > span { overflow: hidden; font-size: 8px; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
.catalog-technical-filter > small { min-width: 22px; padding: 2px 5px; border-radius: 99px; background: #efebf3; color: #706779; font-size: 7px; font-weight: 850; text-align: center; }
.commercial-catalog-explorer .catalog-explorer-main { padding-top: 0; }
.commercial-catalog-explorer .commercial-result-toolbar { padding-top: 0; }
.price-list-result.density-compact .commercial-list-grid,
.price-list-result.density-detailed .commercial-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.price-list-result .commercial-list-card { overflow: hidden; border: 1px solid #ddd7e4; border-radius: 12px; background: #fff; box-shadow: 0 4px 14px rgba(45, 32, 82, .055); content-visibility: auto; contain-intrinsic-size: 360px 650px; }
.price-list-result .commercial-list-card .purchase-card__image { height: 164px; min-height: 164px; padding: 10px 18px; background: #fff; }
.price-list-result .commercial-list-card .purchase-card__image img { max-height: 142px; }
.commercial-tax-strip { min-height: 18px; padding: 4px 10px 3px; border-bottom: 1px solid #ece7ef; background: #faf8fc; color: #873c27; font-size: 7px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.price-list-result .commercial-list-card .purchase-card__body { gap: 7px; padding: 10px; }
.price-list-result .commercial-list-card .purchase-card__identity { min-height: 46px; }
.price-list-result .commercial-list-card .catalog-card-title-button { min-height: 34px; font-size: 12px; line-height: 1.35; }
.price-list-result .commercial-list-card .purchase-card__description { min-height: 37px; max-height: 37px; font-size: 9px; -webkit-line-clamp: 3; }
.price-list-result .commercial-levels-heading { padding-top: 6px; }
.price-list-result .commercial-levels-heading strong { font-size: 9px; }
.price-list-result .commercial-levels-heading span { font-size: 7px; }
.price-list-result .commercial-price-levels { gap: 4px; }
.price-list-result .commercial-level-row {
  min-height: 48px;
  grid-template-columns: 82px minmax(0, 1fr) auto;
  gap: 8px;
  padding: 4px 7px 4px 4px;
  border-color: #dcd5e4;
  border-radius: 8px;
}
.price-list-result .commercial-level-row.selected { box-shadow: inset 3px 0 0 var(--primary); }
.price-list-result .commercial-level-action { display: grid; align-self: stretch; place-content: center; gap: 2px; min-width: 0; padding: 4px 5px; border-radius: 6px; background: var(--primary); color: #fff; text-align: center; }
.price-list-result .commercial-level-action > em { padding: 0; background: transparent; color: inherit; font-size: 8px; font-style: normal; font-weight: 900; text-transform: uppercase; }
.price-list-result .commercial-level-action > small { overflow: hidden; color: #e9e5ff; font-size: 6px; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
.price-list-result .commercial-level-copy { display: grid; min-width: 0; gap: 2px; }
.price-list-result .commercial-level-copy > strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.price-list-result .commercial-level-copy > small { color: #7b7283; font-size: 6px; font-weight: 720; text-transform: uppercase; }
.price-list-result .commercial-level-row > b { font-size: 12px; }
.commercial-stock-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #ded8e5; background: #f8f6fa; }
.commercial-stock-strip > span { display: grid; min-width: 0; gap: 2px; padding: 7px 8px; border-right: 1px solid #e4dee9; }
.commercial-stock-strip > span:last-child { border-right: 0; }
.commercial-stock-strip small { color: #7b7283; font-size: 6px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.commercial-stock-strip strong { overflow: hidden; color: #383141; font-size: 7px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 1024px) {
  .commercial-reference-top { grid-template-columns: minmax(0, 1fr) 150px; }
  .commercial-technical-heading { display: none; }
  .commercial-catalog-projection > .commercial-sticky-controls { margin-left: 0; border-left: 0; }
  .commercial-catalog-explorer { padding-top: 7px; }
  .price-list-result.density-compact .commercial-list-grid,
  .price-list-result.density-detailed .commercial-list-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .commercial-reference-top { grid-template-columns: 1fr; gap: 7px; padding: 7px; }
  .commercial-brand-showcase { padding: 7px; }
  .commercial-brand-showcase > div:first-child { display: grid; gap: 1px; }
  .commercial-brand-track .catalog-brand-chip { min-width: 82px; min-height: 43px; }
  .commercial-budget-launch { min-height: 56px; grid-template-columns: auto auto; align-items: baseline; gap: 5px; border-radius: 12px; }
  .commercial-budget-launch > small { grid-column: 1 / -1; margin-top: 0; }
  .commercial-catalog-explorer { padding: 7px; }
  .price-list-result.density-compact .commercial-list-grid,
  .price-list-result.density-detailed .commercial-list-grid { grid-template-columns: 1fr; gap: 9px; }
  .price-list-result .commercial-list-card { display: block; contain-intrinsic-size: 330px 620px; }
  .price-list-result .commercial-list-card .purchase-card__image,
  .price-list-result.density-detailed .commercial-list-card .purchase-card__image { width: 100% !important; height: 126px; min-height: 126px !important; max-height: 126px; padding: 8px 14px; border-right: 0; border-bottom: 1px solid #eeeaf3; }
  .price-list-result .commercial-list-card .purchase-card__image img { max-height: 108px; }
  .price-list-result .commercial-level-row { grid-template-columns: 78px minmax(0, 1fr) auto; }
  .commercial-stock-strip strong { white-space: normal; }
}

/* Shared density v6: maximize catalog workspace without splitting Products and Lists. */
@media (min-width: 921px) {
  :root {
    --sidebar-width: 212px;
    --topbar-height: 46px;
  }
  .sidebar { padding: 13px 10px 12px; }
  .brand-row { gap: 8px; padding: 2px 7px 13px; }
  .brand-mark { width: 34px; height: 34px; }
  .brand-name { font-size: 15px; }
  .brand-subtitle { font-size: 10px; }
  .nav-list { gap: 3px; }
  .nav-item { min-height: 38px; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 7px; padding-inline: 9px; border-radius: 10px; font-size: 12px; }
  .nav-icon { width: 21px; font-size: 15px; }
  .prototype-status { margin: 0 3px 9px; padding: 9px; }
  .sidebar-profile { gap: 7px; padding: 9px 6px 0; }
  .avatar { width: 32px; height: 32px; border-radius: 10px; }
  .topbar { height: var(--topbar-height); padding-inline: 15px; }
  .topbar-context h1 { font-size: 18px; }
  .content-area { padding: 12px 14px 34px; }
  .app-shell.catalog-compare-active .topbar { height: 42px; min-height: 42px; padding-inline: 14px; }
  .app-shell.price-list-detail-active .topbar { display: none; }
  .app-shell.price-list-detail-active .content-area { padding-top: 5px; }
  .price-list-explorer-bar { min-height: 39px; padding-block: 2px 4px; }
}

.catalog-category-all,
.catalog-category-item { grid-template-columns: 23px minmax(0, 1fr) auto auto; }
.catalog-subcategory-item { grid-template-columns: 21px minmax(0, 1fr) auto; padding-left: 7px; }
.catalog-category-icon {
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  border-radius: 6px;
  background: #f1edf7;
  color: #6759a7;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.catalog-category-item.active .catalog-category-icon,
.catalog-category-all.active .catalog-category-icon,
.catalog-subcategory-item.active .catalog-category-icon { background: #ded5ff; color: var(--primary-deep); }

@media (min-width: 1025px) {
  #productBrandChips,
  .commercial-brand-track {
    display: grid;
    grid-template-columns: repeat(9, minmax(0, 1fr));
    gap: 5px;
    overflow: visible;
    padding-bottom: 1px;
  }
  #productBrandChips .catalog-brand-chip,
  #productBrandChips .catalog-facet-more,
  .commercial-brand-track .catalog-brand-chip,
  .commercial-brand-track .catalog-facet-more { width: 100%; min-width: 0; min-height: 38px; height: 38px; padding: 5px 7px; }
  #productBrandChips .catalog-brand-chip.has-logo > img,
  .commercial-brand-track .catalog-brand-chip > img { max-width: 68px; height: 21px; }
  .commercial-reference-top { grid-template-columns: 176px minmax(0, 1fr) 142px; gap: 7px; padding: 7px; }
  .commercial-technical-heading,
  .commercial-budget-launch { min-height: 100px; }
  .commercial-brand-showcase { padding: 6px 7px; }
  .commercial-brand-showcase > div:first-child { padding-bottom: 4px; }
  .commercial-catalog-projection > .commercial-sticky-controls { margin-left: 183px; padding-block: 6px 5px; }
  .commercial-catalog-explorer { grid-template-columns: 176px minmax(0, 1fr); gap: 7px; padding: 7px; }
  .commercial-catalog-explorer > .catalog-category-nav { top: 8px; margin-top: -96px; padding: 7px; }
  .commercial-sticky-controls.has-history + .commercial-catalog-explorer > .catalog-category-nav { margin-top: -143px; }
  .commercial-result-toolbar { min-height: 34px; }
}

img[src$="/ajax.png"],
img[src$="ajax.png"] { filter: grayscale(1) invert(1) !important; opacity: .72 !important; }
.catalog-brand-chip.active img[src$="/ajax.png"],
.catalog-brand-chip.active img[src$="ajax.png"] { opacity: 1 !important; }

@media (max-width: 1024px) {
  .commercial-catalog-explorer > .catalog-category-nav { margin-top: 0; }
}

/* Commercial list v7: saved quotes, source confidence and installer-first mobile. */
.commercial-quotes-launch { display: inline-flex; align-items: center; gap: 6px; }
.commercial-quotes-launch b { display: grid; min-width: 19px; height: 19px; place-items: center; padding-inline: 4px; border-radius: 99px; background: var(--primary-soft); color: var(--primary-deep); font-size: 8px; }
.commercial-source-confidence { display: flex; min-height: 38px; align-items: center; gap: 8px; padding: 5px 8px; border-bottom: 1px solid #e7e1ec; background: #fffaf0; }
.commercial-source-confidence > strong { color: #6c5428; font-size: 8px; letter-spacing: .05em; text-transform: uppercase; }
.commercial-source-confidence > span { display: grid; gap: 1px; padding: 4px 7px; border: 1px solid #e8dfc9; border-radius: 8px; background: #fff; }
.commercial-source-confidence > span b { font-size: 8px; }
.commercial-source-confidence > span small { color: #766d61; font-size: 7px; }
.commercial-source-confidence > span.success b::before { content: "● "; color: var(--success); }
.commercial-source-confidence > span.warning b::before { content: "● "; color: var(--warning); }
.commercial-source-confidence > button { margin-left: auto; border: 0; background: transparent; color: var(--primary-deep); font-size: 8px; font-weight: 800; cursor: pointer; }
.commercial-quote-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 14px; }
.commercial-cart-heading-actions { display: flex; align-items: center; gap: 6px; }
.commercial-cart-heading-actions > button:first-child:not(:last-child) { min-height: 32px; padding: 5px 9px; border: 1px solid #ded8e8; border-radius: 8px; background: #fff; color: var(--primary-deep); font-size: 9px; font-weight: 800; cursor: pointer; }
.commercial-cart-heading-actions > [data-close-commercial-cart] { display: grid; width: 36px; height: 36px; place-items: center; border: 0; border-radius: 50%; background: #f0f2f6; color: #4f5766; font-size: 22px; cursor: pointer; }
.commercial-quote-fields label { display: grid; gap: 4px; color: #686f7d; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.commercial-quote-fields input { width: 100%; min-width: 0; min-height: 37px; padding: 7px 9px; border: 1px solid #dfe2e8; border-radius: 9px; background: #fff; color: var(--ink); font: inherit; font-size: 10px; text-transform: none; }
.commercial-no-reservation { display: block; margin-top: 7px; color: #7a7281; font-size: 8px; text-align: center; }
.commercial-saved-quotes { display: grid; gap: 5px; margin-top: 18px; padding-top: 13px; border-top: 1px solid #e7e9ee; }
.commercial-saved-quotes > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.commercial-saved-quotes > div strong { font-size: 10px; }
.commercial-saved-quotes > div small { color: var(--muted); font-size: 8px; }
.commercial-saved-quotes > button { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 42px; padding: 7px 8px; border: 1px solid #e2ddea; border-radius: 9px; background: #fff; color: var(--ink); text-align: left; cursor: pointer; }
.commercial-saved-quotes > button:hover { border-color: #c9bdf0; background: #faf8ff; }
.commercial-saved-quotes > button span { display: grid; min-width: 0; gap: 2px; overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.commercial-saved-quotes > button span b { font-size: 9px; }
.commercial-saved-quotes > button > small { color: var(--muted); font-size: 7px; white-space: nowrap; }

@media (max-width: 700px) {
  .app-shell.price-list-detail-active .topbar { display: none; }
  .app-shell.price-list-detail-active .content-area { padding: 0 5px calc(86px + env(safe-area-inset-bottom)); }
  .price-list-explorer-bar { position: sticky; z-index: 12; top: 0; min-height: 40px; padding: 3px 2px; background: rgba(250,248,243,.97); backdrop-filter: blur(14px); }
  .price-list-explorer-title > strong { font-size: 13px; }
  .price-list-explorer-bar .commercial-quotes-launch { display: inline-flex !important; min-width: 38px; padding-inline: 7px; font-size: 0; }
  .price-list-explorer-bar .commercial-quotes-launch::before { content: "▤"; font-size: 15px; }
  .price-list-explorer-bar .commercial-quotes-launch b { font-size: 7px; }
  .commercial-reference-top { grid-template-columns: minmax(0, 1fr) 91px; gap: 5px; padding: 5px; }
  .commercial-brand-showcase { min-height: 77px; padding: 5px; }
  .commercial-brand-showcase > div:first-child { display: flex; gap: 5px; padding: 0 1px 3px; }
  .commercial-brand-showcase > div:first-child > span { font-size: 8px; }
  .commercial-brand-showcase > div:first-child > small { display: none; }
  .commercial-brand-track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; max-height: 55px; overflow: hidden; padding: 0; }
  .commercial-brand-track .catalog-brand-chip,
  .commercial-brand-track .catalog-facet-more { width: 100%; min-width: 0; min-height: 25px; height: 25px; padding: 2px 4px; border-radius: 6px; }
  .commercial-brand-track .catalog-brand-chip:nth-child(n+9),
  .commercial-brand-track .catalog-facet-more:nth-child(n+9) { display: none; }
  .commercial-brand-track .catalog-brand-chip > img { max-width: 47px; height: 15px; }
  .commercial-brand-track .catalog-brand-chip:not(.has-logo) > span { font-size: 7px; }
  .commercial-brand-track .catalog-brand-chip > small { right: 2px; bottom: 1px; min-width: 12px; font-size: 5px; }
  .commercial-budget-launch { min-height: 77px; grid-template-columns: 1fr; align-content: center; gap: 1px; padding: 5px; border-radius: 10px; }
  .commercial-budget-launch > span { font-size: 6px; }
  .commercial-budget-launch > strong { font-size: 10px; }
  .commercial-budget-launch > small { grid-column: auto; margin: 2px 0 0; font-size: 6px; line-height: 1.2; }
  .commercial-catalog-projection > .commercial-sticky-controls { position: sticky; z-index: 10; top: 40px; margin-left: 0; padding: 5px; border-left: 0; }
  .commercial-sticky-controls .catalog-filter-bar { grid-template-columns: minmax(0, 1fr) auto auto; gap: 4px; }
  .commercial-sticky-controls .catalog-filter-bar .search-box { grid-column: auto; }
  .commercial-sticky-controls .search-box input { min-height: 34px; padding-inline: 30px 7px; font-size: 11px; }
  .commercial-sticky-controls .catalog-filter-details summary,
  .commercial-sticky-controls .catalog-clear-button { min-width: 36px; min-height: 34px; padding: 5px 7px; font-size: 0; }
  .commercial-sticky-controls .catalog-filter-details summary span { font-size: 0; }
  .commercial-sticky-controls .catalog-filter-details summary span::after { content: "☷"; font-size: 14px; }
  .commercial-sticky-controls .catalog-clear-button::after { content: "×"; font-size: 17px; }
  .commercial-sticky-controls .catalog-search-history { display: none; }
  .commercial-sticky-controls .catalog-quick-filters { margin-top: 3px; }
  .commercial-sticky-controls .catalog-quick-filters button { min-height: 27px; padding: 4px 7px; font-size: 7px; }
  .commercial-catalog-explorer { padding: 4px; }
  .commercial-result-toolbar { min-height: 31px; padding: 3px 4px; }
  .commercial-list-layout { padding: 4px; }
  .price-list-result .commercial-list-card { display: grid; grid-template-columns: 88px minmax(0, 1fr); contain-intrinsic-size: 310px 360px; }
  .price-list-result .commercial-list-card .purchase-card__image,
  .price-list-result.density-detailed .commercial-list-card .purchase-card__image { width: 88px !important; height: 104px; min-height: 104px !important; max-height: 104px; grid-column: 1; grid-row: 1; padding: 5px; border-right: 1px solid #eeeaf3; border-bottom: 0; }
  .price-list-result .commercial-list-card .purchase-card__image img { max-height: 78px; }
  .price-list-result .commercial-list-card .commercial-tax-strip { grid-column: 1; grid-row: 2; min-height: 18px; align-self: start; padding: 4px 3px; border-right: 1px solid #eeeaf3; font-size: 5px; text-align: center; }
  .price-list-result .commercial-list-card .purchase-card__body { grid-column: 2; grid-row: 1 / span 2; gap: 4px; padding: 6px; }
  .price-list-result .commercial-list-card .purchase-card__identity { min-height: 38px; }
  .price-list-result .commercial-list-card .catalog-card-title-button { min-height: 31px; font-size: 10px; }
  .price-list-result .commercial-list-card .purchase-card__description,
  .price-list-result .commercial-list-card .purchase-card__specs { display: none; }
  .price-list-result .commercial-list-card .commercial-levels-heading { padding-top: 2px; }
  .price-list-result .commercial-list-card .commercial-level-row { min-height: 38px; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 4px; padding: 3px 5px 3px 3px; }
  .price-list-result .commercial-list-card .commercial-level-action { padding: 2px 3px; }
  .price-list-result .commercial-list-card .commercial-level-action > em { font-size: 6px; }
  .price-list-result .commercial-list-card .commercial-level-action > small { font-size: 5px; }
  .price-list-result .commercial-list-card .commercial-level-copy > strong { font-size: 8px; }
  .price-list-result .commercial-list-card .commercial-level-copy > small { font-size: 5px; }
  .price-list-result .commercial-list-card .commercial-level-row > b { font-size: 9px; }
  .commercial-stock-strip { grid-column: 1 / -1; }
  .commercial-stock-strip > span { padding: 5px 6px; }
  .commercial-stock-strip strong { font-size: 6px; }
  .commercial-source-confidence { overflow-x: auto; gap: 5px; padding: 4px 5px; }
  .commercial-source-confidence > strong { display: none; }
  .commercial-source-confidence > span { flex: 0 0 auto; }
  .commercial-source-confidence > button { flex: 0 0 auto; }
  .commercial-cart { z-index: 80; max-height: calc(92vh - env(safe-area-inset-bottom)); padding: 15px 13px calc(16px + env(safe-area-inset-bottom)); border-radius: 17px 17px 0 0; }
  .commercial-cart-backdrop { z-index: 79; }
  .commercial-quote-fields { grid-template-columns: 1fr; }
  .commercial-cart-item { grid-template-columns: minmax(0, 1fr) 50px 24px; }
  .commercial-cart-item > span { grid-column: 1 / 3; grid-row: 2; }
  .commercial-cart-item > button { grid-column: 3; grid-row: 1 / 3; }
  .commercial-saved-quotes > button { grid-template-columns: 1fr; gap: 3px; }
}

.commercial-quote-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.commercial-quote-fields label small { color: var(--muted); font-size: 7px; font-weight: 500; text-transform: none; }
.commercial-cart-total { grid-template-columns: 1fr auto; gap: 4px 10px; }
.commercial-cart-total small { grid-column: 1 / -1; }
.commercial-quote-document-fields { margin-top: 9px; border: 1px solid #e3dee8; border-radius: 10px; background: #faf9fc; }
.commercial-quote-document-fields summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; cursor: pointer; list-style: none; }
.commercial-quote-document-fields summary::-webkit-details-marker { display: none; }
.commercial-quote-document-fields summary span { color: #5d526c; font-size: 9px; font-weight: 850; }
.commercial-quote-document-fields summary small { color: var(--muted); font-size: 7px; }
.commercial-quote-document-fields[open] summary { border-bottom: 1px solid #e8e3ec; }
.commercial-quote-document-fields > div { display: grid; padding: 9px; grid-template-columns: 1fr 1fr; gap: 8px; }
.commercial-quote-document-fields label { display: grid; gap: 4px; color: #686f7d; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.commercial-quote-document-fields label.is-wide { grid-column: 1 / -1; }
.commercial-quote-document-fields input,
.commercial-quote-document-fields textarea { width: 100%; min-width: 0; padding: 7px 9px; border: 1px solid #dfe2e8; border-radius: 8px; color: var(--ink); background: #fff; font: inherit; font-size: 10px; line-height: 1.4; text-transform: none; resize: vertical; }
.commercial-cart-item { grid-template-columns: minmax(0, 1fr) 58px 92px 24px; }
.commercial-cart-quantity { display: grid; gap: 3px; color: var(--muted); font-size: 7px; }
.commercial-cart-quantity input { width: 58px; }
.commercial-cart-line-price { display: grid; justify-items: end; gap: 3px; }
.commercial-cart-line-price small { color: var(--muted); font-size: 7px; font-weight: 600; }
.commercial-cart-line-price strong { font-size: 9px; }

@media (max-width: 700px) {
  .commercial-quote-fields { grid-template-columns: 1fr; }
  .commercial-quote-document-fields > div { grid-template-columns: 1fr; }
  .commercial-quote-document-fields label.is-wide { grid-column: auto; }
  .commercial-cart-item { grid-template-columns: minmax(0, 1fr) 58px 24px; }
  .commercial-cart-line-price { grid-column: 1 / 3; justify-items: start; }
}