/* Marketplace owner: public catalogue, seller workspace and structural utilities. */
.mx-commerce {
  --ink: var(--bx-text); --muted: var(--bx-muted); --gold: var(--bx-gold2);
  --line: var(--bx-line); --cream: var(--bx-bg); --panel: var(--bx-panel);
  margin: 0; background: var(--bx-bg); color: var(--bx-text); font: 400 16px/1.6 var(--bx-ui-font);
}
.mx-commerce * { box-sizing: border-box; }
.mx-commerce a { color: inherit; text-underline-offset: 4px; }
.mx-commerce :is(button,input,textarea,select) { font: inherit; }
.mx-commerce :is(a,button,input,select,textarea):focus-visible { outline: 3px solid var(--bx-focus); outline-offset: 3px; }
.mx-wrap { width: 100%; max-width: none; margin: 0; padding: var(--bx-space-4) var(--bx-container-padding) var(--bx-space-5); }
.mx-button, .mx-form button, .mx-search button, .mx-table button, .mx-actions button {
  display: inline-flex; justify-content: center; align-items: center; gap: var(--bx-space-1);
  min-height: var(--bx-control-height); padding: var(--bx-space-1) var(--bx-space-2);
  border: 1px solid transparent; border-radius: var(--bx-radius-sm); background: var(--bx-primary); color: var(--bx-primary-text);
  text-decoration: none; cursor: pointer; font-size: .875rem; font-weight: 600;
}
.mx-button:hover, .mx-form button:hover, .mx-search button:hover { background: var(--bx-primary-hover); }
.mx-button:active, .mx-form button:active, .mx-search button:active { filter: brightness(.94); }
.mx-commerce .mx-secondary { background: var(--bx-panel); color: var(--bx-text); border-color: var(--bx-control-line); }
.mx-commerce .mx-secondary:hover { background: var(--bx-panel2); }
.mx-commerce button:disabled { background: var(--bx-disabled-bg); color: var(--bx-disabled-text); border-color: var(--bx-line); opacity: 1; cursor: not-allowed; }
.mx-hero { display: flex; justify-content: space-between; align-items: center; gap: var(--bx-space-4); margin-bottom: var(--bx-space-4); padding: var(--bx-space-5); border: 1px solid var(--bx-line); border-radius: var(--bx-radius-md); background: var(--bx-primary); color: var(--bx-primary-text); }
.mx-hero h1 { font: 600 clamp(32px,4.3vw,52px)/1.13 var(--bx-display-font); letter-spacing: -.025em; margin: var(--bx-space-2) 0; }
.mx-hero p { max-width: 640px; color: var(--bx-primary-text); line-height: 1.65; }
.mx-eyebrow { font-size: .75rem; letter-spacing: .14em; font-weight: 700; }
.mx-hero .mx-eyebrow { color: var(--bx-gold); }
.mx-hero .mx-secondary { background: var(--bx-panel); color: var(--bx-text); }
.mx-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--bx-space-3); }
.mx-card { background: var(--bx-panel); border: 1px solid var(--bx-line); border-radius: var(--bx-radius-md); padding: var(--bx-space-3); min-width: 0; }
.mx-product { padding: 0; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow 160ms ease, border-color 160ms ease; }
.mx-product:hover { box-shadow: var(--bx-shadow); border-color: var(--bx-control-line); }
.mx-product-photo { display: block; height: 250px; background: var(--bx-panel2); padding: var(--bx-space-3); }
.mx-product-photo img { width: 100%; height: 100%; object-fit: contain; }
.mx-product > img { width: 100%; height: 220px; object-fit: contain; background: transparent; padding: 0; }
.mx-product > div { padding: var(--bx-space-3); display: flex; flex-direction: column; flex: 1; }
.mx-product h2 { font-size: 1.125rem; line-height: 1.4; margin: var(--bx-space-2) 0; overflow-wrap: anywhere; }
.mx-product h2 a { text-decoration: none; }
.mx-product .mx-button { margin-top: auto; }
.mx-price { font-weight: 700; font-size: 1.6875rem; display: block; margin: var(--bx-space-1) 0; }
.mx-product .mx-price { margin-top: auto; }
.mx-muted { color: var(--bx-muted); font-size: .875rem; }
.mx-badge, .mx-sponsored-label, .mx-discount-label { display: inline-flex; align-self: start; gap: var(--bx-space-1); font-size: .75rem; padding: 4px var(--bx-space-1); background: var(--bx-panel2); border-radius: var(--bx-radius-sm); color: var(--bx-gold2); }
.mx-form { display: grid; gap: var(--bx-space-2); }
.mx-form label { display: grid; gap: var(--bx-space-1); font-weight: 600; font-size: .875rem; }
.mx-form input, .mx-form textarea, .mx-form select, .mx-search input { width: 100%; min-width: 0; min-height: var(--bx-control-height); border: 1px solid var(--bx-control-line); background: var(--bx-panel); border-radius: var(--bx-radius-sm); padding: var(--bx-space-1) var(--bx-space-2); color: var(--bx-text); font-weight: 400; }
.mx-form :is(input,textarea)::placeholder, .mx-search input::placeholder { color: var(--bx-muted); opacity: 1; }
.mx-form textarea { min-height: 96px; }
.mx-form :is(input,select,textarea):disabled { background: var(--bx-disabled-bg); color: var(--bx-disabled-text); }
.mx-columns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--bx-space-3); align-items: start; }
.mx-notice { padding: var(--bx-space-2); border: 1px solid var(--bx-line); background: var(--bx-warning-bg); color: var(--bx-warning); border-radius: var(--bx-radius-sm); margin-bottom: var(--bx-space-3); }
.mx-table-wrap { overflow: auto; }
.mx-table { width: 100%; border-collapse: collapse; text-align: left; }
.mx-table th { font-size: .75rem; color: var(--bx-muted); text-transform: uppercase; letter-spacing: .04em; }
.mx-table th, .mx-table td { padding: var(--bx-space-2); border-bottom: 1px solid var(--bx-line); }
.mx-table button { font-size: .75rem; }
.mx-actions { display: flex; gap: var(--bx-space-1); flex-wrap: wrap; }
.mx-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--bx-space-2); margin: var(--bx-space-3) 0; }
.mx-stats strong { font-size: 1.6875rem; display: block; }
.mx-footer { padding: var(--bx-space-3) var(--bx-container-padding); border-top: 1px solid var(--bx-line); font-size: .875rem; display: flex; gap: var(--bx-space-3); flex-wrap: wrap; background: var(--bx-panel); }
.mx-footer a { display: inline-flex; align-items: center; min-height: var(--bx-control-height); }
.mx-search { display: flex; gap: var(--bx-space-1); margin: var(--bx-space-3) 0; }
.mx-search input { flex: 1; }
.mx-empty { text-align: center; padding: var(--bx-space-5); grid-column: 1 / -1; }
.mx-detail-image { width: 100%; max-height: 460px; object-fit: contain; background: transparent; padding: 0; }
.mx-photo { background: transparent; border: 0; box-shadow: none; padding: 0; }
.mx-summary { display: flex; justify-content: space-between; padding: var(--bx-space-1) 0; gap: var(--bx-space-3); }
.mx-auth { max-width: 950px; margin: var(--bx-space-3) auto; }
.mx-auth h2 { font: 600 1.875rem var(--bx-display-font); }
.mx-tabs { display: flex; gap: var(--bx-space-1); margin: var(--bx-space-3) 0; flex-wrap: wrap; }
.mx-tabs a { display: inline-flex; align-items: center; min-height: var(--bx-control-height); background: var(--bx-panel); border: 1px solid var(--bx-control-line); padding: var(--bx-space-1) var(--bx-space-2); border-radius: var(--bx-radius-sm); text-decoration: none; }
.mx-variants { border: 1px solid var(--bx-line); border-radius: var(--bx-radius-md); padding: var(--bx-space-2); }
.mx-variants legend { font-weight: 700; padding: 0 var(--bx-space-1); }
.mx-seller { border-top: 1px solid var(--bx-line); padding-top: var(--bx-space-3); margin-top: var(--bx-space-3); }
.mx-promoted { margin: var(--bx-space-4) 0 var(--bx-space-5); }
.mx-promoted-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--bx-space-2); margin-bottom: var(--bx-space-2); }
.mx-promoted-heading h2 { font: 600 1.625rem var(--bx-display-font); letter-spacing: -.02em; margin: 0; }
.mx-promoted-heading p { font-size: .875rem; color: var(--bx-muted); margin: 4px 0 0; }
.mx-original-price { font-size: .9375rem; color: var(--bx-muted); text-decoration: line-through; margin: 4px 0; }
.mx-price-extras { display: flex; gap: var(--bx-space-1); align-items: center; flex-wrap: wrap; margin-bottom: var(--bx-space-1); }
.mx-list-seller { display: inline-flex; gap: var(--bx-space-1); align-items: center; min-height: var(--bx-control-height); font-size: .8125rem; text-decoration: none; }
.mx-list-seller img { width: 32px; height: 32px; }
.mx-commerce [hidden] { display: none; }
@media (max-width: 1000px) { .mx-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 760px) {
  .mx-wrap { padding-block: var(--bx-space-3) var(--bx-space-5); }
  .mx-hero { padding: var(--bx-space-3); display: block; }
  .mx-hero h1 { font-size: 2.125rem; }
  .mx-hero .mx-button { margin-top: var(--bx-space-2); }
  .mx-columns { grid-template-columns: 1fr; }
  .mx-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--bx-space-2); }
  .mx-product-photo { height: 170px; padding: var(--bx-space-2); }
  .mx-product > div { padding: var(--bx-space-2); }
  .mx-product h2 { font-size: 1rem; }
  .mx-product .mx-button { padding-inline: var(--bx-space-1); }
  .mx-stats { gap: var(--bx-space-1); }
  .mx-stats .mx-card { padding: var(--bx-space-2); }
}
@media (max-width: 390px) { .mx-product > div { padding: var(--bx-space-1); } }
@media (prefers-reduced-motion: reduce) { .mx-product { transition: none; } }
@media print { .brox-client-header,.mx-footer,button,.mx-tabs { display: none; } .mx-commerce { background: white; } .mx-wrap { padding: 0; } }