/* Boxyard — pages that did not exist in the Shopify theme: login, your order, checkout, the invoice page, account and admin.
   Same tokens, same type, same square edges as the stockroom. Prefix: bx- */

.by-concept-theme { --bx-rule: rgba(63, 84, 76, .26); }
.by-concept-theme h1, .by-concept-theme h2, .by-concept-theme h3 { text-wrap: balance; }

/* Apply panel (replaces the Shopify Forms embed, same frame) */
.by-apply-panel--form { padding: clamp(20px, 2.5vw, 32px); border: 1px solid var(--by-rule); border-top: 3px solid var(--by-ink); background: #fff; min-width: 0; }
.by-apply-panel--form .by-field input, .by-apply-panel--form .by-field select, .by-apply-panel--form .by-field textarea { border-radius: 0; }
.by-apply-lead { margin: 0 0 20px; }
.by-apply-intro h2 { letter-spacing: -.035em; }
.by-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.by-concept-theme .by-btn { height: auto; min-height: 46px; }
.by-concept-theme .byc-cart-summary { margin: 14px 0 0; font: 400 13px/1.6 'Space Mono', monospace; color: #3F544C; }
.by-toast { position: fixed; z-index: 80; left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom)); margin: 0 auto; max-width: 440px; padding: 12px 14px; background: #12211D; color: #EEF2EE; font: 600 14px/1.4 'Public Sans', sans-serif; box-shadow: 0 8px 24px rgba(18, 33, 29, .28); }
.by-toast[hidden] { display: none; }
.by-toast--error { background: #8A352F; }
@media (max-width: 700px) { .by-toast { bottom: calc(12px + env(safe-area-inset-bottom)); font-size: 13px; } }
.by-concept-theme .byc-cart-summary strong { color: #12211D; }
.by-status h1, .by-status p { margin-top: 0; }
.by-footer p { margin: 0; }

/* Page frame */
.bx-page { padding-block: 44px 72px; font-family: 'Public Sans', sans-serif; color: #12211D; }
.bx-narrow { max-width: 760px; }
.by-concept-theme .bx-h1 { font: 800 clamp(34px, 4.4vw, 56px)/1.03 'Bricolage Grotesque', sans-serif; letter-spacing: -.035em; margin: 14px 0 18px; }
.by-concept-theme .bx-h2 { font: 600 24px/1.2 'Bricolage Grotesque', sans-serif; letter-spacing: -.025em; margin: 40px 0 16px; }
.by-concept-theme .bx-h3 { font: 600 20px/1.2 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; margin: 0 0 6px; }
.bx-rule { padding-bottom: 12px; border-bottom: 1px solid #12211D; }
.bx-lede { font-size: 16px; line-height: 1.6; color: #3F544C; max-width: 60ch; margin: 0 0 24px; }
.bx-page p { margin: 0 0 14px; }
.bx-page a { text-underline-offset: 4px; }
.bx-soft { color: #3F544C; }
.bx-mono { font-family: 'Space Mono', monospace; }
.bx-pre { white-space: pre-line; }
.bx-warn { color: #B8342A; font-weight: 600; font-size: 13px; }
.bx-mono-note { font: 400 11px/1.7 'Space Mono', monospace; color: #3F544C; margin: 6px 0 0; }
.bx-min-order { font: 600 13px/1.45 'Public Sans', sans-serif; color: #12211D; margin: 12px 0 0; }
.bx-block { width: 100%; }
.bx-gap { margin-bottom: 20px; }
.bx-linkbtn { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; color: inherit; }
.bx-linkbtn:focus-visible, .bx-page a:focus-visible, .bx-page button:focus-visible, .bx-page input:focus-visible, .bx-page select:focus-visible, .bx-page textarea:focus-visible { outline: 2px solid #12211D; outline-offset: 3px; }
.bx-danger { border-color: #B8342A; color: #B8342A; }
.bx-danger:hover { background: #B8342A; border-color: #B8342A; color: #EEF2EE; }

.bx-flash { margin: 18px 0 0; padding: 14px 18px; background: #EEF2EE; border-left: 3px solid #12211D; font: 400 15px/1.5 'Public Sans', sans-serif; color: #12211D; }
.bx-flash--error { border-left-color: #B8342A; }

/* Two-column working layout */
.bx-two { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.bx-two--invoice { grid-template-columns: minmax(0, 1fr) 320px; }
.bx-panel { border: 1px solid #12211D; padding: 24px; background: #DDE6DE; }
.bx-panel + .bx-panel { margin-top: 20px; }
aside > .by-hint { margin-top: 18px; }
.bx-panel .byc-eyebrow { margin: 0 0 8px; color: #3F544C; }
.bx-panel .byc-eyebrow:not(:first-child) { margin-top: 20px; }
.bx-addr { font-size: 14px; line-height: 1.6; margin: 0; }
.bx-panel .byc-btn, .bx-panel .by-btn { margin-top: 18px; }
.bx-panel .by-hint { margin-top: 14px; }

/* Forms */
.bx-form { display: grid; gap: 18px; max-width: 460px; margin-bottom: 20px; }
.bx-form--wide { max-width: 860px; }
.bx-form--row { max-width: none; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; }
.bx-form--row .by-check, .bx-form--row button { grid-column: 1 / -1; justify-self: start; }
.bx-form .by-form, .bx-stack .by-form { margin-bottom: 4px; }
.bx-stack { display: grid; gap: 14px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--bx-rule); }
.bx-stack:first-of-type { border-top: 0; padding-top: 0; }
.bx-page .by-field input[type=text], .bx-page .by-field input[type=email], .bx-page .by-field input[type=password], .bx-page .by-field input[type=tel], .bx-page .by-field input[type=number], .bx-page .by-field select, .bx-page .by-field textarea {
  width: 100%; min-height: 46px; border: 1.5px solid #3F544C; border-radius: 0; background: #EEF2EE; padding: 0 12px; font: inherit; color: #12211D;
}
.bx-page .by-field textarea { padding: 10px 12px; min-height: 84px; }
.bx-page .by-field label { margin-bottom: 6px; }
.bx-page .by-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.bx-code { font: 700 26px/1 'Space Mono', monospace !important; letter-spacing: .3em; max-width: 240px; }
.bx-inline { margin: 0; }
.bx-inlineform { display: flex; gap: 8px; align-items: center; }
.bx-inlineform input { width: 110px; min-height: 38px; border: 1.5px solid #3F544C; background: #EEF2EE; padding: 0 10px; font: 400 13px 'Space Mono', monospace; }

/* Order lines */
.bx-lines { border-top: 1px solid #12211D; }
.bx-line { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto 96px; gap: 16px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--bx-rule); }
.bx-lines--static { border-top: 0; }
.bx-lines--static .bx-line { grid-template-columns: 54px minmax(0, 1fr) 96px; }
.by-concept-theme .bx-line h3 { font: 600 18px/1.25 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; margin: 0; overflow-wrap: anywhere; }
.bx-line .byc-sku { font: 400 11px/1.6 'Space Mono', monospace; color: #3F544C; margin: 5px 0 0; }
.bx-line__qty input { width: 78px; min-height: 42px; border: 1px solid #12211D; background: #EEF2EE; padding: 8px; font: inherit; color: #12211D; border-radius: 0; }
.bx-line__total { text-align: right; font: 600 16px/1.2 'Public Sans', sans-serif; font-variant-numeric: tabular-nums; }
.bx-line--off { opacity: .7; }
.bx-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 18px; }

/* Totals */
.bx-totals { margin: 0; display: grid; gap: 8px; font-size: 14px; }
.bx-totals > div { display: flex; justify-content: space-between; gap: 16px; }
.bx-totals dt { color: #3F544C; min-width: 0; }
.bx-totals dd { margin: 0; font-variant-numeric: tabular-nums; }
.bx-totals__total { margin-top: 6px; padding-top: 12px; border-top: 1px solid #12211D; align-items: baseline; }
.bx-totals__total dt { font: 600 18px/1.3 'Bricolage Grotesque', sans-serif; color: #12211D; }
.bx-totals__total dd { font: 800 22px/1.3 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; white-space: nowrap; }
.bx-totals--wide { margin-top: 16px; }
.bx-mini { list-style: none; margin: 0 0 18px; padding: 0 0 14px; border-bottom: 1px solid var(--bx-rule); display: grid; gap: 8px; font-size: 13px; line-height: 1.45; }
.bx-mini li { display: flex; justify-content: space-between; gap: 14px; }
.bx-mini b { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Payment choice */
.bx-pay { border: 0; margin: 0; padding: 0; display: grid; gap: 10px; }
.bx-pay__opt { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 14px; align-items: start; padding: 18px; border: 1px solid var(--bx-rule); background: #EEF2EE; cursor: pointer; }
.bx-pay__opt:has(input:checked) { border-color: #12211D; box-shadow: inset 0 0 0 1px #12211D; }
.bx-pay__opt input { accent-color: #12211D; width: 18px; height: 18px; margin: 3px 0 0; }
.bx-pay__opt b { display: block; font: 600 18px/1.2 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; }
.bx-pay__opt small { display: block; font-size: 13px; line-height: 1.55; color: #3F544C; margin-top: 4px; }
.bx-cancel .by-note { margin: 0; }
.bx-reason { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; min-inline-size: 0; }
.bx-reason > legend { grid-column: 1 / -1; padding: 0; margin: 0 0 2px; font: 600 15px/1.3 'Public Sans', sans-serif; }
.bx-cancel .bx-pay__opt { padding: 12px 14px; }
.bx-cancel .bx-pay__opt b { font-size: 16px; }
@media (max-width: 420px) {
  .bx-cancel .bx-pay__opt { padding: 10px 12px; gap: 10px; }
  .bx-cancel .bx-pay__opt b { font-size: 15px; }
}

/* Invoice page */
.bx-invoice__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.bx-invoice__head p { margin: 0; }
.bx-tape { display: flex; align-items: center; gap: 12px; margin: 16px 0 28px !important; padding: 14px 20px; background: #A8823A; background-image: repeating-linear-gradient(115deg, transparent 0, transparent 7px, rgba(18, 33, 29, .055) 7px, rgba(18, 33, 29, .055) 8px); color: #12211D; font: 400 12px/1.5 'Space Mono', monospace; letter-spacing: .075em; text-transform: uppercase; }
.bx-tape svg { flex: none; }
.bx-tape--muted { background: #EEF2EE; background-image: none; border: 1px solid var(--bx-rule); color: #3F544C; }
.bx-due { background: #1E3830; color: #EEF2EE; padding: 24px 26px; }
.bx-due__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bx-due p { margin: 0; }
.bx-due__k { font: 400 11px/1.5 'Space Mono', monospace; letter-spacing: .075em; text-transform: uppercase; margin-bottom: 8px !important; }
.bx-due__amount { font: 800 clamp(40px, 5vw, 56px)/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.bx-due__ref { font: 800 28px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; margin-bottom: 16px !important; }
.bx-due__by { font: 600 16px/1.4 'Public Sans', sans-serif; }
.bx-due__note { margin-top: 18px !important; padding-top: 14px; border-top: 1px dashed rgba(221, 230, 222, .4); font: 400 12px/1.7 'Space Mono', monospace; }
.bx-paycard { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 16px; padding: 18px 20px; border: 1px solid #12211D; background: #EEF2EE; }
.bx-paycard p { margin: 0; }
.bx-kv { margin: 0 0 8px; }
.bx-kv > div { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--bx-rule); font-size: 14px; line-height: 1.6; }
.bx-kv dt { font-weight: 600; }
.bx-kv dd { margin: 0; overflow-wrap: anywhere; }
.bx-kv dd.bx-mono { font-size: 15px; }
.bx-bank { margin: 8px 0 8px; }
.bx-bank__lead { margin: 0 0 8px !important; }
.bx-bank__group + .bx-bank__group { margin-top: 22px; }
.bx-bank h2, .bx-bank h3 { margin-bottom: 6px; }
.bx-bank .bx-kv, .bx-bank .rs-facts { margin-top: 4px; }
.bx-bank .bx-mono { font-family: 'Space Mono', monospace; font-size: 15px; letter-spacing: 0; text-transform: none; user-select: all; }
.bx-copyline { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.bx-copy { flex: none; border: 1px solid #12211D; background: #fff; color: #12211D; font: 600 12px/1 'Public Sans', sans-serif; padding: 7px 10px; cursor: pointer; border-radius: 0; }
.bx-copy:hover { background: #DDE6DE; }
.bx-addrblock { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: start; }
.bx-addrblock > :not(.bx-copy--addr) { grid-column: 1; min-width: 0; }
.bx-copy--addr {
  grid-column: 2; grid-row: 1 / span 4; align-self: start; justify-self: end;
  min-height: 44px; min-width: 44px; padding: 0 16px;
  font: 600 14px/1 'Public Sans', sans-serif; touch-action: manipulation;
}
@media (max-width: 700px) {
  .bx-copy--addr { min-height: 44px; padding: 0 18px; }
}
.bx-cinnabar { margin: 22px 0 0 !important; padding: 4px 0 4px 14px; border-left: 3px solid #B8342A; font-size: 14px; line-height: 1.6; }
.bx-cinnabar span { color: #3F544C; }
.bx-legal { margin: 40px 0 0 !important; padding-top: 18px; border-top: 1px solid var(--bx-rule); font-size: 12px; line-height: 1.7; color: #3F544C; }

/* Tables, chips, admin */
.bx-table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
.bx-table th { text-align: left; font: 400 11px/1.5 'Space Mono', monospace; letter-spacing: .05em; text-transform: uppercase; color: #3F544C; padding: 10px 12px 10px 0; border-bottom: 1px solid #12211D; white-space: nowrap; }
.bx-table td { padding: 13px 12px 13px 0; border-bottom: 1px solid var(--bx-rule); vertical-align: top; }
.bx-table .bx-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; padding-right: 0; }
.bx-chip { display: inline-block; padding: 3px 8px; font: 400 11px/1.5 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .03em; border: 1px solid var(--bx-rule); white-space: nowrap; }
.bx-kind { display: inline-block; margin-left: 6px; padding: 0 6px; font: 400 10px/1.7 'Space Mono', monospace; letter-spacing: .04em; text-transform: uppercase; border: 1px solid currentColor; vertical-align: 2px; }
.bx-kind--pre { color: #8A5A12; }
.bx-chip--awaiting_payment, .bx-chip--app-new { background: #A8823A; border-color: #A8823A; color: #12211D; }
.bx-chip--paid { background: #12211D; border-color: #12211D; color: #EEF2EE; }
.bx-chip--dispatched, .bx-chip--app-approved { background: #EEF2EE; }
.bx-chip--cancelled, .bx-chip--app-declined { color: #3F544C; text-decoration: line-through; }
.bx-adminnav { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 26px; }
.bx-adminnav a, .bx-filter { display: inline-flex; align-items: center; min-height: 36px; padding: 7px 12px; border: 1px solid var(--bx-rule); font: 400 13px/1.5 'Public Sans', sans-serif; text-decoration: none; color: #12211D; }
@media (max-width: 700px) {
  .bx-adminnav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 8px; margin-inline: -20px; padding: 0 20px 10px; scrollbar-width: none; }
  .bx-adminnav a, .bx-filter { flex: none; min-height: 44px; padding: 10px 14px; }
}
.bx-adminnav a:hover, .bx-filter:hover { background: #EEF2EE; }
.bx-adminnav a[aria-current], .bx-filter[aria-current] { background: #12211D; border-color: #12211D; color: #EEF2EE; }
.bx-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #12211D; border-bottom: 1px solid var(--bx-rule); margin: 8px 0; }
.bx-stats a { display: block; padding: 20px 20px 20px 0; text-decoration: none; border-right: 1px solid var(--bx-rule); }
.bx-stats a + a { padding-left: 20px; }
.bx-stats a:last-child { border-right: 0; }
.bx-stats b { display: block; font: 800 44px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.bx-stats span { font: 400 11px/1.5 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .05em; color: #3F544C; }
.bx-timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; font-size: 13px; line-height: 1.5; }
.bx-timeline li > span:first-child, .bx-timeline li > span { display: block; font: 400 11px/1.5 'Space Mono', monospace; color: #3F544C; }
.bx-timeline form { margin-top: 2px; font-size: 12px; }
.bx-admin .by-note ul { margin: 8px 0 0; padding-left: 18px; }
.bx-prose .bx-kv { margin-bottom: 24px; }
.bx-guide { display: grid; gap: 8px; }
.bx-guide article { border-top: 1px solid var(--bx-rule); padding-top: 18px; }
.bx-guide h2 { font: 800 22px/1.15 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; margin: 0 0 8px; }
.bx-example { background: #1E3830; color: #EEF2EE; padding: 22px 18px 8px; margin-top: 12px; }
.bx-example .byc-eyebrow { color: #C4A46A; }
.bx-example h2, .bx-example p { color: #EEF2EE; }
.bx-example a { color: #EEF2EE; }
@media (min-width: 700px) {
  .bx-guide h2 { font-size: 28px; }
  .bx-example { padding: 28px 32px 12px; }
}

@media (max-width: 1150px) {
  .bx-two, .bx-two--invoice { grid-template-columns: minmax(0, 1fr) 300px; gap: 32px; }
}
@media (max-width: 940px) {
  .bx-two, .bx-two--invoice { grid-template-columns: 1fr; }
  .bx-two--admin > aside { order: -1; } /* the owner's actions before the invoice on a phone */
  .bx-form--row { grid-template-columns: 1fr; }
  .bx-table { display: block; overflow-x: auto; }
}
@media (max-width: 700px) {
  .bx-page { padding-block: 28px 48px; }
  .bx-line { grid-template-columns: 45px minmax(0, 1fr) auto; gap: 12px; }
  .bx-line .bx-line__total { grid-column: 2 / -1; text-align: left; }
  .bx-lines--static .bx-line { grid-template-columns: 45px minmax(0, 1fr); }
  .bx-due { padding: 20px; }
  .bx-due__grid { grid-template-columns: 1fr; gap: 18px; }
  .bx-kv > div { grid-template-columns: 1fr; gap: 2px; }
  .bx-stats { grid-template-columns: 1fr 1fr; }
  .bx-stats a { padding: 16px 12px 16px 0 !important; }
  .bx-stats a:nth-child(2) { border-right: 0; }
  .bx-stats a:nth-child(-n+2) { border-bottom: 1px solid var(--bx-rule); }
  .bx-paycard .byc-btn { width: 100%; }
  .by-concept-theme .by-apply .by-wrap { gap: 32px; }
}

/* The invoice prints as a clean document */
@media print {
  .byc-header, footer, .bx-noprint, .bx-flash, .by-skip { display: none !important; }
  .by-concept-theme, .by-concept-theme .page-wrapper, .by-concept-theme .content-for-layout { background: #fff !important; }
  .bx-page { padding: 0; }
  .bx-two, .bx-two--invoice { grid-template-columns: minmax(0, 1fr) 230px; gap: 24px; }
  .bx-due, .bx-tape { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .bx-panel { background: #fff; }
}

/* Tick-box labels sit beside their box */
.by-field label.by-check, label.by-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; margin-bottom: 0; }
.by-field label.by-check { margin-top: 10px; }

.bx-two > * { min-width: 0; }
.bx-inlineform { flex-wrap: wrap; }
.bx-inlineform .by-check { font-size: 12px; flex-basis: 100%; }

.bx-table--inputs input { width: 110px; min-height: 38px; border: 1.5px solid #3F544C; background: #EEF2EE; padding: 0 10px; font: inherit; border-radius: 0; }
.bx-table--inputs td { vertical-align: middle; }
.bx-table .bx-chip { margin-left: 4px; }

/* Trade: order by the box or by the case */
.byc-order-form select { min-height: 42px; border: 1px solid #12211D; background: #EEF2EE; color: #12211D; padding: 8px 10px; font: inherit; font-size: 13px; border-radius: 0; max-width: 150px; }
.byc-order-form select:focus-visible { outline: 2px solid #A8823A; outline-offset: 3px; }
.bx-line__qty { display: flex; flex-direction: column; gap: 4px; }
.bx-qtyunit { font: 400 10px/1.4 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .05em; color: #3F544C; }
.bx-mini small { font: 400 11px/1.5 'Space Mono', monospace; color: #3F544C; }
@media (max-width: 760px) { .byc-order-form select { flex: 1; max-width: none; } .byc-order-form:has(select) button { flex-basis: 100%; } }

/* ---------- Stock pages (built for a phone first) ---------- */
.bx-back { margin: 0 0 14px !important; font-size: 14px; }
.bx-stockline { margin: 14px 0 0 !important; font-size: 14px; }
.bx-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 8px 0 4px; }
.bx-tile { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 124px; padding: 18px; background: #12211D; color: #EEF2EE; text-decoration: none; }
.bx-tile:hover { background: #1E3830; }
.bx-tile b { font: 800 24px/1.05 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; }
.bx-tile span { font: 400 11px/1.5 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .05em; color: #DDE6DE; }
.bx-page a.bx-tile:focus-visible { outline: 2px solid #A8823A; outline-offset: 3px; }
.bx-stock .bx-actions { margin: 18px 0 0; }
.bx-stock .by-btn, .bx-stock .byc-btn { text-decoration: none; }
.bx-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bx-card { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 16px 18px; border: 1px solid #12211D; background: #EEF2EE; }
.bx-card > div { display: grid; gap: 2px; min-width: 0; flex: 1 1 240px; }
.bx-card b { font: 600 18px/1.25 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; }
.bx-card span { font-size: 13px; color: #3F544C; }
.bx-k { display: block; font: 400 10px/1.5 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .05em; color: #3F544C; }
.bx-chip--low { background: #B8342A; border-color: #B8342A; color: #EEF2EE; }

/* Product thumbnails on the stock pages: the photo on a glaze tile, the carton mark when there is none */
.bx-photo-pick { margin: 10px 0 0; display: grid; place-items: center; width: 160px; height: 160px; background: #DDE6DE; overflow: hidden; }
.bx-photo-pick img { width: 100%; height: 100%; object-fit: contain; }
.bx-photo-pick--hits { background: #12211D; }
.bx-thumb { flex: none; display: grid; place-items: center; width: 48px; height: 48px; background: #DDE6DE; overflow: hidden; }
.bx-thumb img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; padding: 3px; }
.bx-thumb svg { width: 50%; opacity: .45; }
.bx-thumb--sm { width: 32px; height: 32px; }
.bx-thumb--lg { width: 64px; height: 64px; }
.bx-cell-thumb { display: flex; align-items: center; gap: 10px; }
.bx-cell-thumb > span { min-width: 0; }

/* The two piles as one bar: website (deep), streams (gold), on the way (hatched) */
.bx-bar { display: flex; gap: 2px; height: 10px; width: 100%; }
.bx-bar i { display: block; height: 100%; min-width: 3px; }
.bx-bar__web { background: #1E3830; }
.bx-bar__str { background: #A8823A; }
.bx-bar__way { background: repeating-linear-gradient(45deg, #3F544C 0 2px, transparent 2px 6px); box-shadow: inset 0 0 0 1px #3F544C; }
.bx-bar--empty { height: 10px; background: repeating-linear-gradient(45deg, rgba(63, 84, 76, .18) 0 1px, transparent 1px 7px); width: 100%; }
.bx-bar--split { height: 8px; margin: 10px 0 2px; }
.bx-bar--split i { min-width: 0; }
.bx-legend { display: flex; gap: 18px; margin: 0 0 10px !important; font-size: 12px; color: #3F544C; }
.bx-legend span { display: inline-flex; align-items: center; gap: 7px; }
.bx-legend i, .bx-swatch { display: inline-block; width: 14px; height: 10px; flex: none; }
.bx-swatch { margin-right: 7px; vertical-align: -1px; }

/* The ledger: thumbnail, name and bar, then the figures */
.bx-stocklist { list-style: none; margin: 0; padding: 0; border-top: 1px solid #12211D; }
.bx-stockrow { display: grid; grid-template-columns: 48px minmax(0, 1fr) 420px; gap: 16px 18px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--bx-rule); font-size: 14px; }
.bx-stockrow__main { display: grid; gap: 8px; min-width: 0; }
.bx-stockrow__name { display: flex; align-items: baseline; gap: 4px 10px; flex-wrap: wrap; min-width: 0; }
.bx-stockrow__name b { font-weight: 600; overflow-wrap: anywhere; }
.bx-stockrow__name .bx-mono { font-size: 11px; color: #3F544C; }
.bx-stockrow__nums { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.bx-stockrow__nums > div { text-align: right; }
.bx-stockrow__nums > div > b { display: block; font-weight: 600; font-variant-numeric: tabular-nums; }
.bx-stockrow__nums .bx-k { display: block; }
.bx-stockrow--flag { box-shadow: inset 3px 0 0 #B8342A; padding-left: 12px; }

/* The summary figures at the top of the stock page */
.bx-stats--stock { margin: 8px 0 22px; }
.bx-stats--stock > div { padding: 20px 20px 20px 0; border-right: 1px solid var(--bx-rule); }
.bx-stats--stock > div + div { padding-left: 20px; }
.bx-stats--stock > div:last-child { border-right: 0; }
.bx-stat--warn b { color: #B8342A; }
.bx-tile__thumbs { display: flex; gap: 4px; }
.bx-tile__thumbs .bx-thumb { background: #EEF2EE; }
.bx-card__thumbs { display: flex; align-items: center; gap: 4px; flex: none; min-width: 172px; }
.bx-card__thumbs em { font: 400 12px 'Space Mono', monospace; font-style: normal; color: #3F544C; margin-left: 4px; }
.bx-now { text-align: right; }
.bx-now .bx-k { display: block; }
.bx-now b { font: 600 20px/1.2 'Public Sans', sans-serif; font-variant-numeric: tabular-nums; }

.bx-entries { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.bx-entry { padding: 16px 18px; border: 1px solid var(--bx-rule); background: #EEF2EE; }
.bx-entry--warn { border-color: #B8342A; box-shadow: inset 3px 0 0 #B8342A; }
.bx-entry--changed { border-color: #12211D; box-shadow: inset 3px 0 0 #A8823A; }
.bx-entry__title { display: grid; gap: 2px; margin: 0 0 4px !important; }
.bx-entry--thumbed { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 4px 16px; align-items: start; }
.bx-entry--thumbed .bx-thumb { grid-row: 1 / span 2; }
.bx-entry--thumbed .bx-bar--split, .bx-entry--thumbed .bx-entry__fields { grid-column: 2; }
.bx-entry__title b { font: 600 17px/1.25 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; overflow-wrap: anywhere; }
.bx-entry__title .bx-mono { font-size: 11px; color: #3F544C; }
.bx-entry__title .bx-warn { font-size: 12px; font-weight: 400; }
.bx-entry__from { margin: 0 0 12px !important; font-size: 13px; line-height: 1.5; color: #3F544C; overflow-wrap: anywhere; }
.bx-entry__fields { display: grid; grid-template-columns: minmax(0, 1fr) 120px; gap: 12px; align-items: end; }
.bx-entry__fields--three { grid-template-columns: 120px 120px minmax(0, 1fr); }
.bx-entry .by-field { margin: 0; }
.bx-entry .by-field input[type=number], .bx-stock .bx-qty input[type=number] { font: 600 18px/1 'Public Sans', sans-serif; font-variant-numeric: tabular-nums; background: #fff; }
.bx-stock .bx-qty { max-width: 160px; }
.bx-auto { align-self: end; padding-bottom: 10px; }
.bx-auto b { font: 600 18px/1.3 'Public Sans', sans-serif; font-variant-numeric: tabular-nums; }
.bx-auto b.bx-warn { font-size: 14px; }
.bx-entries--tight { gap: 0; border-top: 1px solid #12211D; }
.bx-entry--count { display: grid; grid-template-columns: 48px minmax(0, 1fr) 64px 120px; gap: 14px; align-items: center; padding: 12px 0; border: 0; border-bottom: 1px solid var(--bx-rule); background: none; }
.bx-entry--count.bx-entry--changed { box-shadow: inset 3px 0 0 #A8823A; padding-left: 12px; }
.bx-entry--count .bx-entry__title { margin: 0 !important; }
.bx-more { margin-top: 36px; padding-top: 16px; border-top: 1px solid var(--bx-rule); }
.bx-more summary { cursor: pointer; font-weight: 600; font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.bx-more[open] summary { margin-bottom: 16px; }
.bx-table--stock tfoot td { padding: 13px 12px 13px 0; border-top: 2px solid #12211D; font-weight: 600; }
.bx-table--stock tfoot .bx-num { padding-right: 0; }
.bx-table--stock tr.bx-off td { background: rgba(184, 52, 42, .07); }
.bx-stock .bx-form--wide textarea { min-height: 200px; font: 400 15px/1.6 'Space Mono', monospace; }
.bx-stock .bx-inlineform select { min-height: 38px; border: 1.5px solid #3F544C; background: #EEF2EE; padding: 0 10px; font: inherit; font-size: 14px; max-width: 100%; }
.bx-stock form.bx-actions { margin-top: 24px; }
.bx-fill { gap: 8px; }
.bx-more--list { margin-top: 20px; }
.bx-more--list[open] summary { margin-bottom: 4px; }
.bx-more--list .bx-stocklist, .bx-more--list .bx-entries--tight { border-top: 1px solid #12211D; margin-top: 12px; }
.bx-page .by-field input[type=date] { width: 100%; max-width: 240px; min-height: 46px; border: 1.5px solid #3F544C; border-radius: 0; background: #EEF2EE; padding: 0 12px; font: inherit; color: #12211D; }
.bx-fill .by-hint { flex-basis: 100%; margin: 0; }
.bx-picked { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: center; margin: -6px 0 18px; padding: 12px; border: 1px solid var(--bx-rule); background: #EEF2EE; max-width: 520px; }
.bx-picked > div > b { display: block; font-weight: 600; margin-bottom: 6px; }
.bx-picked .bx-thumb__mark { display: contents; }
.bx-picked .bx-thumb__mark[hidden] { display: none; }
.bx-picked img[hidden] { display: none; }
.bx-stockrow__nums--two { grid-template-columns: repeat(2, max-content); gap: 24px; }
.bx-stockrow__nums--two > div { text-align: left; }
.bx-table--log td { font-size: 13px; }
.bx-table--log .bx-num { padding-right: 14px; }
.bx-table--log .bx-num + td:not(.bx-num) { padding-left: 10px; }

@media (max-width: 1150px) {
  .bx-stockrow { grid-template-columns: 48px minmax(0, 1fr); }
  .bx-stockrow__nums { grid-column: 2; }
  .bx-stockrow__nums > div { text-align: left; }
}
@media (max-width: 940px) {
  .bx-stock .bx-table--stock { display: table; }
}
@media (max-width: 700px) {
  .bx-tiles { grid-template-columns: 1fr; gap: 8px; }
  .bx-tile { min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 14px; padding: 16px 18px; }
  .bx-tile b { font-size: 21px; }
  .bx-tile > span:last-child { grid-column: 1 / -1; }
  .bx-tile__thumbs { grid-column: 2; grid-row: 1; }
  .bx-tile__thumbs .bx-thumb { width: 28px; height: 28px; }
  .bx-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .bx-card .byc-btn { width: 100%; }
  .bx-stock .bx-actions .byc-btn, .bx-stock .bx-actions .by-btn:not(.by-btn--sm) { flex: 1 1 100%; justify-content: center; text-align: center; }
  .bx-entry { padding: 14px; }
  .bx-entry__fields { grid-template-columns: 1fr; }
  .bx-entry__fields--three { grid-template-columns: 1fr 1fr; }
  .bx-entry__fields--three .bx-auto { grid-column: 1 / -1; padding: 0; display: flex; gap: 10px; align-items: baseline; }
  .bx-entry--count { grid-template-columns: 40px minmax(0, 1fr) 96px; gap: 10px; }
  .bx-entry--count .bx-now { display: none; }
  .bx-entry--thumbed { grid-template-columns: 48px minmax(0, 1fr); }
  .bx-entry--thumbed .bx-thumb { width: 48px; height: 48px; }
  .bx-stockrow { grid-template-columns: 40px minmax(0, 1fr); gap: 8px 12px; padding: 12px 0; }
  .bx-stockrow .bx-thumb { width: 40px; height: 40px; }
  .bx-stockrow__nums { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .bx-stockrow__nums > div:nth-child(n+4) { grid-column: span 1; }
  .bx-stats--stock > div { padding: 16px 12px 16px 0 !important; }
  .bx-stats--stock > div:nth-child(2) { border-right: 0; }
  .bx-stats--stock > div:nth-child(-n+2) { border-bottom: 1px solid var(--bx-rule); }
  .bx-legend { gap: 12px; }
  .bx-stock .bx-table--stock { font-size: 13px; display: block; overflow-x: auto; }
  .bx-stock .bx-table--stock th, .bx-stock .bx-table--stock td { padding-right: 10px; }
  .bx-stock .bx-table--stock .bx-cell-thumb { min-width: 190px; }
  .bx-stock .bx-table--stock .bx-cell-thumb > span { white-space: normal; }
  .bx-stock .bx-qty { max-width: none; }
  .bx-entry--count .bx-entry__title b { font-size: 15px; }
  /* The movement log becomes a list on a phone: one block per move, the change printed large. */
  .bx-table--log { display: block; overflow: visible; }
  .bx-table--log thead { display: none; }
  .bx-table--log tbody { display: block; }
  .bx-table--log tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 12px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--bx-rule); }
  .bx-table--log td { display: block; padding: 0 !important; border: 0; }
  .bx-table--log td:nth-child(1) { grid-row: 4; grid-column: 1; font-size: 12px; color: #3F544C; }
  .bx-table--log td:nth-child(2) { grid-row: 1; grid-column: 1; font-weight: 600; display: flex; align-items: center; gap: 10px; }
  .bx-table--log td:nth-child(3) { grid-row: 2; grid-column: 1; }
  .bx-table--log td:nth-child(4) { grid-row: 1; grid-column: 2; font-size: 18px; font-weight: 600; }
  .bx-table--log td:nth-child(5) { grid-row: 2; grid-column: 2; }
  .bx-table--log td:nth-child(5):not(:empty)::after { content: ' left'; font-size: 11px; color: #3F544C; }
  .bx-table--log td:nth-child(6) { grid-row: 3; grid-column: 1 / -1; }
  .bx-table--log td:nth-child(7) { grid-row: 4; grid-column: 2; font-size: 12px; text-align: right; overflow-wrap: anywhere; }
}

/* ---------- Small fixes from the October audit ---------- */
/* The dispatch chip in the welcome panel: pale text on the deep panel (it inherited the panel's soft ink). */
.by-status .by-cutoff { color: #DDE6DE; }
/* The welcome line is an h2: the page already has its h1 in the hero. */
.by-status h2 { font: 800 clamp(30px, 4.2vw, 50px)/1 var(--by-display); letter-spacing: -.035em; margin: 0 0 10px; max-width: 22ch; }
/* Links get a comfortable hit area without moving anything (padding on inline links does not change the line). */
.byc-nav > a:not(.byc-btn) { padding: 10px 0; }
.by-foot a, .by-legal a, .bx-linkbtn, .byc-text-link { padding-block: 6px; }
.bx-nav a { min-height: 40px; }
/* Hidden labels inside a scrolling table must not widen the page. */
.bx-table { position: relative; }

.bx-inline { display: inline; margin: 0; }
.bx-table .bx-inline .bx-linkbtn { padding-block: 0; vertical-align: baseline; }
.bx-invoice__tools { display: inline-flex; align-items: center; gap: 16px; }
/* ---------- Packing slip ---------- */
/* Rows are ordinary blocks, not an admin table. Under 940px (a phone, and A4 when printing) every
   .bx-table becomes a sideways scroll box, and a scroll box does not continue onto the next sheet. */
.bx-slip { position: relative; max-width: 760px; overflow: visible; }
.bx-slip__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 20px; padding-bottom: 18px; border-bottom: 2px solid #12211D; }
.bx-slip__brand { display: flex; align-items: center; gap: 10px; font: 800 26px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; }
.bx-slip__brand svg { width: 40px; height: 40px; }
.bx-slip__meta { margin-left: auto; text-align: right; min-width: 0; }
.bx-slip__order { font: 800 28px/1.1 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; margin: 2px 0; overflow-wrap: anywhere; }
.bx-slip__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 22px 0; }
.bx-slip__addr { font-size: 17px; line-height: 1.5; margin: 6px 0 0; overflow-wrap: anywhere; }
.bx-slip__lines { list-style: none; margin: 0; padding: 0; border-top: 2px solid #12211D; overflow: visible; }
.bx-slip__line { display: grid; grid-template-columns: 28px auto minmax(0, 1fr); gap: 8px 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--bx-rule); break-inside: avoid; page-break-inside: avoid; }
.bx-slip__qty { font: 800 24px/1 'Bricolage Grotesque', sans-serif; text-align: right; font-variant-numeric: tabular-nums; }
.bx-slip__what { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; align-items: center; }
.bx-slip__copy { min-width: 0; display: flex; gap: 10px; align-items: center; }
.bx-slip__text { min-width: 0; display: grid; gap: 2px; }
.bx-slip__name { font-weight: 600; overflow-wrap: anywhere; }
.bx-slip__detail { color: #3F544C; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.bx-slip__sku { font-family: 'Space Mono', monospace; text-align: right; white-space: nowrap; }
.bx-slip__check { width: 28px; }
.bx-slip__box { display: inline-block; width: 22px; height: 22px; border: 2px solid #12211D; }
.bx-slip__warn { border: 2px solid #B8342A; font-weight: 600; }
.bx-slip__foot { margin: 28px 0 10px; font: 400 13px/2 'Space Mono', monospace; color: #3F544C; }
@media (max-width: 700px) {
  .bx-slip__grid { grid-template-columns: 1fr; gap: 16px; }
  .bx-slip__meta { margin-left: 0; text-align: left; }
  .bx-slip__what { grid-template-columns: minmax(0, 1fr); }
  .bx-slip__sku { text-align: left; white-space: normal; }
}
@media print {
  body.bx-print-slip .bx-adminnav,
  body.bx-print-slip .bx-h1,
  body.bx-print-slip .bx-preview-bar,
  body.bx-print-slip .bx-preview-switch { display: none !important; }
  .bx-slip, .bx-slip__lines { max-width: none; overflow: visible !important; }
  .bx-slip__lines .bx-thumb { display: none; }
  .bx-slip__warn { display: block !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------- Trade | Shop switch (top strip, same place on both sites) ---------- */
.bx-topstrip { background: #12211D; color: #EEF2EE; font: 400 11px/1.5 'Space Mono', monospace; letter-spacing: .05em; text-transform: uppercase; }
.bx-topstrip .byc-wrap { display: flex; align-items: center; gap: 24px; min-height: 42px; }
.bx-topstrip span { display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; }
.bx-topstrip__more { margin-left: auto; }
.bx-switch { display: inline-flex; flex: none; border: 1px solid rgba(238, 242, 238, .5); }
.bx-switch a { display: inline-flex; align-items: center; min-height: 28px; padding: 3px 14px; color: #EEF2EE; text-decoration: none; transition: background-color .15s ease, color .15s ease; }
.bx-switch a:hover { background: rgba(238, 242, 238, .16); }
.bx-switch a[aria-current] { background: #A8823A; color: #12211D; font-weight: 700; }
.bx-switch a:focus-visible { outline: 2px solid #A8823A; outline-offset: 2px; }
@media (max-width: 1150px) { .bx-topstrip span.bx-topstrip__more { display: none; } }
@media (max-width: 700px) {
  .bx-topstrip { font-size: 10px; letter-spacing: .03em; }
  .bx-topstrip .byc-wrap { gap: 12px; min-height: 44px; }
  .bx-switch a { min-height: 32px; padding: 3px 16px; font-size: 11px; }
}
@media (max-width: 700px) { .bx-topstrip .byc-wrap > span:not(.bx-topstrip__more) { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; } }
@media print { .bx-topstrip { display: none !important; } }
/* Moving between trade and shop cross-fades instead of flashing (browsers that support it). */
@view-transition { navigation: auto; }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }

/* ---------- Stock: the two China warehouses ---------- */
.bx-wh { margin-top: 8px; }
.bx-wh__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 20px; flex-wrap: wrap; }
.by-concept-theme .bx-wh__total { font: 400 12px/1.5 'Space Mono', monospace; letter-spacing: .03em; text-transform: uppercase; color: #3F544C; }
.bx-wh-tag { display: inline-block; padding: 2px 8px; font: 400 11px/1.5 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .03em; border: 1px solid #12211D; color: #12211D !important; white-space: nowrap; }
.bx-card .bx-wh-tag { font-size: 11px; }
.bx-wh-tag--dongguan { background: #12211D; color: #EEF2EE !important; }
.bx-wh-tag--none { border-style: dashed; }
.bx-wh-choice > legend { padding: 0; margin-bottom: 10px; font: 600 16px/1.3 'Public Sans', sans-serif; }
.bx-wh-choice { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bx-wh-choice > legend { grid-column: 1 / -1; }
.bx-wh-banner { display: grid; gap: 4px; padding: 16px 18px; margin: 0 0 16px; border: 2px solid #12211D; background: #EEF2EE; }
.bx-wh-banner > b { font: 800 30px/1.05 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; }
.bx-wh-banner > span:last-child { font-size: 13px; line-height: 1.5; color: #3F544C; }
.bx-wh-banner--dongguan { background: #12211D; color: #EEF2EE; }
.bx-wh-banner--dongguan .bx-k, .bx-wh-banner--dongguan > span:last-child { color: #DDE6DE; }
.bx-stat__split { display: block; margin-top: 4px; font: 400 11px/1.5 'Space Mono', monospace; letter-spacing: .02em; color: #3F544C; }
.bx-stat__split span { white-space: nowrap; }
.bx-way small { display: block; font-size: 11px; line-height: 1.35; color: #3F544C; }
.bx-way small span { display: block; white-space: nowrap; }
@media (max-width: 700px) {
  .bx-wh-choice { grid-template-columns: minmax(0, 1fr); }
  .bx-wh-banner > b { font-size: 26px; }
}
.bx-rest { flex: 1 1 100%; margin-bottom: 4px; }
.bx-rest > legend { line-height: 1.4; }
.bx-table + .by-note, .bx-table + .by-hint { margin-top: 18px; }

/* ---------- Pre-orders ---------- */
.byc-pre { margin: 0; font: 400 11px/1.6 'Space Mono', monospace; color: #7A5C1E; text-align: right; }
.by-concept-theme .byc-stock--pre, .by-concept-theme .byc-stock--early { color: #7A5C1E; white-space: nowrap; }
.by-concept-theme .byc-btn--pre { background: #A8823A; color: #12211D; }
.by-concept-theme .byc-btn--pre:hover { background: #B8923F; }
@media (max-width: 760px) { .byc-pre { text-align: left; } }
.bx-chip--pre-requested { background: #A8823A; border-color: #A8823A; color: #12211D; }
.bx-chip--pre-declined, .bx-chip--pre-withdrawn { color: #3F544C; }
.bx-pres { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 16px; }
.bx-pres .bx-preorder { border: 1px solid #12211D; background: #EEF2EE; padding: 18px 20px; }
.bx-pre__head { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; margin-bottom: 8px; font-size: 18px; }
.bx-pre__lines { list-style: none; margin: 4px 0 8px; padding: 0; border-top: 1px solid #12211D; }
.bx-pre__lines > li { display: flex; gap: 12px 24px; align-items: center; flex-wrap: wrap; padding: 12px 0; border-bottom: 1px solid var(--bx-rule); }
.bx-pre__what { flex: 1 1 280px; min-width: 0; display: grid; gap: 2px; font-size: 14px; line-height: 1.5; }
.bx-pre__what > span { color: #3F544C; font-size: 13px; }
.bx-pre__qty { flex: 0 0 auto; margin: 0; display: grid; gap: 4px; }
.bx-pre__qty > b { font: 800 22px/1.6 'Bricolage Grotesque', sans-serif; }
.bx-pre__qty input[type=number] { width: 96px; min-height: 42px; border: 1.5px solid #3F544C; background: #EEF2EE; padding: 0 10px; font: inherit; border-radius: 0; }
.bx-pre__confirm { margin: 14px 0 0; }
.bx-pre__decline { margin: 16px 0 0; padding-top: 16px; border-top: 1px dashed #B3BFB7; }
@media (max-width: 700px) { .bx-pres .bx-preorder { padding: 14px; } }
.bx-way__pre a { color: #7A5C1E; }
.bx-entry__pre { margin: 0 0 10px !important; font-size: 13px; line-height: 1.5; }
.bx-entry--thumbed .bx-entry__pre { grid-column: 2; }
.bx-preorder .bx-kv > div { padding-block: 9px; }
.bx-table--gap .bx-num + td, .bx-table--gap .bx-num + th { padding-left: 28px; }
.bx-prewithdraw { margin-top: 6px; }
.bx-chip--pre-requested { white-space: normal; }

/* ---------- Profit ---------- */
.bx-profit-month { align-items: flex-end; margin-bottom: 8px; }
.bx-stats--profit { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bx-sale-form { max-width: none; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bx-sale-form .bx-span-2 { grid-column: span 2; }
.bx-sale-form .bx-span-all, .bx-sale-form > p { grid-column: 1 / -1; }
.bx-stats--profit > div { padding: 20px 20px 20px 0; border-right: 1px solid var(--bx-rule); }
.bx-stats--profit > div + div { padding-left: 20px; }
.bx-stats--profit > div:last-child { border-right: 0; }
.bx-scroll { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.bx-scroll > .bx-table { min-width: 720px; }
@media (max-width: 700px) { .bx-scroll { max-width: calc(100vw - 40px); } }
.bx-table--profit { min-width: 860px; }
.bx-table--profit tfoot th { border-top: 1px solid #12211D; padding-top: 12px; text-align: left; font-weight: 700; }
.bx-table--profit tfoot th.bx-num { text-align: right; }
.bx-stats--profit > div { min-width: 0; }
.bx-stats--profit b { font-size: clamp(26px, 7.4vw, 44px); overflow-wrap: anywhere; }
@media (max-width: 900px) { .bx-sale-form { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) {
  .bx-stats--profit { grid-template-columns: 1fr 1fr; }
  .bx-stats--profit > div:nth-child(odd) { padding-left: 0; }
  .bx-stats--profit > div:nth-child(even) { border-right: 0; }
  .bx-sale-form { grid-template-columns: 1fr; }
  .bx-sale-form .bx-span-2 { grid-column: auto; }
}

/* ---------- Login ---------- */
.bx-login-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
@media (max-width: 480px) { .bx-login-actions > * { flex: 1 1 100%; text-align: center; } }

/* VIP level on the account page: an ink card with a gold meter, then the ladder of levels. */
.bx-vip-banner { position: relative; overflow: hidden; background: #12211D; color: #DDE6DE; padding: 28px 32px 26px; margin: 0 0 36px; display: grid; gap: 22px; }
.bx-vip-banner::before, .bx-vip-banner::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(168, 130, 58, .4); pointer-events: none; }
.bx-vip-banner::before { width: 320px; height: 320px; right: -90px; top: -150px; }
.bx-vip-banner::after { width: 200px; height: 200px; right: 36px; bottom: -110px; }
.bx-vip-banner__check { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.bx-vip-banner__top { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; }
.bx-vip-banner__kicker { margin: 0 0 8px; font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .16em; text-transform: uppercase; color: #B8342A; }
.bx-vip-banner h2 { margin: 0; font: 800 clamp(40px, 6vw, 64px)/.92 'Bricolage Grotesque', sans-serif; letter-spacing: -.04em; color: #DDE6DE; }
.bx-vip-banner__tag { margin: 10px 0 0; font: 800 clamp(18px, 2vw, 22px)/1.2 'Bricolage Grotesque', sans-serif; color: #A8823A; }
.bx-vip-banner__levels { margin: 10px 0 0; font: 400 14px/1.45 'Public Sans', sans-serif; color: #DDE6DE; }
.bx-vip-banner__you { margin: 8px 0 0; font: 600 15px/1.5 'Public Sans', sans-serif; color: #DDE6DE; }
.bx-vip-banner__meter { margin: 10px 0 0; height: 8px; max-width: 420px; background: rgba(221, 230, 222, .18); border-radius: 4px; overflow: hidden; }
.bx-vip-banner__meter span { display: block; height: 100%; background: #A8823A; border-radius: 4px; }
.bx-vip-banner a { display: inline-block; margin-top: 10px; color: #DDE6DE; font: 600 14px/1.4 'Public Sans', sans-serif; }
.bx-vip-banner__more { display: none; }
.bx-vip-banner__cards { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bx-vip-banner__card { margin: 0; padding: 18px 18px 16px; border: 1px solid rgba(221, 230, 222, .28); background: rgba(221, 230, 222, .06); }
.bx-vip-banner__card--gold { border-color: #A8823A; background: linear-gradient(180deg, rgba(168, 130, 58, .16), rgba(18, 33, 29, .2)); }
.bx-vip-banner__card[aria-current="true"] { outline: 1px solid #DDE6DE; }
.bx-vip-banner__tier { margin: 0 0 8px; font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: #DDE6DE; }
.bx-vip-banner__card--gold .bx-vip-banner__tier, .bx-vip-banner__card--gold h3 { color: #A8823A; }
.bx-vip-banner__card h3 { margin: 0 0 6px; font: 800 32px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; color: #DDE6DE; }
.bx-vip-banner__from { margin: 0 0 12px; font: 400 12px/1.4 'Space Mono', monospace; letter-spacing: .06em; text-transform: uppercase; color: #A8823A; }
.bx-vip-banner__card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.bx-vip-banner__card li { position: relative; padding-left: 14px; font: 400 14px/1.45 'Public Sans', sans-serif; color: #DDE6DE; }
.bx-vip-banner__card li::before { content: ""; position: absolute; left: 0; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: #DDE6DE; }
.bx-vip-banner__card--gold li::before { background: #A8823A; }
@media (max-width: 700px) {
  .bx-vip-banner { padding: 16px; gap: 12px; margin-bottom: 24px; }
  .bx-vip-banner h2 { font-size: 36px; }
  .bx-vip-banner__more { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border: 1px solid #A8823A; color: #A8823A; font: 400 11px/1 'Space Mono', monospace; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
  .bx-vip-banner__cards { display: none; }
  .bx-vip-banner__check:checked ~ .bx-vip-banner__cards { display: grid; grid-template-columns: 1fr; }
  .bx-vip-banner__check:focus-visible ~ .bx-vip-banner__top .bx-vip-banner__more { outline: 2px solid #DDE6DE; outline-offset: 3px; }
}

/* Public VIP summary for logged-out visitors. Cards stay visible on a phone; the member banner above is unchanged. */
.bx-vip-public-wrap { margin: 4px auto 28px; }
.bx-vip-public { position: relative; overflow: hidden; background: #12211D; color: #DDE6DE; padding: 28px 32px 26px; display: grid; gap: 22px; }
.bx-vip-public::before, .bx-vip-public::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(168, 130, 58, .4); pointer-events: none; }
.bx-vip-public::before { width: 320px; height: 320px; right: -90px; top: -150px; }
.bx-vip-public::after { width: 200px; height: 200px; right: 36px; bottom: -110px; }
.bx-vip-public__top, .bx-vip-public__cards { position: relative; z-index: 1; }
.bx-vip-public__kicker { margin: 0 0 8px; font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .16em; text-transform: uppercase; color: #B8342A; }
.bx-vip-public h2 { margin: 0; font: 800 clamp(40px, 6vw, 64px)/.92 'Bricolage Grotesque', sans-serif; letter-spacing: -.04em; color: #DDE6DE; }
.bx-vip-public__tag { margin: 10px 0 0; font: 800 clamp(18px, 2vw, 22px)/1.2 'Bricolage Grotesque', sans-serif; color: #A8823A; }
.bx-vip-public__lead, .bx-vip-public__levels, .bx-vip-public__note { margin: 10px 0 0; max-width: 62ch; font: 400 15px/1.5 'Public Sans', sans-serif; color: #DDE6DE; }
.bx-vip-public__lead { font-weight: 600; }
.bx-vip-public__cta { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; margin-top: 16px; padding: 10px 18px; background: #A8823A; color: #12211D; font: 600 15px/1.3 'Public Sans', sans-serif; text-decoration: none; }
.bx-vip-public__cta:hover { filter: brightness(1.06); }
.bx-vip-public__cta:focus-visible { outline: 2px solid #DDE6DE; outline-offset: 3px; }
.bx-vip-public__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bx-vip-public__card { margin: 0; padding: 18px 18px 16px; border: 1px solid rgba(221, 230, 222, .28); background: rgba(221, 230, 222, .06); }
.bx-vip-public__card--gold { border-color: #A8823A; background: linear-gradient(180deg, rgba(168, 130, 58, .16), rgba(18, 33, 29, .2)); }
.bx-vip-public__tier { margin: 0 0 8px; font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: #DDE6DE; }
.bx-vip-public__card--gold .bx-vip-public__tier, .bx-vip-public__card--gold h3 { color: #A8823A; }
.bx-vip-public__card h3 { margin: 0 0 6px; font: 800 32px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; color: #DDE6DE; }
.bx-vip-public__from { margin: 0 0 12px; font: 400 12px/1.4 'Space Mono', monospace; letter-spacing: .06em; text-transform: uppercase; color: #A8823A; }
.bx-vip-public__card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.bx-vip-public__card li { position: relative; padding-left: 14px; font: 400 14px/1.45 'Public Sans', sans-serif; color: #DDE6DE; }
.bx-vip-public__card li::before { content: ""; position: absolute; left: 0; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: #DDE6DE; }
.bx-vip-public__card--gold li::before { background: #A8823A; }
@media (max-width: 700px) {
  .bx-vip-public-wrap { margin-bottom: 20px; }
  .bx-vip-public { padding: 16px; gap: 14px; }
  .bx-vip-public h2 { font-size: 36px; }
  .bx-vip-public__cards { grid-template-columns: 1fr; }
  .bx-vip-public__cta { width: 100%; }
}

/* Compact copy of the same summary, in the application column. */
.bx-vip-apply { margin-top: 18px; background: #12211D; color: #DDE6DE; padding: 16px 16px 14px; }
.by-apply-intro .bx-vip-apply p { color: #DDE6DE; max-width: none; margin: 0 0 10px; }
.bx-vip-apply__kicker { margin-bottom: 6px !important; font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .16em; text-transform: uppercase; color: #B8342A !important; }
.bx-vip-apply__tag { font: 800 22px/1.15 'Bricolage Grotesque', sans-serif !important; color: #A8823A !important; }
.bx-vip-apply__levels { font: 400 13px/1.45 'Space Mono', monospace !important; }
.bx-vip-apply__card { margin: 0; padding: 10px 0; border-top: 1px solid rgba(221, 230, 222, .28); }
.bx-vip-apply__head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.bx-vip-apply h3 { margin: 0; font: 800 22px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; color: #DDE6DE; }
.bx-vip-apply__from { margin: 0 !important; font: 400 12px/1.4 'Space Mono', monospace !important; letter-spacing: .04em; text-transform: uppercase; color: #A8823A !important; white-space: nowrap; }
.bx-vip-apply__card--gold h3, .bx-vip-apply__card--gold .bx-vip-apply__from { color: #A8823A !important; }
.bx-vip-apply ul { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.bx-vip-apply li { position: relative; padding-left: 14px; font: 400 14px/1.45 'Public Sans', sans-serif; color: #DDE6DE; }
.bx-vip-apply li::before { content: ""; position: absolute; left: 0; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: #DDE6DE; }
.bx-vip-apply__card--gold li::before { background: #A8823A; }
.bx-vip-apply__note { margin: 12px 0 0 !important; padding-top: 12px; border-top: 1px solid rgba(221, 230, 222, .28); font: 400 13px/1.5 'Public Sans', sans-serif !important; }
/* Diamond only. Gold stays #A8823A. Ice reads on the ink banner; the status line is the only part that changes. */
@keyframes bx-diamond-shimmer { from { background-position: 0% 50%; } to { background-position: 220% 50%; } }
.bx-vip-banner--diamond .bx-vip-banner__you { color: #E8F4FA; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .bx-vip-banner--diamond .bx-vip-banner__you {
    background-image: linear-gradient(100deg, #7FC8E8, #B9E3F2 28%, #E8F4FA 46%, #fff 50%, #B9E3F2 62%, #7FC8E8);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: bx-diamond-shimmer 8s linear infinite;
  }
}
.bx-vip { background: #12211D; color: #DDE6DE; padding: 24px; margin: 0 0 28px; display: grid; gap: 14px; }
.bx-vip__head { display: grid; gap: 4px; }
.bx-vip__eyebrow { margin: 0; font-family: var(--by-mono, "Space Mono", ui-monospace, monospace); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #D4B46C; }
.bx-vip__name { margin: 0; font-family: var(--by-display, "Bricolage Grotesque", system-ui, sans-serif); font-weight: 800; font-size: clamp(32px, 6vw, 44px); line-height: 1; letter-spacing: -.03em; color: #EEF2EE; }
.bx-vip__perks { margin: 0; font-weight: 600; color: #EEF2EE; }
.bx-vip__meter { height: 8px; background: rgba(221, 230, 222, .18); border-radius: 4px; overflow: hidden; }
.bx-vip__meter span { display: block; height: 100%; background: #D4B46C; border-radius: 4px; }
.bx-vip__nudge { margin: 0; font-family: var(--by-display, "Bricolage Grotesque", system-ui, sans-serif); font-weight: 800; font-size: clamp(22px, 5vw, 28px); line-height: 1.15; letter-spacing: -.02em; color: #D4B46C; }
.bx-vip__line { margin: 0; font-size: 14px; line-height: 1.55; }
.bx-vip__line b { color: #EEF2EE; font-variant-numeric: tabular-nums; }
.bx-vip__ladder { list-style: none; margin: 4px 0 0; padding: 0; border-top: 1px solid rgba(221, 230, 222, .25); }
.bx-vip__ladder li { display: grid; grid-template-columns: minmax(80px, 1fr) minmax(90px, 1fr) 2fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(221, 230, 222, .25); font-size: 14px; align-items: baseline; }
.bx-vip__ladder li[aria-current] .bx-vip__tier { color: #D4B46C; }
.bx-vip__ladder li[aria-current] .bx-vip__tier::after { content: " · you"; font-weight: 400; color: #DDE6DE; }
.bx-vip__tier { font-weight: 700; color: #EEF2EE; }
.bx-vip__from { font-variant-numeric: tabular-nums; }
.bx-vip__small { margin: 0; font-size: 12.5px; line-height: 1.5; color: #B9C6BD; }
@media (max-width: 520px) {
  .bx-vip { padding: 20px 16px; }
  .bx-vip__ladder li { grid-template-columns: 1fr auto; }
  .bx-vip__gets { grid-column: 1 / -1; color: #B9C6BD; }
}
.bx-vip--diamond .bx-vip__eyebrow { color: #7FC8E8; }
.bx-vip--diamond .bx-vip__name { color: #E8F4FA; }
.bx-vip--diamond .bx-vip__invite { color: #B9E3F2; }
.bx-vip--diamond a { color: #B9E3F2; }
.bx-vip--diamond .bx-vip__meter span { background: linear-gradient(90deg, #7FC8E8, #E8F4FA, #fff, #B9E3F2, #7FC8E8); background-size: 220% 100%; animation: bx-diamond-shimmer 6s linear infinite; }
.bx-vip--diamond .bx-vip__ladder li[aria-current] .bx-vip__tier { color: #B9E3F2; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .bx-vip--diamond .bx-vip__name {
    background-image: linear-gradient(100deg, #7FC8E8, #E8F4FA 35%, #fff 50%, #B9E3F2 68%, #7FC8E8);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: bx-diamond-shimmer 8s linear infinite;
  }
}
.bx-mono-note--diamond { color: #12211D; background-image: linear-gradient(100deg, #E8F4FA, #B9E3F2 42%, #fff 50%, #B9E3F2 58%, #E8F4FA); background-size: 220% 100%; border-left: 3px solid #7FC8E8; padding: 8px 10px; animation: bx-diamond-shimmer 8s linear infinite; }
.bx-diamond-chip { display: inline-block; padding: 0 7px; color: #12211D; background-image: linear-gradient(105deg, #E8F4FA, #B9E3F2 40%, #fff 50%, #B9E3F2 60%, #7FC8E8); background-size: 220% 100%; border: 1px solid #7FC8E8; font-weight: 700; animation: bx-diamond-shimmer 8s linear infinite; }
.bx-diamond-count { background-image: linear-gradient(160deg, #E8F4FA, #B9E3F2 55%, #E8F4FA); background-size: 220% 220%; margin: 8px 12px 8px 0; padding: 12px 14px !important; animation: bx-diamond-shimmer 8s linear infinite; }
.bx-diamond-count span { color: #12211D; }
.bx-diamond-select { background-color: #E8F4FA; border-color: #7FC8E8; color: #12211D; box-shadow: inset 0 0 0 1px #B9E3F2; }
.bx-diamond-badge { display: inline-flex; align-items: center; min-height: 32px; padding: 0 10px; color: #12211D; text-decoration: none; background-image: linear-gradient(105deg, #E8F4FA, #B9E3F2 38%, #fff 50%, #B9E3F2 62%, #7FC8E8); background-size: 220% 100%; border: 1px solid #7FC8E8; font: 700 11px/1 'Space Mono', monospace; letter-spacing: .14em; text-transform: uppercase; animation: bx-diamond-shimmer 7s linear infinite; }
.bx-diamond-badge:hover { color: #12211D; text-decoration: none; }
.bx-diamond-welcome { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 20px; background: rgba(18, 33, 29, .78); }
.bx-diamond-welcome__card { position: relative; overflow: hidden; width: min(520px, 100%); background: #12211D; color: #E8F4FA; padding: 32px 24px 24px; border: 1px solid #7FC8E8; box-shadow: 0 0 0 1px rgba(185, 227, 242, .35); }
.bx-diamond-welcome__card::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(115deg, transparent 32%, rgba(232, 244, 250, .22) 48%, transparent 64%); background-size: 220% 100%; animation: bx-diamond-shimmer 6s linear infinite; pointer-events: none; }
.bx-diamond-welcome__kicker { position: relative; margin: 0 0 8px; font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .16em; text-transform: uppercase; color: #7FC8E8; }
.bx-diamond-welcome h2 { position: relative; margin: 0 0 12px; font: 800 clamp(36px, 8vw, 52px)/.95 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; color: #E8F4FA; }
.bx-diamond-welcome p, .bx-diamond-welcome ul, .bx-diamond-welcome form { position: relative; }
.bx-diamond-welcome p { margin: 0 0 12px; font: 400 16px/1.5 'Public Sans', sans-serif; }
.bx-diamond-welcome ul { margin: 0 0 20px; padding: 0; list-style: none; display: grid; gap: 8px; }
.bx-diamond-welcome li { padding-left: 16px; position: relative; }
.bx-diamond-welcome li::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; background: #7FC8E8; }
.bx-diamond-welcome__go { min-height: 46px; padding: 0 18px; border: 0; background-image: linear-gradient(100deg, #E8F4FA, #B9E3F2 55%, #fff); background-size: 220% 100%; color: #12211D; font: 700 15px/1 'Public Sans', sans-serif; cursor: pointer; animation: bx-diamond-shimmer 8s linear infinite; }
.bx-requests { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.bx-requests li { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--bx-rule, rgba(18, 33, 29, .15)); display: grid; gap: 6px; }
.bx-requests p { margin: 0; }
.bx-requests form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.bx-requests select { min-height: 40px; }
@media (prefers-reduced-motion: reduce) {
  .bx-vip-banner--diamond .bx-vip-banner__you,
  .bx-vip--diamond .bx-vip__name,
  .bx-vip--diamond .bx-vip__meter span,
  .bx-mono-note--diamond,
  .bx-diamond-chip,
  .bx-diamond-count,
  .bx-diamond-badge,
  .bx-diamond-welcome__card::before,
  .bx-diamond-welcome__go { animation: none; }
}
.bx-totals__vip dt, .bx-totals__vip dd { color: #1E3830; font-weight: 600; }
.bx-vip-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); border-top: 1px solid #12211D; border-bottom: 1px solid var(--bx-rule); margin: 8px 0 4px; }
.bx-vip-counts > div { padding: 16px 16px 16px 0; display: grid; gap: 2px; }
.bx-vip-counts b { font: 800 40px/1 'Bricolage Grotesque', sans-serif; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.bx-vip-counts span { font: 700 11px/1.5 'Space Mono', monospace; text-transform: uppercase; letter-spacing: .05em; }
.bx-vip-counts small { font-size: 12px; color: #3F544C; }
.bx-vip-edit input:not([type="checkbox"]) { width: 100%; min-width: 90px; }
.bx-vip-edit input[readonly] { background: transparent; border-style: dashed; }
.bx-vip-shops { min-width: 720px; }
.bx-vip-shops th, .bx-vip-shops td { padding-right: 16px; vertical-align: top; }
.bx-vip-shops select, .bx-vip-shops input { width: 100%; max-width: 280px; }
.bx-vip-edit { min-width: 600px; }
.bx-vip-edit th, .bx-vip-edit td { padding-right: 12px; }
.bx-vip-shops th:nth-child(3), .bx-vip-shops td:nth-child(3) { padding-left: 28px; }
@media (max-width: 700px) {
  .bx-scroll > .bx-vip-shops, .bx-scroll > .bx-vip-edit, .bx-vip-shops, .bx-vip-edit { min-width: 0; }
  .bx-vip-shops thead, .bx-vip-edit thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bx-vip-shops tr, .bx-vip-edit tr { display: grid; gap: 8px; padding: 14px 0; border-bottom: 1px solid var(--bx-rule); }
  .bx-vip-shops td, .bx-vip-edit td { display: grid; gap: 4px; padding: 0 !important; border: 0; }
  .bx-vip-shops td::before, .bx-vip-edit td::before { content: attr(data-label); font: 400 11px/1.4 'Space Mono', monospace; letter-spacing: .04em; text-transform: uppercase; color: #3F544C; }
  .bx-vip-shops td.bx-num, .bx-vip-edit td.bx-num { text-align: left; }
}

/* Admin preview of a trade buyer. The red bar stays put so a preview is never mistaken for a real account. */
.bx-preview-bar { position: sticky; top: 0; z-index: 120; display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; padding: calc(10px + env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) 10px max(20px, env(safe-area-inset-left)); background: #B8342A; color: #fff; font: 700 15px/1.35 'Public Sans', sans-serif; }
.bx-preview-bar p { margin: 0; }
.bx-preview-bar form { margin: 0; }
.bx-preview-bar button { min-height: 36px; padding: 0 12px; border: 0; background: #fff; color: #B8342A; font: 700 14px/1 'Public Sans', sans-serif; cursor: pointer; }
.bx-preview-bar button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.bx-preview-switch { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; padding: 12px 20px; background: #12211D; color: #F4E7C5; border-bottom: 3px solid #A8823A; }
.bx-preview-switch__label { font: 700 12px/1 'Space Mono', monospace; letter-spacing: .12em; text-transform: uppercase; }
.bx-preview-switch button { min-height: 40px; padding: 8px 12px; border: 1px solid #F4E7C5; background: transparent; color: #F4E7C5; font: 700 14px/1 'Public Sans', sans-serif; cursor: pointer; }
.bx-preview-switch button[aria-pressed="true"] { background: #F4E7C5; color: #12211D; }
.bx-preview-switch button:focus-visible { outline: 2px solid #F4E7C5; outline-offset: 2px; }
.bx-preview-note { margin: 0 0 12px; padding: 10px 12px; background: #F4E7C5; color: #12211D; font: 600 14px/1.45 'Public Sans', sans-serif; }
@media (max-width: 420px) {
  .bx-preview-bar { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
  .bx-preview-switch { padding-inline: 16px; }
  .bx-preview-switch button { flex: 1 1 calc(50% - 8px); }
}

/* ---------- iPhone Home Screen ---------- */
html { background: #12211D; }
body.by-concept-theme { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
.by-concept-theme:not(.rs) #header-group {
  padding-top: env(safe-area-inset-top);
  background: linear-gradient(#12211D, #12211D) top / 100% env(safe-area-inset-top) no-repeat, #DDE6DE;
}
body:has(.bx-preview-bar) #header-group { padding-top: 0; }
body.by-concept-theme:not(.rs):has(.bx-preview-bar) #header-group { background: #DDE6DE; }
.by-concept-theme:not(.rs) .by-legal { padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
@media (max-width: 700px) {
  .by-concept-theme:not(.rs) #header-group { position: sticky; top: 0; z-index: 40; }
}
.by-concept-theme .bx-standalone-back { display: flex; align-items: center; min-height: 44px; padding: 0 8px 0 4px; background: #12211D; color: #DDE6DE; }
.by-concept-theme .bx-standalone-back[hidden] { display: none !important; }
.by-concept-theme .bx-standalone-back button { min-height: 44px; min-width: 44px; padding: 0 12px; border: 0; background: transparent; color: #DDE6DE; font: 600 15px/1 'Public Sans', sans-serif; cursor: pointer; }
.by-concept-theme .bx-standalone-back button:focus-visible { outline: 2px solid #A8823A; outline-offset: 2px; }
.bx-a2hs { position: fixed; z-index: 70; left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); bottom: calc(12px + env(safe-area-inset-bottom)); display: grid; gap: 10px; width: min(420px, calc(100% - 24px)); margin: 0 auto; padding: 14px 14px 12px; background: #12211D; color: #DDE6DE; box-shadow: 0 8px 24px rgba(18, 33, 29, .28); }
.bx-a2hs[hidden] { display: none !important; }
.bx-a2hs p { margin: 0; font: 400 14px/1.45 'Public Sans', sans-serif; }
.bx-a2hs strong { font-weight: 700; }
.bx-a2hs button { justify-self: start; min-height: 44px; padding: 0 14px; background: transparent; color: #DDE6DE; border: 1px solid #A8823A; font: 600 14px/1 'Public Sans', sans-serif; cursor: pointer; }
.bx-a2hs button:focus-visible { outline: 2px solid #A8823A; outline-offset: 2px; }
@media print { .bx-standalone-back, .bx-a2hs { display: none !important; } }

/* ---------- Phone notifications ---------- */
.bx-push { display: grid; gap: 10px; justify-items: start; margin: 0 0 18px; }
.bx-push[hidden], .bx-push [hidden] { display: none !important; }
.bx-push__ios, .bx-push__state { margin: 0; font: 400 14px/1.45 'Public Sans', sans-serif; }
.bx-push__ios { padding: 12px 14px; background: #12211D; color: #DDE6DE; }
.bx-push .byc-btn, .bx-push .by-btn { margin: 0; min-height: 44px; }
.bx-pushcard { border: 1px solid #12211D; background: #fff; padding: 16px; margin: 0 0 22px; }
.bx-pushcard .bx-h2 { margin-top: 0; }
.bx-alert-send { border: 1px solid #12211D; background: #fff; padding: 16px; margin: 0 0 22px; }
.bx-alert-send .bx-h2 { margin-top: 0; }
.bx-alert-send form + form { margin-top: 16px; padding-top: 16px; border-top: 1px solid #DDE6DE; }
.bx-alert-send__preview { margin: 0 0 8px; }
.bx-pref { display: grid; gap: 14px; margin-top: 8px; }
.bx-pref .by-check { min-height: 44px; }
.bx-pref .by-check small { display: block; font-weight: 400; color: #3F544C; }
.bx-cats { border: 0; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.bx-cats legend { font: 600 16px/1.3 'Public Sans', sans-serif; margin-bottom: 4px; }
.bx-follows { list-style: none; margin: 0 0 16px; padding: 0; }
.bx-follows li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #DDE6DE; }
.bx-follows form { margin: 0; }
.bx-addprod { display: grid; gap: 8px; margin: 12px 0 18px; }
.bx-addprod select { min-height: 44px; width: 100%; }
.bx-bellform { margin: 12px 0 0; }
.bx-bell { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 12px; border: 1px solid #12211D; background: #DDE6DE; color: #12211D; font: 600 13px/1 'Public Sans', sans-serif; text-decoration: none; cursor: pointer; }
.bx-bell svg { width: 16px; height: 16px; flex: none; }
.bx-bell--on { background: #12211D; color: #DDE6DE; border-color: #A8823A; }
.bx-bell:focus-visible { outline: 2px solid #A8823A; outline-offset: 2px; }
.bx-product-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: none; }
.byc-product-main:has(.bx-bellform) { flex-wrap: wrap; }
.rs .bx-bellform { margin: 8px 0 4px; }
.rs .bx-bell { display: inline-flex; width: 100%; background: #DDE6DE; color: #12211D; border: 1px solid #12211D; }
.rs .bx-bell--on { background: #12211D; color: #DDE6DE; border-color: #A8823A; }
@media (max-width: 700px) {
  .bx-push .byc-btn, .bx-push .by-btn, .bx-alert-send .by-btn, .bx-pref .byc-btn, .rs .bx-bell { width: 100%; }
  .bx-follows li { align-items: stretch; flex-direction: column; }
}

.bx-cancel-wrap > summary { cursor: pointer; list-style: none; }
.bx-cancel-wrap > summary::-webkit-details-marker { display: none; }
.bx-cancel-wrap[open] > summary { margin-bottom: 12px; }
.bx-table th.bx-gap, .bx-table td.bx-gap { padding-right: 28px; }
.bx-pref__row { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid rgba(18,33,29,.12); }
.bx-pref__row small { display: block; font-weight: 400; color: #3F544C; margin-top: 2px; }
.bx-brands { border: 0; padding: 0; margin: 0; }
.bx-cats-wrap { margin: 12px 0 4px; }
.bx-cats-wrap > summary { cursor: pointer; font-weight: 600; padding: 8px 0; }