:root {
  --ink: #2c2925; --muted: #776f65; --paper: #fffdf8; --cream: #f5efe5;
  --cream-deep: #eadbc6; --line: #e8dccb; --brown: #967047;
  --brown-dark: #684727; --sage: #4f755f; --red: #a7534d; --gold: #c49a62;
  color: var(--ink); background: var(--cream);
  font-family: "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background-color: var(--cream); background-image: linear-gradient(90deg, rgba(150,112,71,.025) 1px, transparent 1px), linear-gradient(rgba(150,112,71,.025) 1px, transparent 1px); background-size: 28px 28px; }
.brand-bar { height: 76px; padding: 0 max(24px, calc((100% - 1180px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 20px; background: rgba(255,253,248,.94); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; backdrop-filter: blur(12px); }
.brand-lockup { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.brand-lockup > span:last-child { display: grid; }
.brand-lockup strong { font-size: 18px; letter-spacing: .12em; }
.brand-lockup small { color: var(--brown); font-size: 10px; letter-spacing: .2em; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; color: var(--paper); background: var(--brown); font-weight: 800; font-size: 22px; border-radius: 50% 50% 50% 12px; }
.brand-context { color: var(--muted); font-size: 13px; }
.page { width: min(1180px, calc(100% - 36px)); margin: 30px auto 64px; }
.customer-page { width: min(820px, calc(100% - 28px)); }
.card { background: var(--paper); border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 16px 44px rgba(84,57,30,.07); padding: 28px; margin-bottom: 20px; }
.hero { min-height: 240px; display: flex; align-items: center; justify-content: space-between; gap: 28px; overflow: hidden; position: relative; background: radial-gradient(circle at 85% 20%, rgba(196,154,98,.18), transparent 28%), linear-gradient(120deg, #fffaf1 0%, #fffdf9 56%, #efe2d0 100%); }
.hero::after { content: "FUDING"; position: absolute; right: -20px; bottom: -42px; color: rgba(150,112,71,.06); font-size: clamp(70px, 13vw, 150px); font-weight: 800; letter-spacing: -.05em; }
.hero > * { position: relative; z-index: 1; }
.hero h1 { margin: 5px 0 14px; font-size: clamp(34px, 6vw, 64px); line-height: 1.08; letter-spacing: -.04em; }
.hero p { margin: 0; color: var(--muted); line-height: 1.75; }
.eyebrow { margin: 0 !important; color: var(--brown) !important; font-size: 11px !important; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.hero-seal { width: 108px; height: 108px; flex: none; display: grid; place-items: center; text-align: center; border: 1px solid rgba(150,112,71,.35); border-radius: 50%; color: var(--brown-dark); font-family: "STKaiti", "KaiTi", serif; font-size: 22px; line-height: 1.35; background: rgba(255,253,248,.55); }
h2, h3, p { word-break: break-word; }
h2 { margin: 0; font-size: 24px; letter-spacing: -.02em; }
h3 { margin: 0; }
.loading { min-height: 180px; display: grid; place-items: center; color: var(--muted); }
.section-kicker { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.section-kicker > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--brown); color: #fff; font: 700 12px/1 "Segoe UI"; }
.section-kicker p { margin: 2px 0 0; color: var(--muted); font-size: 12px; }
.current-product-head { display: flex; justify-content: space-between; gap: 20px; padding: 22px; border-radius: 16px; background: var(--cream); }
.current-product-head > div { display: grid; gap: 4px; }
.current-product-head strong { font-size: clamp(23px, 5vw, 36px); letter-spacing: -.03em; }
.current-product-head small { color: var(--brown-dark); }
.sample-label { color: var(--muted); font-size: 10px; letter-spacing: .16em; }
.status, .product-state { display: inline-flex; align-items: center; width: fit-content; border-radius: 999px; padding: 7px 11px; color: var(--sage); background: #edf5ef; font-size: 12px; white-space: nowrap; }
.status.offline, .product-state.offline { color: var(--red); background: #fbefed; }
.specs { margin: 18px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.specs div { padding: 17px; border-right: 1px solid var(--line); }
.specs div:last-child { border-right: 0; }
dt { color: var(--muted); font-size: 13px; }
dt small { font-size: 10px; }
dd { margin: 8px 0 0; font-weight: 600; word-break: break-word; }
form { display: grid; gap: 15px; }
label { display: grid; gap: 7px; color: #514b44; font-size: 14px; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 11px; padding: 12px 13px; font: inherit; color: var(--ink); background: #fffefa; }
input[type="search"] { padding-left: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23967047' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: 14px center; }
textarea { min-height: 90px; resize: vertical; }
input:focus, textarea:focus, select:focus { outline: 3px solid rgba(150,112,71,.12); border-color: var(--brown); }
button, .secondary-button { border: 0; border-radius: 11px; padding: 12px 16px; text-align: center; font: inherit; font-weight: 650; cursor: pointer; color: #fff; background: var(--brown); text-decoration: none; transition: transform .16s ease, background .16s ease; }
button:hover, .secondary-button:hover { transform: translateY(-1px); background: var(--brown-dark); }
button:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.secondary-button, .soft-button { background: var(--cream-deep); color: var(--brown-dark); }
.selection-card { border: 1px solid var(--line); border-radius: 18px; padding: 18px; background: #fffefa; }
.selection-heading { display: flex; justify-content: space-between; margin-bottom: 14px; }
.selection-heading span { color: var(--brown); font-weight: 700; }
.selected-products { display: grid; gap: 10px; margin-bottom: 12px; }
.selected-product { display: grid; grid-template-columns: minmax(0, 1fr) 80px auto; gap: 10px; align-items: center; padding: 10px; border-radius: 13px; background: var(--cream); font-size: 14px; }
.selected-product-info { display: flex; gap: 11px; align-items: center; min-width: 0; }
.selected-product-info img, .selected-thumb-placeholder { width: 66px; height: 66px; flex: none; border-radius: 10px; object-fit: cover; background: #eee5d9; }
.selected-thumb-placeholder { display: grid; place-items: center; color: var(--muted); font-size: 12px; }
.selected-product-info div { min-width: 0; }
.selected-product-info strong, .selected-product-info small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.selected-product-info small { color: var(--muted); margin-top: 3px; font-size: 11px; }
.selected-product input { padding: 9px; }
.remove-product, .outline-danger, .text-danger { padding: 8px 10px; background: transparent; color: var(--red); border: 1px solid #e7c3bf; }
.text-danger { border-color: transparent; }
.scan-action { width: 100%; min-height: 56px !important; display: flex; align-items: center; justify-content: center; color: var(--brown-dark) !important; background: var(--cream-deep) !important; font-size: 15px !important; line-height: 1.35 !important; visibility: visible !important; }
.product-chooser { margin-top: 16px; padding-top: 18px; border-top: 1px solid var(--line); }
.scanner-card { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--cream); }
.chooser-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.chooser-heading > div { display: grid; gap: 7px; }
.chooser-heading strong { line-height: 1.45; }
.chooser-heading small { color: var(--muted); font-weight: 500; }
.step-pill { width: fit-content; border-radius: 999px; padding: 4px 8px; color: var(--brown-dark); background: var(--cream-deep); font-size: 9px; letter-spacing: .13em; }
.scanner-video { width: 100%; max-height: 360px; border-radius: 14px; background: #171512; object-fit: cover; margin-bottom: 12px; }
.scan-steps { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin: 16px 0; padding: 0; }
.scan-steps li { display: flex; gap: 8px; align-items: flex-start; padding: 10px; border-radius: 11px; background: var(--paper); font-size: 12px; line-height: 1.45; }
.scan-steps b { width: 22px; height: 22px; flex: none; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--brown); }
.scan-steps small { color: var(--muted); }
.scan-guide { margin: 12px 0; border-top: 1px solid var(--line); padding-top: 10px; }
.scan-guide summary { color: var(--brown-dark); cursor: pointer; font-size: 12px; font-weight: 650; }
.scan-guide .scan-steps { margin: 10px 0 4px; }
.scanner-input-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.limit-message { margin: 12px 0 0; color: #8b6228; line-height: 1.6; font-size: 13px; }
.staff-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.staff-card h2 { margin: 4px 0; }
.staff-card p { margin: 0; color: var(--muted); }
.staff-card .secondary-button { flex: none; }
.form-message { min-height: 22px; margin: 0; white-space: pre-line; color: var(--muted); }
.form-message.success { color: var(--sage); }
.form-message.error, .error-card { color: var(--red); }
.staff-hero { min-height: 210px; }
.staff-hero h1 { font-size: clamp(34px, 5vw, 58px); }
.section-heading { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.heading-actions { display: flex; align-items: center; gap: 10px; width: min(560px, 52%); }
.heading-actions .toolbar-search { flex: 1; width: auto !important; }
.heading-actions button { white-space: nowrap; }
.product-actions { width: auto; }
.section-heading h2 { margin: 3px 0 0; }
.section-heading > .toolbar-search { width: min(360px, 46%); }
.section-title-group { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.product-stats, .section-note { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.dashboard-stats { width: min(60%, 700px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 22px auto 14px 0; }
.dashboard-stats article { min-height: 76px; padding: 12px 14px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg, #fffefa, #f4eadc); }
.dashboard-stats small { color: var(--muted); }
.dashboard-stats strong { font-size: 26px; color: var(--brown-dark); }
.workspace-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) auto; gap: 10px 14px; align-items: end; margin: 16px 0 22px; }
.weight-filter { display: flex; align-items: center; gap: 8px; padding: 7px; border: 1px solid var(--line); border-radius: 13px; background: var(--cream); }
.weight-filter label { margin: 0; }
.weight-filter input { width: 105px; padding: 9px 10px; background: #fffefa; }
.filter-label { padding-left: 5px; color: var(--brown-dark); font-size: 13px; font-weight: 700; white-space: nowrap; }
.range-separator, .weight-unit { color: var(--muted); white-space: nowrap; }
.weight-filter button { padding: 9px 11px; white-space: nowrap; }
.filter-message { grid-column: 1 / -1; min-height: 0; margin: -5px 0 0; color: var(--red); font-size: 12px; }
.filter-message:empty { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.sample-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sample-card { min-width: 0; display: grid; grid-template-columns: 154px minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fffefa; }
.sample-card.is-offline { opacity: .72; }
.sample-image { min-height: 238px; position: relative; display: grid; place-items: center; overflow: hidden; color: var(--muted); text-align: center; background: #ede2d3; }
.sample-image img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; }
.sample-image b { position: absolute; left: 10px; top: 10px; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: rgba(44,41,37,.78); font-size: 12px; }
.sample-body { min-width: 0; padding: 16px; display: flex; flex-direction: column; }
.sample-card-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.sample-card-title small { color: var(--muted); font-size: 9px; letter-spacing: .12em; }
.sample-card-title h3 { margin-top: 4px; font-size: 18px; overflow-wrap: anywhere; }
.sample-card-title p { margin: 3px 0 0; color: var(--brown-dark); }
.sample-spec { color: var(--muted); font-size: 12px; line-height: 1.55; }
.tag-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.tag-row span { padding: 5px 8px; border-radius: 999px; color: #69543e; background: var(--cream); font-size: 10px; }
.sample-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.sample-actions button { padding: 7px 9px; font-size: 11px; }
.empty-state { min-height: 180px; display: grid; place-items: center; align-content: center; gap: 6px; color: var(--muted); border: 1px dashed var(--line); border-radius: 16px; }
.empty-state strong { color: var(--ink); }
.request-list { display: grid; gap: 10px; margin-top: 20px; }
.request-item { display: grid; grid-template-columns: 1.1fr 1.6fr 1.15fr auto auto; gap: 16px; align-items: center; padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: #fffefa; }
.request-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.avatar { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--brown); }
.request-person div, .request-products, .request-contact { min-width: 0; display: grid; gap: 3px; }
.request-item small { color: var(--muted); font-size: 10px; }
.request-item strong, .request-item span { overflow-wrap: anywhere; }
.request-statuses { display: flex; flex-wrap: wrap; gap: 5px; }
.request-statuses span { padding: 6px 8px; border-radius: 999px; color: #69543e; background: var(--cream); font-size: 10px; white-space: nowrap; }
.request-actions { display: flex; gap: 4px; }
.request-actions button { padding: 8px; font-size: 11px; }
.editor-panel { margin-top: 24px; padding: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 18px; background: var(--cream); }
.editor-heading, .editor-actions, .editor-panel > p { grid-column: 1 / -1; }
.editor-heading { display: flex; justify-content: space-between; align-items: flex-start; }
.editor-heading h3 { margin-top: 4px; font-size: 24px; }
.editor-panel label:has(textarea), .editor-panel label:has([type="file"]) { grid-column: 1 / -1; }
.offline-button { background: var(--red); }
.publish-button { background: var(--sage); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px 8px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
th { color: var(--muted); font-weight: 500; }
dialog { width: min(92vw, 620px); border: 1px solid var(--line); border-radius: 20px; padding: 0; background: var(--paper); box-shadow: 0 22px 70px rgba(44,34,24,.3); }
dialog::backdrop { background: rgba(42,34,27,.52); backdrop-filter: blur(3px); }
.detail-dialog { padding: 24px; }
.detail-dialog h3 { margin: 0 0 16px; }
.detail-dialog dl { display: grid; grid-template-columns: 110px 1fr; gap: 10px 14px; margin: 0 0 18px; }
.detail-dialog dd { white-space: pre-wrap; }
.detail-dialog button { justify-self: end; }
.gallery { display: grid; gap: 14px; }
.gallery img { display: block; width: 100%; max-height: 460px; object-fit: contain; border-radius: 14px; background: var(--cream); }
@media (max-width: 980px) {
  .sample-grid { grid-template-columns: 1fr; }
  .request-item { grid-template-columns: 1fr 1.4fr 1fr auto; }
  .request-actions { grid-column: 1 / -1; justify-content: flex-end; }
}
@media (max-width: 760px) {
  .brand-bar { height: 64px; padding: 0 16px; } .brand-context { display: none; }
  .page { width: min(100% - 18px, 1180px); margin-top: 10px; } .card { padding: 20px; border-radius: 17px; }
  .hero { min-height: 190px; } .hero h1 { font-size: 38px; } .hero-seal { display: none; }
  .specs { grid-template-columns: 1fr; } .specs div { border-right: 0; border-bottom: 1px solid var(--line); } .specs div:last-child { border-bottom: 0; }
  .dashboard-stats { width: 100%; grid-template-columns: 1fr 1fr; } .workspace-toolbar { grid-template-columns: 1fr; } .weight-filter { justify-content: flex-start; flex-wrap: wrap; }
  .section-heading { align-items: flex-start; } .section-heading > .toolbar-search { width: 48%; }
  .heading-actions { width: 52%; } .product-actions { width: auto; }
  .request-item { grid-template-columns: 1fr 1fr; } .follow-badge { justify-self: start; }
  .editor-panel { grid-template-columns: 1fr; } .editor-panel > * { grid-column: 1 !important; }
}
@media (max-width: 520px) {
  .brand-lockup strong { font-size: 16px; } .customer-hero { min-height: 210px; } .current-product-head { display: grid; }
  .selected-product { grid-template-columns: minmax(0, 1fr) 62px; } .selected-product > button { grid-column: 1 / -1; }
  .selected-product-info img, .selected-thumb-placeholder { width: 58px; height: 58px; }
  .scan-steps { grid-template-columns: 1fr; } .scanner-input-row { grid-template-columns: 1fr; } .staff-card { display: grid; }
  .workspace-toolbar, .dashboard-stats { grid-template-columns: 1fr 1fr; } .workspace-toolbar > :first-child, .workspace-toolbar .weight-filter, .workspace-toolbar .filter-message { grid-column: 1 / -1; }
  .weight-filter { display: grid; grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr) auto; }
  .weight-filter input { width: 100%; } .weight-filter button { grid-column: 1 / -1; width: 100%; }
  .section-heading { display: grid; } .heading-actions { width: 100%; } .section-heading > .toolbar-search { width: 100%; }
  .heading-actions button { width: 100%; } .product-actions { display: grid; grid-template-columns: 1fr 1fr; } .product-actions button:last-child { grid-column: 1 / -1; }
  .sample-card { grid-template-columns: 112px minmax(0, 1fr); } .sample-image { min-height: 250px; }
  .sample-actions button { flex: 1 1 auto; } .request-item { grid-template-columns: 1fr; }
  .request-actions { grid-column: 1; justify-content: flex-start; } .detail-dialog dl { grid-template-columns: 1fr; }
}

/* UI concept V1: desktop archive, mobile scan flow */
:root { --ink:#1c2932; --muted:#6d777d; --paper:#fff; --cream:#f2f5f4; --cream-deep:#e8eff0; --line:#dce5e7; --brown:#b7622e; --brown-dark:#7c381b; }
body { background-color:var(--cream); background-image:linear-gradient(90deg,rgba(28,41,50,.035) 1px,transparent 1px),linear-gradient(rgba(28,41,50,.035) 1px,transparent 1px); background-size:32px 32px; }
.brand-bar { background:rgba(255,255,255,.95); border-bottom-color:var(--line); }
.site-nav { display:flex; align-items:center; gap:24px; }
.site-nav a { color:var(--muted); text-decoration:none; font-size:12px; transition:color .18s ease, background-color .18s ease; }.site-nav a:hover,.site-nav a:focus-visible { color:var(--brown); }
.site-nav small { display:block; margin-top:3px; color:var(--ink); font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.customer-page { width:min(1180px,calc(100% - 36px)); display:grid; grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr); gap:20px; align-items:start; }
.customer-page > .hero, .customer-page > .staff-card { grid-column:1/-1; }
.card { border-radius:8px; box-shadow:0 18px 50px rgba(31,49,57,.08); }
.customer-hero, .staff-hero { background:linear-gradient(110deg,#fff 0%,#f8fbfa 58%,#dfeaec 100%); align-items:stretch; }
.customer-hero h1, .staff-hero h1 { letter-spacing:-.05em; }.customer-hero h1 em, .staff-hero h1 em { color:var(--brown); font-style:normal; }
.hero-actions { display:flex; align-items:center; gap:18px; margin-top:24px; }.primary-link { display:inline-flex; gap:18px; align-items:center; padding:12px 16px; color:#fff; background:var(--brown); text-decoration:none; font-weight:700; }.hero-note { color:var(--muted); font-size:10px; letter-spacing:.18em; }
.hero-art { width:42%; min-height:220px; position:relative; overflow:hidden; background:linear-gradient(135deg,#d3e3e7,#7c9ba2); }.fabric-stripe { position:absolute; width:150%; height:42px; background:rgba(255,255,255,.48); transform:rotate(-28deg); }.stripe-one { right:-40px; top:55px; }.stripe-two { left:-42px; bottom:45px; background:rgba(28,41,50,.16); }.fabric-label { position:absolute; right:22px; bottom:20px; color:#fff; font-size:18px; letter-spacing:.2em; }.fabric-label small { font-size:8px; letter-spacing:.14em; }
.current-product-layout { display:grid; grid-template-columns:minmax(170px,.8fr) minmax(0,1.2fr); gap:20px; align-items:stretch; }.current-product-visual { min-height:250px; position:relative; overflow:hidden; background:#dce7e8; }.current-product-image { width:100%; height:100%; min-height:250px; display:block; object-fit:cover; }.image-placeholder { display:grid; place-items:center; color:var(--muted); font-size:11px; letter-spacing:.16em; }.current-product-visual > span { position:absolute; left:12px; bottom:12px; color:#fff; font-size:9px; letter-spacing:.13em; text-shadow:0 1px 3px #1c2932; }.current-product-head { border-left:3px solid var(--brown); border-radius:0; background:var(--cream); }.current-product-gallery { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }.current-product-gallery button { padding:0; border:2px solid transparent; border-radius:2px; background:transparent; overflow:hidden; }.current-product-gallery button.is-active { border-color:var(--brown); }.current-product-gallery img { display:block; width:54px; height:54px; object-fit:cover; }
.sample-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.sample-card { grid-template-columns:1fr; border-radius:4px; background:#fff; }.sample-image { min-height:150px; background:#dfe8e9; }.sample-body { padding:12px; }.sample-card-title h3 { font-size:16px; }.sample-spec { font-size:11px; }.tag-row { margin-bottom:9px; }.tag-row span { border:1px solid var(--line); border-radius:0; color:#52646b; background:var(--cream); }.field-hint { color:var(--muted); font-size:11px; font-weight:400; }
@media (max-width:1100px) { .sample-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:980px) { .customer-page { grid-template-columns:1fr; }.sample-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .site-nav { display:none; }.customer-page { display:block; width:min(100% - 18px,1180px); }.customer-page > .card { margin-bottom:12px; }.hero-art { display:none; }.card { border-radius:8px; } }
@media (max-width:520px) { .current-product-layout { grid-template-columns:1fr; }.current-product-visual,.current-product-image { min-height:210px; }.sample-card { grid-template-columns:112px minmax(0,1fr); } }

/* Landing archive matching the approved design board */
.catalog-panel { grid-column:1/-1; padding:28px; background:var(--paper); border:1px solid var(--line); box-shadow:0 18px 50px rgba(31,49,57,.08); }
.catalog-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:24px; }.catalog-heading h2 { margin:5px 0 8px; font-size:clamp(28px,4vw,46px); letter-spacing:-.05em; }.catalog-heading p:not(.eyebrow) { margin:0; color:var(--muted); }
.catalog-filters { display:flex; gap:8px; flex-wrap:wrap; padding-bottom:18px; border-bottom:1px solid var(--line); }.catalog-filters button { border:1px solid var(--line); border-radius:2px; padding:11px 15px; color:var(--muted); background:var(--cream); font-size:12px; }.catalog-filters button.is-active { color:#fff; border-color:var(--brown); background:var(--brown); }
.catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding-top:18px; }.catalog-item { overflow:hidden; border:1px solid var(--line); background:#fff; }.catalog-item > img,.catalog-no-image { display:block; width:100%; height:220px; object-fit:cover; background:#dfe8e9; }.catalog-no-image { display:grid; place-items:center; color:var(--muted); font-size:11px; letter-spacing:.15em; }.catalog-item-body { padding:15px; }.catalog-item-body h3 { margin:6px 0 4px; font-size:21px; }.catalog-item-body p { margin:0 0 4px; color:var(--ink); }.catalog-item-body small { color:var(--muted); }.catalog-item-body button { display:block; width:100%; margin-top:15px; border-radius:2px; padding:10px; font-size:12px; }.catalog-loading,.catalog-empty { min-height:180px; display:grid; place-items:center; align-content:center; color:var(--muted); text-align:center; }
@media (max-width:760px) { .catalog-panel { padding:20px; }.catalog-heading { display:block; }.catalog-heading .primary-link { margin-top:18px; width:100%; justify-content:center; }.catalog-filters { flex-wrap:nowrap; overflow-x:auto; margin-right:-20px; padding-right:20px; }.catalog-filters button { flex:none; }.catalog-grid { grid-template-columns:1fr; }.catalog-item > img,.catalog-no-image { height:230px; } }
.catalog-image-button { display:block; width:100%; padding:0; border:0; border-radius:0; background:transparent; }.catalog-image-button:hover { transform:none; background:transparent; }.catalog-detail-dialog { width:min(920px,calc(100vw - 32px)); border:0; padding:0; border-radius:8px; overflow:hidden; background:var(--paper); box-shadow:0 30px 90px rgba(20,31,38,.35); }.catalog-detail-dialog::backdrop { background:rgba(17,27,33,.5); backdrop-filter:blur(8px); }.detail-sheet-head { display:flex; justify-content:space-between; align-items:center; padding:18px 22px; border-bottom:1px solid var(--line); }.detail-close { padding:2px 10px; color:var(--ink); background:transparent; font-size:24px; font-weight:400; }.detail-sheet-main { display:grid; grid-template-columns:minmax(260px,1fr) minmax(280px,.9fr); gap:24px; padding:22px; }.detail-sheet-image { min-height:340px; background:var(--cream); }.detail-sheet-image img { width:100%; height:100%; min-height:340px; display:block; object-fit:cover; }.detail-sheet-info h2 { margin:7px 0 4px; font-size:38px; }.detail-sheet-info > p:not(.eyebrow) { margin:0 0 18px; color:var(--muted); }.detail-specs { display:grid; grid-template-columns:1fr; gap:0; border-top:1px solid var(--line); }.detail-specs div { padding:12px 0; border-bottom:1px solid var(--line); }.detail-specs dt { font-size:11px; }.detail-specs dd { margin:3px 0 0; }.detail-sheet-actions { display:grid; gap:8px; margin-top:22px; }.detail-thumbs { display:flex; gap:8px; padding:0 22px 22px; overflow:auto; }.detail-thumbs img { width:64px; height:64px; flex:none; object-fit:cover; border:1px solid var(--line); }.is-navigating { animation:page-blur-out .2s ease forwards; pointer-events:none; } @keyframes page-blur-out { to { opacity:.35; filter:blur(5px); transform:scale(.99); } }
@media (max-width:760px) { .catalog-detail-dialog { width:100%; max-width:none; margin:0; margin-top:auto; border-radius:18px 18px 0 0; }.detail-sheet-main { grid-template-columns:1fr; gap:14px; padding:18px; }.detail-sheet-image,.detail-sheet-image img { min-height:220px; height:220px; }.detail-sheet-info h2 { font-size:32px; }.detail-thumbs { padding:0 18px 18px; }.detail-sheet-actions { position:sticky; bottom:0; padding-top:8px; background:var(--paper); }.detail-sheet-actions button:first-child { min-height:50px; } }

/* Approved archive direction — customer page only */
.customer-site {
  --archive-ink:#191d20; --archive-muted:#74777a; --archive-copper:#b85d28;
  --archive-copper-dark:#8e3c18; --archive-paper:#fff; --archive-mist:#f4f4f2;
  margin:0; color:var(--archive-ink); background:#ecebe7;
  background-image:none; font-family:"Helvetica Neue","PingFang SC","Microsoft YaHei",Arial,sans-serif;
}
.customer-site * { box-sizing:border-box; }
.archive-header { width:min(1320px,calc(100% - 48px)); height:82px; position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; margin:0 auto; padding:0 38px; border-bottom:1px solid #ddd; background:rgba(255,255,255,.96); backdrop-filter:blur(16px); }
.archive-logo { display:flex; align-items:baseline; gap:12px; color:var(--archive-copper-dark); text-decoration:none; }
.archive-logo strong { font-size:28px; font-weight:500; letter-spacing:.01em; }
.archive-logo span { font-family:serif; font-size:18px; }
.archive-nav { display:flex; align-items:center; gap:34px; }
.archive-nav a { position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; padding:26px 12px 20px; color:#444; text-decoration:none; font-size:12px; white-space:nowrap; transition:color .18s ease, background-color .18s ease; }
.archive-nav a small { font-size:8px; letter-spacing:.08em; }
.archive-nav a::after { content:""; height:2px; position:absolute; right:50%; bottom:15px; left:50%; background:var(--archive-copper); transition:.22s ease; }
.archive-nav a:hover,.archive-nav a:focus-visible { color:#fff; background:var(--archive-copper); }
.archive-nav a:hover small,.archive-nav a:focus-visible small { color:#fff; }
.archive-nav a:hover::after,.archive-nav a:focus-visible::after,.archive-nav a.is-current::after { right:0; left:0; }
.mobile-menu-button { display:none; }
.archive-main { width:100%; margin:0 0 70px; background:var(--archive-paper); box-shadow:none; }
.archive-hero { min-height:500px; position:relative; overflow:hidden; background:#dfe4e3; }
.archive-hero > img { width:100%; height:100%; position:absolute; inset:0; display:block; object-fit:cover; object-position:center 52%; }
.archive-hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(251,250,246,.96) 0%,rgba(251,250,246,.8) 27%,rgba(251,250,246,.12) 60%,rgba(251,250,246,0) 100%); }
.archive-hero-copy { width:min(540px,48%); position:relative; z-index:1; padding:72px 0 48px 62px; }
.archive-eyebrow { margin:0; color:var(--archive-copper); font-size:11px; font-weight:700; letter-spacing:.22em; }
.archive-hero h1 { margin:18px 0 8px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(46px,5.2vw,76px); font-weight:400; line-height:.91; letter-spacing:-.045em; }
.archive-title-cn { display:inline-flex; align-items:center; gap:12px; margin:4px 0 24px; color:var(--archive-copper-dark); font-size:14px; letter-spacing:.2em; }
.archive-title-cn::before { content:""; width:44px; height:2px; background:var(--archive-copper); }
.archive-manifesto { margin:0; color:#6f7477; font-size:12px; line-height:1.6; letter-spacing:.22em; }
.archive-workspace { display:grid; grid-template-columns:minmax(0,1fr) 300px; align-items:stretch; border-top:12px solid #fff; }
.archive-catalog { min-width:0; padding:26px 26px 34px 38px; }
.archive-section-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:18px; }
.archive-section-head h2 { margin:4px 0 0; font-family:Georgia,"Songti SC",serif; font-size:27px; font-weight:400; }
.archive-section-head h2 small { margin-left:8px; color:#777; font-family:Arial,sans-serif; font-size:11px; font-weight:400; letter-spacing:.12em; text-transform:uppercase; }
.archive-section-head > p { max-width:260px; margin:0; color:var(--archive-muted); font-size:11px; line-height:1.55; text-align:right; }
.customer-site .catalog-filters { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; overflow:visible; margin:0; padding:0 0 18px; border-bottom:1px solid #e7e5e1; }
.customer-site .catalog-filters button { min-width:0; display:flex; align-items:center; justify-content:center; gap:8px; padding:13px 8px; border:0; border-radius:7px; color:#5c5c5c; background:#f3f2f0; font-size:14px; font-weight:500; }
.customer-site .catalog-filters button small { font-size:9px; font-weight:400; letter-spacing:.08em; }
.customer-site .catalog-filters button { flex-direction:column; gap:3px; line-height:1.2; }
.customer-site .catalog-filters button small { display:block; }
.customer-site .catalog-filters button.is-active { color:#fff; background:linear-gradient(135deg,var(--archive-copper),#c57440); box-shadow:0 8px 18px rgba(184,93,40,.18); }
.customer-site .catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; padding-top:18px; }
.customer-site .catalog-item { min-width:0; overflow:hidden; border:1px solid #e4e2de; background:#fff; transition:transform .2s ease,box-shadow .2s ease; }
.customer-site .catalog-item:hover { transform:translateY(-3px); box-shadow:0 16px 26px rgba(49,40,32,.1); }
.customer-site .catalog-image-button { height:190px; position:relative; overflow:hidden; }
.customer-site .catalog-image-button img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .35s ease; }
.customer-site .catalog-item:hover .catalog-image-button img { transform:scale(1.025); }
.card-index { position:absolute; right:8px; bottom:8px; padding:4px 7px; color:#fff; background:rgba(20,20,20,.68); font-size:9px; letter-spacing:.1em; }
.customer-site .catalog-no-image { width:100%; height:100%; display:grid; place-items:center; align-content:center; gap:7px; color:#8c8a85; background:linear-gradient(135deg,#eeeae4,#d9e2e1); }
.customer-site .catalog-no-image span { font-family:Georgia,serif; font-size:20px; letter-spacing:.12em; }
.customer-site .catalog-no-image small { font-size:8px; letter-spacing:.15em; }
.customer-site .catalog-item-body { padding:12px 12px 14px; }
.customer-site .sample-label { display:block; color:var(--archive-copper-dark); font-size:12px; font-weight:750; letter-spacing:.04em; }
.customer-site .catalog-item-body h3 { min-height:22px; margin:5px 0 3px; overflow:hidden; color:var(--ink); font-family:Georgia,"Songti SC",serif; font-size:20px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.customer-site .catalog-item-body p { min-height:17px; margin:0 0 4px; overflow:hidden; color:#333; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.customer-site .catalog-item-body > small { display:flex; align-items:center; gap:7px; color:#888; font-size:9px; }
.customer-site .catalog-item-body > small i { width:1px; height:10px; background:#d5d2cc; }
.customer-site .catalog-item-body > button { width:100%; display:flex; justify-content:space-between; margin-top:11px; padding:9px 10px; border:1px solid #e0d7cf; border-radius:0; color:var(--archive-copper-dark); background:#fff; font-size:10px; }
.sample-desk { min-width:0; position:relative; padding:28px 22px 160px; border-left:1px solid #e7e4df; background:#f7f6f3; }
.sample-desk-head { padding-bottom:16px; border-bottom:1px solid #dedbd5; }
.sample-desk-head h2 { margin:4px 0 1px; color:var(--archive-copper); font-family:Georgia,"Songti SC",serif; font-size:28px; font-weight:400; }
.sample-desk-head > small { color:#777; font-size:9px; letter-spacing:.15em; }
.desk-products { display:grid; gap:8px; padding:16px 0; }
.desk-empty { margin:0; padding:30px 8px; color:#888; font-size:12px; line-height:1.7; text-align:center; }
.desk-item { display:grid; grid-template-columns:46px minmax(0,1fr) 24px; gap:9px; align-items:center; padding:8px; border:1px solid #e3dfd9; background:#fff; }
.desk-item img,.desk-thumb-placeholder { width:46px; height:46px; display:grid; place-items:center; object-fit:cover; color:#fff; background:#9b8d7f; font-size:10px; }
.desk-item div { min-width:0; display:grid; gap:4px; }
.desk-item strong,.desk-item small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.desk-item strong { font-size:10px; }.desk-item small { color:#888; font-size:8px; }
.desk-item button { padding:2px; color:#888; background:transparent; font-size:18px; font-weight:400; }
.desk-submit { width:100%; display:flex; justify-content:space-between; margin-top:4px; padding:14px 16px; border-radius:0; background:var(--archive-copper); }
.desk-submit:disabled { color:#999; background:#e5e1dc; cursor:not-allowed; }
.desk-quote { position:absolute; right:0; bottom:0; left:0; min-height:130px; display:flex; align-items:flex-end; padding:24px 22px; color:#7b7b77; background:linear-gradient(135deg,#e9e4dd,#c7d3d3); font-family:Georgia,serif; font-size:12px; line-height:1.45; letter-spacing:.12em; }
.catalog-loading,.catalog-empty { grid-column:1/-1; min-height:250px; display:grid; place-items:center; align-content:center; gap:12px; color:#858585; background:#faf9f7; text-align:center; }
.catalog-loading span { width:28px; height:28px; border:2px solid #ddd; border-top-color:var(--archive-copper); border-radius:50%; animation:archive-spin .8s linear infinite; }
.catalog-loading p,.catalog-empty small { margin:0; font-size:11px; }.catalog-empty strong { font-family:Georgia,serif; font-size:20px; font-weight:400; }
@keyframes archive-spin { to { transform:rotate(360deg); } }
.showroom-strip { display:grid; grid-template-columns:.8fr 1.2fr; align-items:stretch; border-top:1px solid #e5e2dc; }
.showroom-strip > div { display:flex; flex-direction:column; justify-content:center; padding:52px 48px; background:#f3f1ed; }
.showroom-strip h2,.archive-facts h2 { margin:10px 0 12px; font-family:Georgia,"Songti SC",serif; font-size:34px; font-weight:400; line-height:1.15; }
.showroom-strip p:not(.archive-eyebrow),.archive-facts > p:last-child { margin:0; color:#6e6e6a; font-size:13px; line-height:1.8; }
.showroom-strip img { width:100%; height:360px; display:block; object-fit:cover; object-position:center; }
.archive-facts { padding:52px 48px; border-top:1px solid #e5e2dc; background:#fff; }
.archive-facts > p:last-child { max-width:720px; }
.request-panel,.scan-product { margin:0; padding:42px 48px; border-top:1px solid #dedbd6; background:#fff; }
.request-panel[hidden],.scan-product[hidden] { display:none !important; }
.request-panel-head { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:24px; }
.request-panel-head h2 { margin:6px 0 0; font-family:Georgia,"Songti SC",serif; font-size:34px; font-weight:400; }
.request-panel-head > button { padding:0 10px; color:#333; background:transparent; font-size:30px; font-weight:300; }
.customer-site .selection-card { margin:0 0 24px; border-radius:0; background:#f6f4f1; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.form-grid .span-two { grid-column:1/-1; }
.customer-site input,.customer-site textarea { border-radius:0; background:#fff; }
.request-submit { width:100%; margin-top:18px; border-radius:0; background:var(--archive-copper); }
.catalog-detail-dialog { max-height:min(820px,calc(100vh - 48px)); }
.catalog-detail-dialog[open] { display:block; animation:dialog-in .2s ease-out; }
.catalog-detail-dialog::backdrop { background:rgba(23,22,20,.48); backdrop-filter:blur(7px); }
@keyframes dialog-in { from { opacity:0; transform:translateY(12px) scale(.985); } }
.sheet-handle { display:none; }
.detail-sheet-head { background:#fff; }
.detail-sheet-image { height:440px; }
.detail-sheet-image img { height:440px; object-fit:contain; background:#f7f6f3; }
.detail-sheet-info h2 { overflow-wrap:anywhere; font-family:Georgia,"Songti SC",serif; font-size:32px; font-weight:400; }
.detail-specs dt { color:#777; }.detail-specs dt small { margin-left:7px; font-size:8px; letter-spacing:.1em; }.detail-specs dd { font-size:14px; }
.detail-sheet-actions button { border-radius:0; }.detail-sheet-actions button:first-child { display:flex; justify-content:space-between; background:var(--archive-copper); }.detail-sheet-actions button span { font-size:9px; font-weight:400; letter-spacing:.08em; }
.detail-thumbs button { padding:0; border:2px solid transparent; border-radius:0; background:transparent; }.detail-thumbs button.is-active { border-color:var(--archive-copper); }
.detail-thumbs img { width:68px; height:68px; border:0; border-radius:0; }

@media (max-width:900px) {
  .archive-nav { gap:18px; }.archive-workspace { grid-template-columns:minmax(0,1fr) 260px; }
  .customer-site .catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .customer-site { background:#fff; }
  .archive-header { width:100%; height:68px; padding:0 18px; }
  .archive-logo strong { font-size:23px; }.archive-logo span { font-size:15px; }
  .mobile-menu-button { width:42px; height:42px; display:grid; place-content:center; gap:5px; padding:0; border:0; background:transparent; }
  .mobile-menu-button span { width:23px; height:1px; display:block; background:#202326; transition:.2s ease; }
  .archive-nav { position:fixed; top:68px; right:0; left:0; display:grid; gap:0; padding:8px 18px 18px; border-top:1px solid #eee; background:#fff; box-shadow:0 18px 30px rgba(0,0,0,.12); transform:translateY(-125%); visibility:hidden; transition:.22s ease; }
  .archive-nav.is-open { transform:translateY(0); visibility:visible; }
  .archive-nav.is-open a { font-weight:700; }
  .archive-nav a { align-items:flex-start; padding:12px 4px; border-bottom:1px solid #eee; }.archive-nav a::after { display:none; }
  .archive-main { width:100%; margin:0; box-shadow:none; }
  .archive-hero { min-height:325px; }
  .archive-hero > img { object-position:56% center; }
  .archive-hero-shade { background:linear-gradient(90deg,rgba(252,251,248,.9),rgba(252,251,248,.18) 75%); }
  .archive-hero-copy { width:80%; padding:48px 18px 24px; }
  .archive-hero h1 { margin-top:14px; font-size:35px; line-height:.98; }
  .archive-title-cn { margin-bottom:16px; font-size:11px; }.archive-manifesto { font-size:9px; line-height:1.45; }
  .archive-workspace { display:block; border-top:8px solid #fff; }
  .archive-catalog { padding:18px 16px 28px; }
  .archive-section-head { display:block; }.archive-section-head h2 { font-size:25px; }.archive-section-head > p { max-width:none; margin-top:8px; text-align:left; }
  .customer-site .catalog-filters { display:flex; gap:8px; overflow-x:auto; margin-right:-16px; padding-right:16px; scrollbar-width:none; }
  .customer-site .catalog-filters::-webkit-scrollbar { display:none; }
  .customer-site .catalog-filters button { flex:0 0 auto; padding:11px 15px; }
  .customer-site .catalog-grid { grid-template-columns:1fr; gap:18px; }
  .customer-site .catalog-item { display:grid; grid-template-columns:44% 56%; min-height:190px; }
  .customer-site .catalog-image-button { height:100%; min-height:190px; }
  .customer-site .catalog-image-button img { object-fit:cover; }
  .customer-site .catalog-item-body { min-width:0; display:flex; flex-direction:column; justify-content:center; padding:16px; }
  .customer-site .catalog-item-body h3 { min-height:auto; font-size:19px; white-space:normal; }
  .customer-site .catalog-item-body p { white-space:normal; }
  .customer-site .catalog-item-body > button { margin-top:14px; }
  .sample-desk { display:none; }
  .showroom-strip { grid-template-columns:1fr; }.showroom-strip > div,.archive-facts { padding:38px 20px; }.showroom-strip h2,.archive-facts h2 { font-size:29px; }.showroom-strip img { height:250px; }
  .request-panel,.scan-product { padding:28px 18px; }
  .form-grid { grid-template-columns:1fr; }.form-grid .span-two { grid-column:auto; }
  .catalog-detail-dialog { width:100%; max-width:none; max-height:92dvh; margin:0; margin-top:auto; overflow:auto; border-radius:22px 22px 0 0; }
  .catalog-detail-dialog[open] { animation:sheet-in .25s cubic-bezier(.2,.8,.2,1); }
  @keyframes sheet-in { from { opacity:0; transform:translateY(100%); } }
  .sheet-handle { width:42px; height:4px; display:block; margin:9px auto 0; border-radius:99px; background:#d5d3cf; }
  .detail-sheet-head { padding:10px 18px 8px; border-bottom:0; }
  .detail-sheet-main { grid-template-columns:1fr; gap:0; padding:0 18px 18px; }
  .detail-sheet-image,.detail-sheet-image img { height:285px; min-height:285px; }
  .detail-sheet-info { padding-top:16px; }.detail-sheet-info h2 { margin-top:7px; font-size:27px; }
  .detail-specs { grid-template-columns:repeat(3,1fr); }.detail-specs div { padding:11px 7px; }.detail-specs div + div { border-left:1px solid #e5e2dc; }.detail-specs dt small { display:none; }.detail-specs dd { font-size:11px; overflow-wrap:anywhere; }
  .detail-sheet-actions { position:static; grid-template-columns:1fr; padding:0; }.detail-sheet-actions button:first-child { min-height:52px; }
  .detail-thumbs { padding:0 18px 18px; }
}

/* V13.1: lighter staff controls and compact search tools. */
.staff-body {
  --staff-paper:#fffdf9;
  --staff-mist:#fbf8f2;
  --staff-line:#eadfce;
  --staff-ink:#2f2a25;
  --staff-muted:#766f66;
  --staff-coffee:#b85d28;
  --staff-gold:#b19050;
  background:#f8f5ef;
  background-image:linear-gradient(90deg,rgba(184,93,40,.025) 1px,transparent 1px),linear-gradient(rgba(184,93,40,.025) 1px,transparent 1px);
  background-size:30px 30px;
}
.staff-body .card { background:rgba(255,253,249,.97); box-shadow:0 10px 30px rgba(71,48,27,.035); }
.staff-body button,.staff-body .secondary-button { background:#b85d28; }
.staff-body button:hover,.staff-body .secondary-button:hover { background:#983f19; }
.staff-body .brand-mark { background:#b85d28; }
.staff-body .site-nav a:hover,.staff-body .site-nav a:focus-visible { color:#983f19; }
.staff-body .soft-button { color:#8e3c18; background:#faf5ed; border-color:#e8d8c4; }
.staff-body .soft-button:hover { color:#8e3c18; background:#f4eadb; border-color:#d8c0a4; }
.staff-body .section-heading h2::before,.staff-body .staff-workbench-title::before { background:#b85d28; }
.staff-body .staff-brand-wordmark { color:#b85d28; }
.staff-body .product-stats { display:flex; flex-wrap:wrap; gap:0 8px; margin:8px 0 14px; color:#84796d; font-size:12px; }
.staff-body .product-stats strong { color:#8e3c18; font-weight:700; }
.staff-body .product-stats span { color:#d6c8b8; }
.staff-body .dashboard-stats { display:none; }
.staff-body .workspace-toolbar { display:block; margin:0 0 18px; }
.staff-body .filter-toggle { display:inline-flex; align-items:center; gap:7px; min-height:32px; padding:6px 10px; border:1px solid #e8d8c4; border-radius:999px; color:#8e3c18; background:#fffdf9; box-shadow:none; font-size:12px; }
.staff-body .filter-toggle:hover { background:#f7eee3; color:#8e3c18; transform:none; }
.staff-body .filter-toggle:first-letter { font-size:18px; }
.staff-body .product-filter-panel { display:grid; grid-template-columns:minmax(240px,1fr) auto; gap:10px; align-items:start; max-width:920px; margin-top:9px; padding:10px; border:1px solid #eadfce; border-radius:10px; background:#fffdf9; }
.staff-body .product-filter-panel[hidden] { display:none; }
.staff-body .product-filter-panel .toolbar-search { min-height:38px; }
.staff-body .product-filter-panel .weight-filter { min-height:38px; padding:3px 5px; }
.staff-body .product-filter-panel .filter-message { grid-column:1 / -1; margin:0; }
.staff-body .sample-actions { gap:6px; }
.staff-body .sample-actions button { min-height:30px; padding:6px 8px; border:1px solid transparent; box-shadow:none; font-size:12px; }
.staff-body .sample-actions .action-primary,.staff-body .sample-actions .action-featured { color:#fff; background:#b85d28; border-color:#b85d28; }
.staff-body .sample-actions .action-neutral { color:#8e3c18; background:#fbf6ee; border-color:#eadbc8; }
.staff-body .sample-actions .action-online { color:#346b56; background:#eef7f1; border-color:#bcdcc8; }
.staff-body .sample-actions .action-offline { color:#b34b3d; background:#fffafa; border-color:#efc1b9; }
.staff-body .sample-actions .action-delete { color:#b34b3d; background:transparent; border-color:transparent; }
.staff-body .sample-actions .action-primary:hover,.staff-body .sample-actions .action-featured:hover { background:#983f19; }
.staff-body .sample-actions .action-neutral:hover { background:#f4eadb; }
.staff-body .sample-actions .action-online:hover { background:#e2f0e7; }
.staff-body .sample-actions .action-offline:hover,.staff-body .sample-actions .action-delete:hover { background:#fff1ef; }
.staff-body .editor-heading { align-items:center; }
.staff-body .editor-close { width:32px; height:32px; padding:0; border:1px solid #eadbc8; border-radius:50%; color:#9a4a2a; background:#fffdf9; box-shadow:none; font-size:22px; line-height:1; }
.staff-body .editor-close:hover { color:#8e3c18; background:#f8eee3; transform:none; }
.staff-body .product-image-preview > div { grid-template-columns:repeat(3,minmax(0,110px)); }
.staff-body .product-image-preview figure { position:relative; margin:0; }
.staff-body .product-image-preview img { width:100%; display:block; }
.staff-body .product-image-preview figure button { position:absolute; top:4px; right:4px; width:24px; height:24px; padding:0; border-radius:50%; color:#fff; background:rgba(119,49,27,.88); font-size:18px; line-height:1; }
.staff-body .product-image-preview figure button:hover { background:#8e3c18; }
@media (max-width:760px) {
  .staff-body .product-stats { margin:8px 0 12px; font-size:11px; }
  .staff-body .filter-toggle { min-height:30px; padding:5px 9px; }
  .staff-body .product-filter-panel { grid-template-columns:1fr; width:100%; padding:8px; }
  .staff-body .product-filter-panel .weight-filter { width:100%; }
  .staff-body .product-image-preview > div { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* Customer product filters, image fill, basket depth and page controls. */
.customer-site .catalog-title-row { display:flex; align-items:center; gap:10px; }
.customer-site .catalog-weight-toggle { width:31px; height:31px; display:grid; place-items:center; padding:0; border:1px solid #d8c6af; border-radius:50%; color:#9a4a20; background:#fffdf9; box-shadow:none; font-size:20px; line-height:1; }
.customer-site .catalog-weight-toggle:hover { color:#fff; background:#b85d28; transform:none; }
.customer-site .catalog-weight-panel { display:flex; align-items:center; gap:7px; margin:10px 0 2px; padding:8px 10px; border:1px solid #eadfce; background:#fffdf9; font-size:12px; }
.customer-site .catalog-weight-panel[hidden] { display:none; }
.customer-site .catalog-weight-panel label { display:flex; align-items:center; gap:5px; font-size:12px; }
.customer-site .catalog-weight-panel input { width:78px; padding:6px 8px; border-radius:4px; font-size:12px; }
.customer-site .catalog-weight-panel button { padding:6px 10px; border-radius:4px; color:#8e3c18; background:#f5eee6; font-size:12px; }
.customer-site .catalog-image-button { padding:0; background:#f3f1ed; }
.customer-site .catalog-image-button img { width:100%; height:auto; aspect-ratio:auto; display:block; object-fit:contain; background:transparent; }
.customer-site .mobile-basket-button:not([hidden]) { color:#fff; background:#b85d28; box-shadow:0 7px 0 #8e3c18,0 13px 19px rgba(66,38,21,.28); transform:translateY(-7px); }
.customer-site .mobile-basket-button:not([hidden]):active { box-shadow:0 2px 0 #8e3c18,0 5px 9px rgba(66,38,21,.22); transform:translateY(-2px); }
#catalog-pagination { gap:12px; }
#catalog-pagination button { min-width:42px; min-height:34px; padding:6px 12px; border:1px solid #b85d28; border-radius:0; color:#8e3c18; background:#fffaf4; box-shadow:4px 4px 0 #b85d28; font-size:17px; line-height:1; }
#catalog-pagination button:hover:not(:disabled) { color:#fff; background:#b85d28; box-shadow:2px 2px 0 #8e3c18; transform:translate(2px,2px); }
#catalog-pagination button:disabled { box-shadow:none; }
@media (max-width:760px) { .customer-site .catalog-weight-panel { flex-wrap:wrap; } .customer-site .catalog-weight-panel input { width:70px; } .customer-site .catalog-image-button img { aspect-ratio:auto; } }

/* Keep the complete product photo visible in the catalog cards on every screen. */
.customer-site .catalog-image-button img,
.customer-site .catalog-item > img { object-fit:contain; background:#f3f1ed; }

/* Editorial rectangular image system: keep the archive cards quiet and aligned. */
.customer-site .catalog-image-button { border-radius:0; background:#f3f1ed; }
.customer-site .catalog-image-button img { aspect-ratio:4/3; object-fit:cover; object-position:center; }
.customer-site .showcase-image-button { border-radius:0; }
.showroom-gallery { grid-template-columns:1.6fr .7fr; grid-template-rows:1fr 1fr; height:420px; min-height:0; gap:12px; padding:0; }
.showroom-gallery img { height:100%; min-height:0; }
.showroom-gallery img:first-child { grid-row:1 / 3; }
@media (max-width:760px) {
  .showroom-gallery { grid-template-columns:1fr; grid-template-rows:auto; height:auto; gap:8px; padding:8px; }
  .showroom-gallery img:first-child { grid-row:auto; }
  .showroom-gallery img { height:230px; min-height:0; }
}

/* Mobile layouts: product cards remain readable and six showcase images fit in one page. */
@media (max-width:760px) {
  .staff-page .sample-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .staff-page .sample-card { grid-template-columns:1fr; border-radius:4px; }
  .staff-page .sample-image { min-height:0; aspect-ratio:3/2; }
  .staff-page .sample-image img { object-fit:contain; background:#f3f1ed; }
  .staff-page .sample-image b { top:6px; left:6px; width:21px; height:21px; font-size:10px; }
  .staff-page .sample-body { padding:8px; }
  .staff-page .sample-card-title { gap:5px; }
  .staff-page .sample-card-title small { font-size:7px; letter-spacing:.06em; }
  .staff-page .sample-card-title h3 { margin-top:2px; font-size:13px; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .staff-page .sample-card-title p { margin-top:2px; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .staff-page .product-state { padding:4px 6px; font-size:9px; }
  .staff-page .sample-spec { margin:6px 0; font-size:9px; line-height:1.3; }
  .staff-page .tag-row { margin-bottom:5px; gap:4px; }
  .staff-page .tag-row span { padding:3px 5px; font-size:8px; }
  .staff-page .sample-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
  .staff-page .sample-actions button { min-width:0; padding:5px 2px; overflow:hidden; font-size:9px; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
  .customer-site .showcase-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .customer-site .showcase-image-button { border-radius:0 !important; }
  .customer-site .showcase-image-button img { aspect-ratio:4/3; max-height:none; object-fit:contain; }
  .customer-site #catalog-pagination { display:flex; }
}

/* Showroom: three independent photos, never layered or cropped. */
.showroom-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:1fr; height:360px; min-height:0; gap:12px; padding:0; overflow:hidden; }
.showroom-gallery img,
.showroom-gallery img:first-child { grid-row:auto; width:100%; height:100%; min-height:0; aspect-ratio:16/10; object-fit:contain; background:#f3f1ed; transition:transform .35s ease; }
.showroom-gallery img:hover { transform:scale(1.035); }
@media (max-width:760px) {
  .showroom-gallery { grid-template-columns:repeat(3,minmax(82vw,1fr)); grid-template-rows:1fr; height:230px; gap:10px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; padding:0 18px 8px; }
  .showroom-gallery img,
  .showroom-gallery img:first-child { height:210px; scroll-snap-align:start; }
}
.customer-site .catalog-image-button { border-radius:0 !important; }
.customer-site .hero-scan-button { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:58px; width:auto; margin-top:18px; padding:15px 28px; border:1px solid var(--archive-copper); border-radius:0; color:#fff; background:var(--archive-copper); box-shadow:0 8px 18px rgba(174,91,42,.22); font-size:16px; font-weight:700; letter-spacing:.08em; transition:background-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.request-panel-note { margin:6px 0 0; color:#777; font-size:12px; }
.customer-site .hero-scan-button:hover,.customer-site .hero-scan-button:focus-visible { color:#fff; background:var(--brown-dark); box-shadow:0 10px 22px rgba(82,52,35,.24); transform:translateY(-1px); }

/* Six fabrics per page; eight sample-garment boards remain visible. */
#catalog-pagination {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin:34px auto 0;
  color:#735f50;
  font-size:12px;
  letter-spacing:.12em;
}
#catalog-pagination button {
  padding:8px 0;
  border:0;
  border-bottom:1px solid currentColor;
  border-radius:0;
  color:#8e4424;
  background:transparent;
  font:inherit;
  cursor:pointer;
}
#catalog-pagination button:disabled { opacity:.32; cursor:default; }
.showcase-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.showcase-image-button { border:0; background:transparent; }
.showcase-image-button img { max-height:360px; object-fit:contain; background:#fff; }
.customer-site #scan-more { display:inline-flex; align-items:center; justify-content:center; width:auto; min-height:44px; padding:10px 18px; border:1px solid #d9cfc5; border-radius:999px; color:#8e4424; background:transparent; }
@media (max-width:760px) {
  .showcase-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .showcase-image-button img { max-height:176px; }
  #catalog-pagination { gap:14px; margin-top:24px; }
}
@media (max-width:390px) {
  .customer-site .catalog-item { grid-template-columns:41% 59%; }
  .customer-site .catalog-item-body { padding:13px; }.customer-site .catalog-item-body h3 { font-size:17px; }
}
@media (prefers-reduced-motion:reduce) { .customer-site * { scroll-behavior:auto !important; animation-duration:.01ms !important; transition-duration:.01ms !important; } }
.product-image-preview { grid-column:1 / -1; display:grid; gap:8px; padding:10px 0 2px; color:var(--muted); font-size:12px; }
.product-image-preview[hidden] { display:none; }
.product-image-preview > div { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.product-image-preview img { width:100%; aspect-ratio:1; object-fit:cover; border:1px solid var(--line); background:#f5f3ee; cursor:zoom-in; }
.display-category-field { display:grid; gap:10px; margin:0; padding:14px; border:1px solid var(--line); background:#fbfaf7; }
.display-category-field legend { padding:0 4px; font-weight:650; }
.display-category-options { display:flex; flex-wrap:wrap; gap:10px 18px; }
.display-category-options label { display:flex; align-items:center; gap:6px; }
.product-pagination { display:flex; align-items:center; justify-content:flex-start; gap:18px; margin:20px 0 4px; color:var(--muted); font-size:12px; }
.product-pagination button { padding:8px 12px; border:1px solid var(--line); border-radius:999px; color:var(--ink); background:#fff; }
.product-pagination button:disabled { opacity:.35; cursor:default; }
@media (max-width:760px) { .product-image-preview > div { grid-template-columns:repeat(4,minmax(0,1fr)); } }
.staff-page { display:grid; gap:18px; }
.staff-page > .card { margin:0; }
.staff-page .site-nav { gap:26px; }
.staff-page .site-nav a { padding:9px 10px; border-bottom:1px solid transparent; }
.staff-page .site-nav a:hover,.staff-page .site-nav a:focus-visible { background:var(--cream); border-bottom-color:var(--brown); }
.staff-page #login { max-width:760px; }
.staff-page #login h2 { margin-bottom:18px; }
.staff-page #login-form { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:14px; }
.staff-page #login-form button { min-width:128px; }
.staff-page .section-heading { margin-bottom:18px; }
.staff-page .section-heading h2 { letter-spacing:-.03em; }
.staff-page .section-note { margin-top:6px; }
.staff-page .showcase-editor { gap:14px; }
.staff-page .showcase-editor-grid { gap:10px; }
.staff-page .showcase-upload-slot img { aspect-ratio:4/3; }
@media (max-width:760px) { .staff-page #login-form { grid-template-columns:1fr; } .staff-page #login-form button { width:100%; } .staff-page .site-nav { gap:0; } .staff-page .site-nav a { padding:12px 4px; } }

/* Editorial spacing and bottom-sheet interaction. */
.archive-main { display:flex; flex-direction:column; }
.archive-hero { order:1; }
#about { order:2; }
#catalog { order:3; }
#showroom { order:4; display:block; }
#product-showcase { order:5; }
#product, #contact { order:6; }
.showroom-strip > div:first-child { padding:34px 48px 8px; }
.showroom-strip > div:first-child h2 { margin-bottom:0; }
.showroom-gallery { display:grid; grid-template-columns:1fr; gap:0; padding:0; background:#ebe8e2; }
.showroom-gallery img { width:100%; height:auto; min-height:0; aspect-ratio:3/2; object-fit:cover; }
.showcase-heading { margin-bottom:30px; }
.showcase-heading > p { display:none; }
.showcase-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.showcase-image-button { border:0; background:transparent; }
.showcase-image-button img { aspect-ratio:16/9; object-fit:contain; background:#fff; }
.catalog-empty { min-height:120px; }
.customer-site button { border-radius:999px; }
.customer-site .hero-scan-button { width:auto; padding:9px 0; border:0; border-bottom:1px solid var(--archive-copper); background:transparent; color:var(--archive-copper); }
.customer-site .hero-scan-button small { display:none; }
body.is-request-open { overflow:hidden; }
body.is-request-open::before { content:""; position:fixed; inset:0; z-index:90; background:rgba(30,32,31,.22); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.customer-site .request-panel:not([hidden]) { position:fixed; z-index:100; left:50%; bottom:0; transform:translateX(-50%); width:min(900px,calc(100% - 32px)); max-height:88dvh; overflow:auto; margin:0; border-radius:24px 24px 0 0; box-shadow:0 -18px 60px rgba(20,25,24,.2); animation:sheet-rise .28s ease-out; }
@keyframes sheet-rise { from { opacity:0; transform:translate(-50%,100%); } }
.customer-site .request-panel-head > button { width:40px; height:40px; padding:0; border:1px solid #d9cfc5; color:var(--archive-copper-dark); background:transparent; }
@media (max-width:760px) {
  .showroom-strip > div:first-child { padding:24px 18px 8px; }
  .showroom-gallery img { aspect-ratio:3/2; }
  .product-showcase-section { padding-top:34px; padding-bottom:48px; }
  .showcase-grid { grid-template-columns:1fr; gap:20px; }
  .customer-site .request-panel:not([hidden]) { width:100%; max-height:88dvh; border-radius:24px 24px 0 0; }
  .customer-site .hero-scan-button { margin-top:10px; }
}

/* Approved showroom photo set: editorial strip on desktop, touch-friendly stack on mobile. */
.showroom-gallery { display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:10px; min-height:360px; padding:10px; background:#e9e7e2; }
.showroom-gallery img { width:100%; height:100%; min-height:340px; display:block; object-fit:cover; }
.showroom-gallery img:first-child { object-position:center; }
.about-copy { max-width:980px; display:grid; gap:10px; margin-top:18px; color:#555b5d; font-size:14px; line-height:1.9; }
.about-copy p { margin:0; }
.about-copy p:first-child { color:#202326; font-family:Georgia,"Songti SC",serif; font-size:20px; }
.staff-hero .hero-art { background:#dfe8e9; }
.staff-hero .hero-art > img { width:100%; height:100%; position:absolute; inset:0; display:block; object-fit:cover; object-position:center; }
.staff-hero .hero-art::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(20,31,37,.04),rgba(20,31,37,.28)); pointer-events:none; }
.staff-hero .hero-art .fabric-label { z-index:1; text-shadow:0 1px 5px rgba(20,31,37,.5); }
.image-preview-button { width:100%; padding:0; border:0; font:inherit; text-align:inherit; cursor:zoom-in; }
.staff-image-preview { min-height:260px; display:grid; place-items:center; background:#f4f1ea; }
.staff-image-preview img { width:100%; max-height:70vh; display:block; object-fit:contain; }
.staff-image-thumbs { display:flex; gap:8px; overflow:auto; margin:12px 0 16px; }
.staff-image-thumbs button { flex:none; padding:0; border:2px solid transparent; background:transparent; cursor:pointer; }
.staff-image-thumbs button.is-active { border-color:var(--brown); }
.staff-image-thumbs img { width:68px; height:68px; display:block; object-fit:cover; }
.hero-scan-button { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:58px; margin-top:18px; padding:15px 28px; border:1px solid var(--archive-copper); border-radius:0; color:#fff; background:var(--archive-copper); box-shadow:0 8px 18px rgba(174,91,42,.22); font-size:16px; font-weight:700; letter-spacing:.08em; transition:background-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.hero-scan-button:hover,.hero-scan-button:focus-visible { color:#fff; background:var(--brown-dark); box-shadow:0 10px 22px rgba(82,52,35,.24); transform:translateY(-1px); }
.hero-scan-button small { font-size:9px; font-weight:400; letter-spacing:.14em; }
.current-product-visual { height:clamp(170px, 22vw, 290px); min-height:0; }
.current-product-image { width:100%; height:100%; min-height:0; object-fit:contain; background:#f3f1ed; }
.product-showcase-section { padding:52px 48px; border-top:1px solid #e5e2dc; background:#f7f5f1; }
.showcase-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:24px; }
.showcase-heading h2 { margin-top:8px; font-family:Georgia,"Songti SC",serif; font-size:36px; font-weight:400; }
.showcase-heading > p { max-width:360px; color:#777; font-size:13px; }
.showcase-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.showcase-image-button { position:relative; min-width:0; padding:0; border:1px solid #e2ded7; background:#fff; cursor:zoom-in; overflow:hidden; }
.showcase-image-button img { width:100%; aspect-ratio:16/9; display:block; object-fit:contain; background:#fff; transition:transform .35s ease; }
.showcase-image-button:hover img { transform:scale(1.025); }
.showcase-image-button span { position:absolute; right:10px; bottom:10px; padding:4px 7px; color:#fff; background:rgba(28,30,31,.78); font-size:10px; letter-spacing:.12em; }
.showcase-editor { display:grid; gap:18px; }
.showcase-editor-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.showcase-upload-slot { display:grid; gap:8px; color:var(--muted); font-size:12px; }
.showcase-upload-slot img { width:100%; aspect-ratio:16/9; object-fit:contain; border:1px solid var(--line); background:#fff; }
.showcase-upload-slot input { width:100%; font-size:11px; }
@media (max-width:760px) {
  .showroom-gallery { grid-template-columns:1fr; gap:8px; min-height:0; padding:8px; }
  .showroom-gallery img { min-height:0; height:230px; }
  .showroom-gallery img:first-child { height:270px; }
  .about-copy { font-size:13px; line-height:1.8; }
  .about-copy p:first-child { font-size:19px; }
  .hero-scan-button { width:100%; justify-content:space-between; margin-top:16px; }
  .product-showcase-section { padding:38px 18px; }
  .showcase-heading { display:block; }.showcase-heading h2 { font-size:30px; }.showcase-heading > p { margin-top:8px; }
  .showcase-grid { grid-template-columns:1fr; gap:12px; }
  .current-product-visual { height:clamp(170px, 38vw, 260px); }
  .request-panel:not([hidden]) { min-height:calc(100dvh - 74px); }
  .customer-site .request-panel-head { margin-bottom:18px; }
  .customer-site .request-panel-head h2 { font-size:30px; }
  .customer-site .selection-card { padding:0; background:#fff; }
  .customer-site .selection-heading { padding-bottom:12px; border-bottom:1px solid var(--line); }
  .customer-site .selected-products { gap:8px; margin:14px 0 18px; }
  .customer-site .selected-product { grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:10px; border:1px solid var(--line); border-radius:0; background:#fff; }
  .customer-site .selected-product-info img, .customer-site .selected-thumb-placeholder { width:52px; height:52px; }
  .customer-site .selected-product-info strong { font-size:13px; }
  .customer-site #desk-request-button, .customer-site #scan-more { width:100%; min-height:52px; justify-content:space-between; border-radius:999px; }
  .showcase-editor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .staff-hero .hero-art { width:100%; min-height:220px; }
  .staff-image-preview { min-height:200px; }
  .staff-image-preview img { max-height:60vh; }
}
/* Final interaction and responsive polish. */
.about-copy .about-english { margin-top:4px; color:var(--archive-muted); font-size:12px; line-height:1.65; letter-spacing:.01em; }
.customer-site .hero-scan-button { min-height:58px; padding:15px 28px; border:1px solid var(--archive-copper); border-radius:999px; color:#fff; background:var(--archive-copper); box-shadow:0 8px 18px rgba(174,91,42,.22); }
.customer-site .catalog-image-button { border-radius:0 !important; background:#f3f1ed; }
.customer-site .catalog-image-button img { width:100%; height:100%; object-fit:cover; object-position:center; }
.customer-site .showcase-image-button { border-radius:0 !important; }
.showcase-image-button span { display:none !important; }
.showcase-lightbox { width:min(94vw,1200px); max-width:none; max-height:92vh; padding:16px; border:0; border-radius:12px; background:rgba(24,25,25,.94); box-shadow:0 24px 80px rgba(0,0,0,.38); }
.showcase-lightbox::backdrop { background:rgba(18,20,20,.58); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.showcase-lightbox img { display:block; max-width:calc(94vw - 32px); max-height:calc(92vh - 32px); width:auto; height:auto; object-fit:contain; }
.showcase-lightbox-close { position:absolute; top:7px; right:7px; width:34px; height:34px; padding:0; border:1px solid rgba(255,255,255,.35); border-radius:50%; color:#fff; background:rgba(0,0,0,.35); font-size:25px; line-height:1; }
.staff-page .section-heading h2, .staff-page .editor-heading h3 { color:var(--brown-dark); }
.staff-page .staff-hero { min-height:210px; padding:20px 28px; background:radial-gradient(ellipse at 5% 100%, rgba(210,174,104,.17), transparent 34%), linear-gradient(118deg,#f9f0e3 0%,#fffdfa 44%,#fff 100%); }
.staff-page .staff-hero::after { display:none; }
.staff-page .staff-hero > div:first-child { align-self:center; }
.staff-page .staff-hero .hero-art { width:40%; min-height:130px; }
.staff-page .staff-workbench-title { color:var(--brown-dark) !important; font-size:24px !important; font-weight:800 !important; letter-spacing:.04em !important; text-transform:none; }
.staff-page .staff-hero .hero-actions { margin-top:14px; }
.staff-page .staff-brand-wordmark { display:block; width:max-content; margin-top:44px; color:#bd9144; font-size:44px; font-weight:700; letter-spacing:.2em; line-height:1; opacity:.42; text-shadow:0 1px 0 rgba(255,255,255,.8); }
.staff-page .dashboard-stats { width:min(52%,580px); gap:6px; margin:12px 0; }
.staff-page .dashboard-stats article { min-height:58px; padding:9px 10px; border-radius:10px; }
.staff-page .dashboard-stats small { font-size:11px; }
.staff-page .dashboard-stats strong { font-size:22px; }
.display-category-options { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:center; gap:10px 18px; }
.display-category-options label { display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:flex-start; min-width:0; white-space:nowrap; gap:8px; }
.display-category-options input { width:20px !important; min-width:20px; height:20px; margin:0; }
@media (min-width:761px) {
  .customer-site .archive-header { transition:height .24s ease, background-color .24s ease, box-shadow .24s ease; }
  .customer-site .archive-header.nav-collapsed { height:0; border-bottom:0; background:transparent; box-shadow:none; pointer-events:none; }
  .customer-site .archive-header.nav-collapsed .archive-logo { position:fixed; top:14px; right:18px; z-index:60; min-height:46px; padding:10px 14px; border:1px solid rgba(184,93,40,.18); border-radius:999px; background:rgba(255,255,255,.92); box-shadow:0 10px 26px rgba(42,35,28,.14); pointer-events:auto; }
  .customer-site .archive-header.nav-collapsed .archive-logo strong { font-size:16px; }
  .customer-site .archive-header.nav-collapsed .archive-logo span { font-size:14px; }
  .customer-site .archive-header.nav-collapsed .archive-nav { opacity:0; transform:translateY(-110%); pointer-events:none; }
  .customer-site .archive-header.nav-peek .archive-logo { position:fixed; top:14px; right:18px; z-index:60; min-height:46px; padding:10px 14px; border:1px solid rgba(184,93,40,.18); border-radius:999px; background:rgba(255,255,255,.92); box-shadow:0 10px 26px rgba(42,35,28,.14); }
  .customer-site .archive-header.nav-peek .archive-logo strong { font-size:16px; }
  .customer-site .archive-header.nav-peek .archive-logo span { font-size:14px; }
  .customer-site .archive-header.nav-peek { height:0; border-bottom:0; background:transparent; pointer-events:none; }
  .customer-site .archive-header.nav-peek .archive-nav { position:fixed; top:68px; right:18px; z-index:59; display:flex; flex-direction:column; align-items:stretch; gap:0; width:190px; padding:5px 0; border:1px solid rgba(184,93,40,.16); border-radius:14px; background:rgba(255,255,255,.96); box-shadow:0 14px 34px rgba(42,35,28,.16); opacity:1; transform:translateY(0); pointer-events:auto; overflow:hidden; }
  .customer-site .archive-header.nav-peek .archive-nav a { align-items:flex-end; gap:3px; padding:10px 14px; border-bottom:1px solid #eeeae5; color:#444; background:transparent; font-size:12px; }
  .customer-site .archive-header.nav-peek .archive-nav a:last-child { border-bottom:0; }
  .customer-site .archive-header.nav-peek .archive-nav a small { color:#777; font-size:8px; }
  .customer-site .archive-header.nav-peek .archive-nav a:hover,.customer-site .archive-header.nav-peek .archive-nav a:focus-visible { color:#fff; background:var(--archive-copper); }
  .customer-site .archive-nav { transition:opacity .22s ease, transform .22s ease; }
}
@media (max-width:760px) {
  .staff-page .staff-hero { min-height:112px; padding:18px; }
  .staff-page .staff-workbench-title { font-size:20px !important; }
  .staff-page .staff-brand-wordmark { margin-top:24px; font-size:29px; letter-spacing:.16em; opacity:.34; }
  .staff-page #product-management { padding:16px; }
  .staff-page .section-heading-actions-only { display:flex; justify-content:center; margin-bottom:8px; }
  .staff-page .product-actions { width:min(100%,330px); max-width:330px; grid-template-columns:1fr 1fr; gap:6px; }
  .staff-page .product-actions button { min-height:36px; padding:7px 5px; font-size:12px; }
  .staff-page .product-actions button:last-child { grid-column:1 / -1; }
  .staff-page .dashboard-stats { width:min(100%,330px); gap:5px; margin:8px auto 12px; }
  .staff-page .dashboard-stats article { min-height:40px; padding:5px 8px; border-radius:8px; }
  .staff-page .dashboard-stats small { font-size:9px; line-height:1.05; }
  .staff-page .dashboard-stats strong { font-size:18px; line-height:1; }
  .staff-page .workspace-toolbar { width:min(100%,330px); margin:10px auto 16px; gap:7px; }
  .staff-page .workspace-toolbar .toolbar-search { min-height:38px; padding:8px 10px; font-size:12px; }
  .staff-page .weight-filter { gap:5px; padding:5px; border-radius:10px; }
  .staff-page .weight-filter input { min-height:34px; padding:6px 7px; font-size:12px; }
  .staff-page .weight-filter .filter-label { padding-left:3px; font-size:11px; }
  .staff-page .weight-filter button { min-height:34px; padding:6px 8px; font-size:12px; }
  .display-category-options { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; }
}

/* V13 backend-only visual system: customer-facing pages remain unchanged. */
.staff-body {
  --staff-paper:#fffdf8;
  --staff-mist:#f6f0e7;
  --staff-line:#e8dfd2;
  --staff-ink:#2b2824;
  --staff-muted:#766f66;
  --staff-coffee:#69533d;
  --staff-gold:#b19050;
  min-height:100vh;
  color:var(--staff-ink);
  background:#f5efe6;
  background-image:radial-gradient(ellipse at 8% 10%, rgba(234,218,190,.58), transparent 27%), linear-gradient(118deg,#f5eee5 0%,#f8f4ec 48%,#f3eee5 100%);
}
.staff-body .brand-bar {
  height:74px;
  padding:0 max(34px,calc((100% - 1440px)/2));
  border-bottom:1px solid var(--staff-line);
  background:rgba(255,253,248,.92);
  box-shadow:0 1px 0 rgba(105,83,61,.03);
}
.staff-body .brand-lockup { color:var(--staff-ink); gap:11px; }
.staff-body .brand-lockup strong { font-size:19px; letter-spacing:.08em; }
.staff-body .brand-mark { width:40px; height:40px; border-radius:50% 50% 50% 13px; background:var(--staff-coffee); box-shadow:none; }
.staff-body .site-nav { gap:30px; }
.staff-body .site-nav a { position:relative; padding:27px 1px 24px; color:#5f5a53; font-size:13px; }
.staff-body .site-nav a::after { content:""; position:absolute; right:50%; bottom:15px; left:50%; height:2px; background:var(--staff-gold); transition:.2s ease; }
.staff-body .site-nav a:hover,.staff-body .site-nav a:focus-visible { color:var(--staff-coffee); background:transparent; border-bottom-color:transparent; }
.staff-body .site-nav a:hover::after,.staff-body .site-nav a:focus-visible::after { right:0; left:0; }
.staff-body .page { width:min(1440px,calc(100% - 56px)); margin:24px auto 70px; }
.staff-body .staff-page { gap:18px; }
.staff-body .card {
  margin-bottom:0;
  padding:30px;
  border:1px solid var(--staff-line);
  border-radius:14px;
  background:rgba(255,253,248,.94);
  box-shadow:0 12px 32px rgba(80,62,43,.055);
}
.staff-body .staff-hero {
  min-height:258px;
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(420px,.96fr);
  gap:0;
  padding:0;
  border-radius:14px;
  background:linear-gradient(110deg,#f6eee3 0%,#fcfaf6 62%,#eee3d5 100%);
}
.staff-body .staff-hero > div:first-child {
  position:relative;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:40px 48px;
  overflow:hidden;
}
.staff-body .staff-workbench-title {
  color:var(--staff-ink) !important;
  font-size:31px !important;
  font-weight:760 !important;
  letter-spacing:-.035em !important;
  line-height:1.15;
}
.staff-body .staff-workbench-title::before { content:""; display:inline-block; width:4px; height:29px; margin:0 13px -5px 0; background:var(--staff-gold); }
.staff-body .staff-hero .hero-actions { margin-top:13px; }
.staff-body .staff-hero .hero-note { color:var(--staff-muted); font-size:13px; letter-spacing:.06em; }
.staff-body .staff-brand-wordmark {
  position:absolute;
  left:45px;
  bottom:28px;
  margin:0;
  color:var(--staff-gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(54px,7vw,94px);
  font-weight:400;
  letter-spacing:.02em;
  line-height:.8;
  opacity:.12;
  pointer-events:none;
}
.staff-body .staff-hero .hero-art { width:auto; min-height:258px; overflow:hidden; }
.staff-body .staff-hero .hero-art::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(246,238,227,.24),transparent 38%,rgba(42,32,22,.08)); pointer-events:none; }
.staff-body .staff-hero .hero-art img { width:100%; height:100%; min-height:258px; object-fit:cover; object-position:center; }
.staff-body .staff-hero .fabric-label { right:28px; bottom:24px; color:#fff; font-size:20px; text-shadow:0 1px 8px rgba(35,26,18,.55); }
.staff-body .staff-hero .fabric-label small { font-size:9px; letter-spacing:.12em; }
.staff-body .section-heading h2,.staff-body .editor-heading h3 { color:var(--staff-ink); }
.staff-body .section-heading h2 { display:flex; align-items:center; gap:12px; font-size:25px; }
.staff-body .section-heading h2::before { content:""; width:4px; height:26px; background:var(--staff-gold); }
.staff-body .section-note { color:var(--staff-muted); }
.staff-body input,.staff-body textarea,.staff-body select { border-color:var(--staff-line); background:#fffefa; }
.staff-body input:focus,.staff-body textarea:focus,.staff-body select:focus { outline-color:rgba(177,144,80,.18); border-color:var(--staff-gold); }
.staff-body button,.staff-body .secondary-button { border-radius:7px; background:var(--staff-coffee); box-shadow:none; }
.staff-body button:hover,.staff-body .secondary-button:hover { background:#51402f; box-shadow:none; }
.staff-body .soft-button { border:1px solid var(--staff-line); color:var(--staff-coffee); background:#f6f0e7; }
.staff-body .soft-button:hover { border-color:#d7c8b5; color:var(--staff-coffee); background:#eee4d6; }
.staff-body .outline-danger,.staff-body .text-danger { background:transparent; box-shadow:none; }
.staff-body .dashboard-stats { width:min(100%,620px); margin:18px 0 16px; gap:8px; }
.staff-body .dashboard-stats article { min-height:62px; border-color:var(--staff-line); border-radius:8px; background:#fbf6ee; }
.staff-body .dashboard-stats strong { color:var(--staff-coffee); }
.staff-body .weight-filter { border-color:var(--staff-line); border-radius:8px; background:#fbf7f0; }
.staff-body .filter-label { color:var(--staff-coffee); }
.staff-body .sample-card,.staff-body .request-item { border-color:var(--staff-line); border-radius:10px; background:#fffdf9; }
.staff-body .sample-image { background:#f1e9dd; }
.staff-body .sample-actions button { border-radius:6px; }
.staff-body .tag-row span,.staff-body .request-statuses span { color:#69533d; background:#f7f0e7; }
.staff-body .editor-panel { border-color:var(--staff-line); border-radius:10px; background:#f8f3eb; }
.staff-body .product-pagination button { border-color:var(--staff-line); background:#fffdf9; color:var(--staff-coffee); }
.staff-body .audit-table div { border-color:var(--staff-line); }
@media (max-width:760px) {
  .staff-body .brand-bar { height:66px; padding:0 18px; }
  .staff-body .site-nav { gap:0; }
  .staff-body .site-nav a { padding:12px 4px; font-size:11px; }
  .staff-body .site-nav a::after { bottom:7px; }
  .staff-body .page { width:min(100% - 20px,1440px); margin:12px auto 42px; }
  .staff-body .card { padding:18px; border-radius:12px; }
  .staff-body .staff-hero { grid-template-columns:1fr; min-height:0; }
  .staff-body .staff-hero > div:first-child { min-height:152px; padding:28px 24px; }
  .staff-body .staff-workbench-title { font-size:25px !important; }
  .staff-body .staff-brand-wordmark { left:22px; bottom:16px; font-size:58px; }
  .staff-body .staff-hero .hero-art,.staff-body .staff-hero .hero-art img { min-height:150px; height:150px; }
  .staff-body .staff-hero .fabric-label { right:18px; bottom:15px; font-size:17px; }
  .staff-body .section-heading h2 { font-size:22px; }
}
@media (min-width:761px) {
  .customer-site .catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
}
@media (max-width:760px) {
  .customer-site .catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px; }
  .customer-site .catalog-item { display:block; min-height:0; }
  .customer-site .catalog-image-button { height:auto; min-height:0; aspect-ratio:4/3; }
  .customer-site .catalog-item-body { display:block; padding:10px; }
  .customer-site .catalog-item-body h3 { font-size:15px; line-height:1.15; }
  .customer-site .catalog-item-body p { margin:5px 0 0; font-size:11px; }
  .customer-site .catalog-item-body small { display:block; margin-top:5px; font-size:9px; }
  .customer-site .catalog-item-body > button { margin-top:9px; padding:8px 6px; font-size:10px; }
  .customer-site .basket-toggle { display:flex !important; align-items:center; gap:5px; margin-top:7px; font-size:10px; white-space:nowrap; }
  .customer-site .basket-toggle input { width:16px !important; min-width:16px; height:16px; margin:0; }
  .customer-site .catalog-filters { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; max-width:100%; gap:7px; overflow:visible; margin-right:0; padding-right:0; }
  .customer-site .catalog-filters button { width:100%; min-width:0; padding:9px 3px; gap:4px; font-size:11px; }
  .customer-site .catalog-filters button small { font-size:7px; }
}
/* Mobile showroom: three complete photos stacked, without cropped strips or a centered orphan image. */
.customer-site .showroom-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:none; height:auto; min-height:0; gap:12px; padding:0; background:transparent; overflow:visible; }
.customer-site .showroom-gallery img,
.customer-site .showroom-gallery img:first-child { width:100%; height:auto; min-height:0; aspect-ratio:3/2; object-fit:contain; object-position:center; background:#f3f1ed; }
@media (max-width:760px) {
  .customer-site .showroom-gallery { grid-template-columns:1fr; gap:12px; }
  .customer-site .showroom-gallery img,
  .customer-site .showroom-gallery img:first-child { width:100%; height:auto; aspect-ratio:3/2; }
}
/* Readability, compact product cards and framed gallery. */
.customer-site { --archive-muted:#5f6467; }
.customer-site .archive-nav a { font-size:14px; font-weight:550; }
.customer-site .archive-nav a small { font-size:9px; }
.customer-site .about-copy { max-width:1040px; gap:14px; color:#3f4447; font-size:15px; line-height:1.75; }
.customer-site .about-copy p:first-child { font-size:21px; font-weight:600; }
.customer-site .archive-eyebrow { font-size:10px; letter-spacing:.16em; }
.customer-site .archive-facts { padding:48px clamp(24px,5vw,72px); }
.customer-site .archive-facts h2 { margin:8px 0 14px; font-size:clamp(30px,3.2vw,38px); }
.customer-site .about-highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; max-width:820px; }
.customer-site .about-highlights { grid-template-columns:repeat(4,minmax(0,1fr)); max-width:1040px; }
.customer-site .about-highlights > div { display:flex; align-items:baseline; gap:10px; min-width:0; padding:12px 14px; border-left:2px solid #b85d28; background:#f6f4f0; }
.customer-site .about-highlights strong { color:#8e3c18; font-size:19px; white-space:nowrap; }
.customer-site .about-highlights span { color:#4f5558; font-size:13px; }
.customer-site .about-details { margin-top:14px; max-width:820px; border-top:1px solid #e6e1d9; }
.customer-site .about-details summary { padding:12px 0 2px; color:#8e3c18; font-size:13px; cursor:pointer; }
.customer-site .about-details summary small { margin-left:8px; color:#666b6e; font-size:9px; letter-spacing:.12em; }
.customer-site .about-details-copy { display:grid; gap:8px; padding-top:8px; }
.customer-site .about-details-copy p { margin:0; color:#42474a; font-size:14px; line-height:1.7; }
.customer-site .about-details-copy .about-english { color:#555b5e; font-size:13px; }
.customer-site .archive-hero-copy { width:min(500px,45%); padding-top:60px; }
.customer-site .archive-hero h1 { font-size:clamp(42px,4.6vw,66px); line-height:.98; }
.customer-site .archive-title-cn { margin:8px 0 18px; }
.customer-site .catalog-image-button { height:auto; aspect-ratio:16/10; padding:5px; border:1px solid #c9bca9; background:linear-gradient(145deg,#f2eee7,#e7e3dc); box-shadow:inset 0 0 0 1px rgba(255,255,255,.8); }
.customer-site .catalog-image-button img { width:100%; height:100%; object-fit:contain; background:#ece9e3; }
.customer-site .catalog-item-body { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; padding:12px 14px 13px; }
.customer-site .catalog-item-body .sample-label { color:#8e3c18; font-size:11px; }
.customer-site .catalog-item-body h3 { min-height:0; margin:0; font-size:22px; line-height:1.2; }
.customer-site .catalog-item-body .pattern-number { min-height:0; margin:0; color:#41474b; font-size:14px; }
.customer-site .product-specs { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:8px; margin:3px 0; padding:8px 0; border-top:1px solid #eee9e2; border-bottom:1px solid #eee9e2; }
.customer-site .product-specs span { min-width:0; display:grid; gap:3px; }
.customer-site .product-specs small { color:#656a6d; font-size:10px; }
.customer-site .product-specs b { overflow:hidden; color:#303639; font-size:12px; font-weight:550; text-overflow:ellipsis; white-space:nowrap; }
.customer-site .basket-toggle { display:inline-flex !important; align-items:center; justify-self:start; gap:10px; width:auto; margin:2px 0; color:#444a4d; font-size:14px; font-weight:550; cursor:pointer; }
.customer-site .basket-toggle input { appearance:none; -webkit-appearance:none; position:relative; width:24px !important; min-width:24px; height:24px; margin:0; border:1.5px solid #aeb2b3; border-radius:6px; background:#fff; cursor:pointer; transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease; }
.customer-site .basket-toggle input:checked { border-color:#a94f20; background:#a94f20; box-shadow:0 2px 7px rgba(169,79,32,.22); }
.customer-site .basket-toggle input:checked::after { content:""; position:absolute; top:4px; left:7px; width:6px; height:11px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.customer-site .catalog-item-body > button { margin-top:3px; padding:10px 11px; color:#783614; font-size:12px; }
.customer-site .showroom-gallery { gap:14px; padding:0; background:transparent; }
.customer-site .showroom-gallery img,
.customer-site .showroom-gallery img:first-child { aspect-ratio:3/2; padding:6px; border:1px solid #b9aa94; background:linear-gradient(145deg,#f4f0e8,#e4ded3); box-shadow:0 8px 22px rgba(45,38,29,.12),inset 0 0 0 1px rgba(255,255,255,.9); object-fit:cover; }
.customer-site .archive-section-head h2 { font-size:30px; }
.customer-site .archive-section-head h2 small { display:block; margin:5px 0 0; color:#5f6467; font-size:10px; }
.mobile-basket-button { display:none; }
@media (min-width:761px) {
  .customer-site .archive-header { position:fixed; top:0; left:50%; margin:0; transform:translateX(-50%); transition:none; }
  .customer-site .archive-main { padding-top:82px; }
  .customer-site .archive-header.nav-collapsed { height:0; min-height:0; overflow:visible; transition:none; }
  .customer-site .archive-header.nav-collapsed .archive-nav { display:none; }
  .customer-site .archive-header.nav-peek .archive-nav { top:66px; right:18px; width:176px; border-color:rgba(142,60,24,.18); border-radius:10px; }
  .customer-site .archive-header.nav-peek .archive-nav a { padding:8px 12px; font-size:12px; }
  .customer-site .archive-header.nav-peek .archive-nav a::after { right:12px; bottom:4px; left:auto; width:0; }
  .customer-site .archive-header.nav-peek .archive-nav a.is-current { color:var(--archive-copper); }
  .customer-site .archive-header.nav-peek .archive-nav a.is-current::after { right:12px; left:auto; width:38px; }
  .customer-site .catalog-item-body { min-height:0; }
}
@media (max-width:760px) {
  .customer-site .archive-facts { padding:26px 18px 22px; }
  .customer-site .archive-facts h2 { margin:6px 0 10px; font-size:27px; }
  .customer-site .about-copy { gap:10px; margin-top:12px; font-size:13px; line-height:1.55; }
  .customer-site .about-copy p:first-child { font-size:17px; }
  .customer-site .about-highlights { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .customer-site .about-highlights > div { display:grid; gap:1px; padding:8px 10px; }
  .customer-site .about-highlights strong { font-size:17px; }
  .customer-site .about-highlights span { font-size:11px; }
  .customer-site .about-details { margin-top:9px; }
  .customer-site .about-details summary { padding-top:9px; font-size:12px; }
  .customer-site .about-details-copy p { font-size:12px; line-height:1.55; }
  .customer-site .about-details-copy .about-english { font-size:11px; line-height:1.5; }
  .customer-site .catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px; }
  .customer-site .catalog-image-button { height:auto; aspect-ratio:16/10; padding:4px; }
  .customer-site .catalog-image-button img { object-fit:contain; }
  .customer-site .catalog-item-body { display:grid; gap:4px; padding:8px 9px 9px; }
  .customer-site .catalog-item-body h3 { font-size:15px; }
  .customer-site .catalog-item-body .pattern-number { font-size:11px; }
  .customer-site .product-specs { gap:4px; padding:5px 0; }
  .customer-site .product-specs small { font-size:9px; }
  .customer-site .product-specs b { font-size:10px; }
  .customer-site .basket-toggle { gap:7px; font-size:11px; }
  .customer-site .basket-toggle input { width:22px !important; min-width:22px; height:22px; }
  .customer-site .showroom-gallery { grid-template-columns:1fr; gap:13px; }
  .customer-site .showroom-gallery img,
  .customer-site .showroom-gallery img:first-child { aspect-ratio:3/2; padding:5px; object-fit:contain; }
  .customer-site .archive-section-head h2 { font-size:26px; }
  .customer-site .archive-section-head h2 small { display:block; margin:3px 0 0; font-size:9px; }
  .customer-site .archive-hero-copy { width:92%; padding:42px 18px 26px; }
  .customer-site .archive-hero h1 { font-size:34px; line-height:1.02; }
  .mobile-basket-button:not([hidden]) { position:fixed; right:16px; bottom:calc(env(safe-area-inset-bottom,0px) + 22px); z-index:70; display:flex; align-items:center; gap:8px; min-height:48px; padding:9px 13px; border:1px solid rgba(255,255,255,.52); border-radius:999px; color:#fff; background:rgba(139,59,24,.94); box-shadow:0 8px 24px rgba(28,30,30,.24); font-size:13px; font-weight:600; }
  .mobile-basket-button svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .mobile-basket-button b { min-width:21px; height:21px; display:grid; place-items:center; border-radius:50%; color:#8e3c18; background:#fff; font-size:11px; }
}

/* V13.1 final overrides: keep the customer archive light, and the staff controls distinct. */
.staff-body { --staff-coffee:#b85d28; --staff-gold:#b19050; background:#f8f5ef; background-image:linear-gradient(90deg,rgba(184,93,40,.025) 1px,transparent 1px),linear-gradient(rgba(184,93,40,.025) 1px,transparent 1px); background-size:30px 30px; }
.staff-body .card { background:rgba(255,253,249,.97); box-shadow:0 10px 30px rgba(71,48,27,.035); }
.staff-body button,.staff-body .secondary-button,.staff-body .brand-mark { background:#b85d28; }
.staff-body button:hover,.staff-body .secondary-button:hover { background:#983f19; }
.staff-body .soft-button { color:#8e3c18; background:#faf5ed; border-color:#e8d8c4; }
.staff-body .soft-button:hover { color:#8e3c18; background:#f4eadb; border-color:#d8c0a4; }
.staff-body .section-heading h2::before,.staff-body .staff-workbench-title::before { background:#b85d28; }
.staff-body .staff-brand-wordmark { color:#b85d28; }
.staff-body .product-stats { display:flex; flex-wrap:wrap; gap:0 8px; margin:8px 0 14px; color:#84796d; font-size:12px; }
.staff-body .product-stats strong { color:#8e3c18; font-weight:700; }.staff-body .product-stats span { color:#d6c8b8; }.staff-body .dashboard-stats { display:none; }
.staff-body .workspace-toolbar { display:block; margin:0 0 18px; }.staff-body .filter-toggle { display:inline-flex; align-items:center; gap:7px; min-height:32px; padding:6px 10px; border:1px solid #e8d8c4; border-radius:999px; color:#8e3c18; background:#fffdf9; box-shadow:none; font-size:12px; }.staff-body .filter-toggle:hover { color:#8e3c18; background:#f7eee3; transform:none; }
.staff-body .product-filter-panel { display:grid; grid-template-columns:minmax(240px,1fr) auto; gap:10px; align-items:start; max-width:920px; margin-top:9px; padding:10px; border:1px solid #eadfce; border-radius:10px; background:#fffdf9; }.staff-body .product-filter-panel[hidden] { display:none; }.staff-body .product-filter-panel .toolbar-search { min-height:38px; }.staff-body .product-filter-panel .filter-message { grid-column:1 / -1; margin:0; }
.staff-body .sample-actions { gap:6px; }.staff-body .sample-actions button { min-height:30px; padding:6px 8px; border:1px solid transparent; box-shadow:none; font-size:12px; }.staff-body .sample-actions .action-primary,.staff-body .sample-actions .action-featured { color:#fff; background:#b85d28; border-color:#b85d28; }.staff-body .sample-actions .action-neutral { color:#8e3c18; background:#fbf6ee; border-color:#eadbc8; }.staff-body .sample-actions .action-online { color:#346b56; background:#eef7f1; border-color:#bcdcc8; }.staff-body .sample-actions .action-offline { color:#b34b3d; background:#fffafa; border-color:#efc1b9; }.staff-body .sample-actions .action-delete { color:#b34b3d; background:transparent; border-color:transparent; }.staff-body .sample-actions .action-primary:hover,.staff-body .sample-actions .action-featured:hover { background:#983f19; }.staff-body .sample-actions .action-neutral:hover { background:#f4eadb; }.staff-body .sample-actions .action-online:hover { background:#e2f0e7; }.staff-body .sample-actions .action-offline:hover,.staff-body .sample-actions .action-delete:hover { background:#fff1ef; }
.staff-body .editor-close { width:32px; height:32px; padding:0; border:1px solid #eadbc8; border-radius:50%; color:#9a4a2a; background:#fffdf9; box-shadow:none; font-size:22px; line-height:1; }.staff-body .editor-close:hover { color:#8e3c18; background:#f8eee3; transform:none; }.staff-body .product-image-preview > div { grid-template-columns:repeat(3,minmax(0,110px)); }.staff-body .product-image-preview figure { position:relative; margin:0; }.staff-body .product-image-preview img { width:100%; display:block; }.staff-body .product-image-preview figure button { position:absolute; top:4px; right:4px; width:24px; height:24px; padding:0; border-radius:50%; color:#fff; background:rgba(119,49,27,.88); font-size:18px; line-height:1; }
.customer-site .catalog-image-button { padding:0; background:#f3f1ed; }.customer-site .catalog-image-button img { width:100%; height:auto; aspect-ratio:auto; display:block; object-fit:contain; background:transparent; }.customer-site .mobile-basket-button:not([hidden]) { color:#fff; background:#b85d28; box-shadow:0 7px 0 #8e3c18,0 13px 19px rgba(66,38,21,.28); transform:translateY(-7px); }.customer-site .mobile-basket-button:not([hidden]):active { box-shadow:0 2px 0 #8e3c18,0 5px 9px rgba(66,38,21,.22); transform:translateY(-2px); }
#catalog-pagination { gap:12px; }#catalog-pagination button { min-width:42px; min-height:34px; padding:6px 12px; border:1px solid #b85d28; border-radius:0; color:#8e3c18; background:#fffaf4; box-shadow:4px 4px 0 #b85d28; font-size:17px; line-height:1; }#catalog-pagination button:hover:not(:disabled) { color:#fff; background:#b85d28; box-shadow:2px 2px 0 #8e3c18; transform:translate(2px,2px); }#catalog-pagination button:disabled { box-shadow:none; }
@media (max-width:760px) { .staff-body .product-filter-panel { grid-template-columns:1fr; width:100%; padding:8px; }.staff-body .product-image-preview > div { grid-template-columns:repeat(3,minmax(0,1fr)); }.customer-site .catalog-image-button img { aspect-ratio:auto; } }
.staff-body .filter-toggle span { display:none; }
.customer-site .catalog-image-button { height:auto; min-height:0; aspect-ratio:auto; padding:0; }
.customer-site .mobile-basket-button:not([hidden]) > span { display:none; }
.staff-body .filter-toggle { width:42px; min-height:42px; justify-content:center; padding:0; font-size:25px; line-height:1; }
.staff-body .editor-panel[hidden] { display:none !important; }
.staff-body .audit-table .action-delete { justify-self:end; padding:5px 8px; border:0; color:#b34b3d; background:transparent; box-shadow:none; font-size:12px; }
.staff-body .audit-table .action-delete:hover { background:#fff1ef; transform:none; }
.customer-site .catalog-card-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:10px; padding:11px 13px 13px; }
.customer-site .catalog-card-actions .basket-toggle { margin:0; justify-self:start; font-size:13px; }
.customer-site .catalog-card-actions > button { margin:0; min-height:38px; padding:9px 11px; }
@media (max-width:760px) { .customer-site .catalog-card-actions { gap:7px; padding:8px 9px 10px; }.customer-site .catalog-card-actions .basket-toggle { gap:6px; font-size:11px; }.customer-site .catalog-card-actions > button { min-height:34px; padding:7px 8px; font-size:11px; } }
.customer-site .catalog-media { position:relative; }
.customer-site .catalog-card-actions { display:block; padding:11px 12px 13px; }
.customer-site .catalog-basket-control { position:absolute; left:12px; bottom:12px; z-index:1; display:grid !important; width:42px; height:42px; margin:0 !important; cursor:pointer; }
.customer-site .catalog-basket-control input { position:absolute; width:1px !important; min-width:1px !important; height:1px; margin:-1px; opacity:0; }
.customer-site .catalog-basket-icon { display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(132,63,24,.42); border-radius:50%; color:#8e3c18; background:rgba(255,253,249,.96); box-shadow:0 4px 0 #8e3c18,0 10px 17px rgba(72,41,21,.25); transition:transform .16s ease,background-color .16s ease,box-shadow .16s ease; }
.customer-site .catalog-basket-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.9; }
.customer-site .catalog-basket-control input:checked + .catalog-basket-icon { color:#fff; background:#b85d28; box-shadow:0 3px 0 #8e3c18,0 7px 13px rgba(72,41,21,.25); transform:translateY(1px); }
.customer-site .catalog-basket-control input:checked + .catalog-basket-icon::after { content:"✓"; position:absolute; right:-3px; top:-5px; display:grid; width:17px; height:17px; place-items:center; border:2px solid #fff; border-radius:50%; color:#fff; background:#376d57; font-size:11px; font-weight:800; }
.customer-site .catalog-basket-control input:focus-visible + .catalog-basket-icon { outline:3px solid rgba(184,93,40,.32); outline-offset:3px; }
.customer-site .catalog-detail-trigger { position:relative; display:grid !important; grid-template-columns:1fr auto; grid-template-areas:"title arrow" "english arrow"; width:100%; min-height:46px !important; margin:0 !important; padding:8px 14px !important; border:1px solid #e0b991 !important; border-radius:0 !important; color:#944419 !important; background:#fffaf3 !important; box-shadow:3px 3px 0 #e7c6a7,0 6px 13px rgba(94,45,19,.08) !important; text-align:left; transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease; }
.customer-site .catalog-detail-trigger span { grid-area:title; font-size:13px; font-weight:750; letter-spacing:.07em; }
.customer-site .catalog-detail-trigger small { grid-area:english; margin-top:2px; color:#b07a55; font-size:7px; letter-spacing:.16em; }
.customer-site .catalog-detail-trigger i { grid-area:arrow; align-self:center; color:#a95122; font-size:21px; font-style:normal; font-weight:400; }
.customer-site .catalog-detail-trigger:hover,.customer-site .catalog-detail-trigger:focus-visible { color:#783614 !important; background:#f7eadb !important; box-shadow:1px 1px 0 #d7a77d,0 4px 9px rgba(94,45,19,.12) !important; transform:translate(2px,2px); }
@media (max-width:760px) { .customer-site .catalog-card-actions { padding:7px 8px 9px; }.customer-site .catalog-basket-control { left:8px; bottom:8px; width:34px; height:34px; }.customer-site .catalog-basket-icon { width:34px; height:34px; box-shadow:0 3px 0 #8e3c18,0 6px 11px rgba(72,41,21,.18); }.customer-site .catalog-basket-icon svg { width:16px; height:16px; }.customer-site .catalog-detail-trigger { min-height:34px !important; padding:6px 9px !important; box-shadow:2px 2px 0 #e7c6a7,0 3px 7px rgba(94,45,19,.06) !important; }.customer-site .catalog-detail-trigger span { font-size:11px; }.customer-site .catalog-detail-trigger small { display:none; }.customer-site .catalog-detail-trigger i { font-size:17px; } }
.staff-body .application-product-list { display:grid; gap:8px; }
.staff-body .application-product-card { display:grid; grid-template-columns:74px minmax(0,1fr); gap:10px; align-items:center; padding:7px; border:1px solid #eadfce; border-radius:8px; background:#fffdf9; }
.staff-body .application-product-card img,.staff-body .application-product-placeholder { display:block; width:74px; height:58px; object-fit:cover; border-radius:5px; background:#f2ece3; }
.staff-body .application-product-placeholder { display:grid; place-items:center; color:#8a8177; font-size:10px; }
.staff-body .application-product-card div { display:grid; gap:3px; min-width:0; }
.staff-body .application-product-card strong { overflow:hidden; color:#2d2925; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.staff-body .application-product-card span,.staff-body .application-product-card small { color:#756b60; font-size:11px; }
@media (max-width:520px) { .staff-body .application-product-card { grid-template-columns:66px minmax(0,1fr); }.staff-body .application-product-card img,.staff-body .application-product-placeholder { width:66px; height:52px; } }
/* The basket remains an icon even when an older cached script tries to inject its label. */
.customer-site .catalog-basket-icon { position:relative; font-size:0; }
.customer-site .catalog-basket-icon svg { display:none; }
.customer-site .catalog-basket-icon::before { content:""; width:19px; height:19px; display:block; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 4h2l2.1 10.1a2 2 0 0 0 2 1.6h8.4a2 2 0 0 0 1.9-1.4L21 8H6M10 20h.01M18 20h.01'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 4h2l2.1 10.1a2 2 0 0 0 2 1.6h8.4a2 2 0 0 0 1.9-1.4L21 8H6M10 20h.01M18 20h.01'/%3E%3C/svg%3E") center/contain no-repeat; }
@media (max-width:760px) { .customer-site .catalog-basket-control { left:10px; bottom:10px; width:31px; height:31px; }.customer-site .catalog-basket-icon { width:31px; height:31px; border-color:rgba(142,60,24,.35); box-shadow:0 2px 0 #8e3c18,0 5px 10px rgba(72,41,21,.16); }.customer-site .catalog-basket-icon::before { width:16px; height:16px; }.customer-site .catalog-basket-control input:checked + .catalog-basket-icon::after { right:-5px; top:-6px; width:15px; height:15px; font-size:9px; }.customer-site .catalog-card-actions { padding:6px 8px 8px; }.customer-site .catalog-detail-trigger { min-height:32px !important; padding:5px 9px !important; box-shadow:2px 2px 0 #e7c6a7,0 2px 5px rgba(94,45,19,.05) !important; }.customer-site .catalog-detail-trigger span { font-size:10px; letter-spacing:.05em; }.customer-site .catalog-detail-trigger i { font-size:16px; } }

@media (min-width:761px) {
  .staff-body .product-stats { justify-content:flex-end; }
  .staff-body .workspace-toolbar { display:flex; flex-direction:column; align-items:flex-end; }
  .staff-body .product-filter-panel { margin-left:auto; }
}

/* V13.2: compact controls, consistent units, and the approved dimensional hierarchy. */
.staff-body .product-quick-tools { display:flex; flex-direction:column; align-items:flex-end; margin:8px 0 18px; }
.staff-body .product-quick-tools .product-stats { margin:0 0 8px; }
.staff-body .product-quick-tools .workspace-toolbar { margin:0; }
.staff-body .unit-input { display:flex; align-items:stretch; width:100%; border:1px solid #e3d6c5; border-radius:10px; overflow:hidden; background:#fffdf9; }
.staff-body .unit-input input { min-width:0; flex:1; border:0; border-radius:0; background:transparent; }
.staff-body .unit-input input:focus { outline:0; box-shadow:inset 0 0 0 1px #b85d28; }
.staff-body .unit-input span { display:grid; place-items:center; flex:none; min-width:62px; padding:0 12px; border-left:1px solid #e3d6c5; color:#846547; background:#f5eee5; font-size:13px; }
.staff-body .audit-table .audit-delete { justify-self:end; width:24px; height:24px; padding:0; border:1px solid #efc1b9; border-radius:50%; color:#c74f45; background:#fffafa; box-shadow:none; font-size:20px; line-height:19px; }
.staff-body .audit-table .audit-delete:hover { color:#fff; background:#c74f45; border-color:#c74f45; transform:none; }
@media (min-width:761px) { .staff-body .sample-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; } .staff-body .sample-body { padding:9px; } .staff-body .sample-image { min-height:118px; } .staff-body .sample-card-title h3 { font-size:13px; } .staff-body .sample-card-title p,.staff-body .sample-spec { font-size:9px; } .staff-body .sample-actions { gap:4px; } .staff-body .sample-actions button { min-height:26px; padding:4px 5px; font-size:10px; } }
#catalog-pagination { gap:16px; margin-top:28px; }
#catalog-pagination button { min-width:56px; min-height:38px; padding:8px 14px; border:1px solid #9a6240; border-radius:0; color:#6d4229; background:#f4dfb7; box-shadow:5px 5px 0 #6d4229; font-size:18px; line-height:1; }
#catalog-pagination button:hover:not(:disabled) { color:#fff; background:#b85d28; box-shadow:2px 2px 0 #6d4229; transform:translate(3px,3px); }
#catalog-pagination button:disabled { color:#c9ad91; background:#fbf4e7; box-shadow:3px 3px 0 #ddcab3; }
.customer-site .hero-scan-button { min-height:46px; padding:10px 22px; border:0; border-radius:999px; color:#fff; background:#b85d28; box-shadow:0 6px 0 #8e3c18,0 11px 16px rgba(66,38,21,.24); font-size:14px; letter-spacing:.06em; }
.customer-site .hero-scan-button:hover,.customer-site .hero-scan-button:focus-visible { color:#fff; background:#b85d28; box-shadow:0 4px 0 #8e3c18,0 8px 13px rgba(66,38,21,.22); transform:translateY(2px); }
@media (max-width:760px) {
  .staff-body .product-quick-tools { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; margin:6px 0 12px; }
  .staff-body .product-quick-tools .product-stats { margin:0; font-size:12px; line-height:1.45; }
  .staff-body .product-quick-tools .workspace-toolbar { display:contents; }
  .staff-body .product-filter-panel { grid-column:1 / -1; margin-top:0; }
  .staff-body .filter-toggle { grid-column:2; grid-row:1; }
  .staff-body .unit-input span { min-width:58px; padding:0 9px; }
  .customer-site .hero-scan-button { width:auto; min-height:46px; padding:10px 22px; }
  #catalog-pagination { gap:14px; }
  #catalog-pagination button { min-width:50px; min-height:36px; padding:7px 12px; box-shadow:4px 4px 0 #6d4229; }
}

/* V13.3: one-line product controls and shared magnifier mark. */
.staff-body .section-heading-actions-only { display:block; }
.staff-body .product-control-row { display:flex; align-items:center; gap:14px; width:100%; min-width:0; }
.staff-body .product-action-combo { position:relative; display:inline-flex; align-items:stretch; flex:none; }
.staff-body .product-action-combo #new-product { min-height:42px; margin:0; border-radius:8px 0 0 8px; }
.staff-body .product-menu-trigger { width:38px; min-height:42px; display:grid; align-content:center; gap:4px; padding:0 10px; border:0; border-left:1px solid rgba(255,255,255,.36); border-radius:0 8px 8px 0; color:#fff; background:#b85d28; box-shadow:none; }
.staff-body .product-menu-trigger:hover,.staff-body .product-menu-trigger[aria-expanded="true"] { background:#983f19; transform:none; }
.staff-body .product-menu-trigger i { display:block; width:17px; height:2px; border-radius:2px; background:currentColor; }
.staff-body .product-action-menu { position:absolute; z-index:12; top:calc(100% + 7px); left:0; display:grid; gap:5px; min-width:138px; padding:7px; border:1px solid #eadbc8; border-radius:10px; background:#fffdf9; box-shadow:0 12px 24px rgba(69,43,25,.14); }
.staff-body .product-action-menu[hidden] { display:none; }
.staff-body .product-action-menu .soft-button { justify-content:flex-start; min-height:34px; padding:6px 9px; }
.staff-body .product-control-row .product-quick-tools { display:flex; flex:1; flex-direction:row; align-items:center; gap:10px; min-width:0; margin:0; }
.staff-body .product-control-row .product-stats { flex:0 1 auto; margin:0; white-space:nowrap; }
.staff-body .product-control-row .filter-toggle { flex:none; width:34px; min-height:34px; display:grid; place-items:center; padding:0; border:1px solid #dfc9ad; border-radius:50%; color:#8e3c18; background:#fffaf4; box-shadow:0 2px 0 #eadbc8; }
.staff-body .filter-toggle svg,.customer-site .catalog-weight-toggle svg { width:17px; height:17px; overflow:visible; fill:#e6b45f; stroke:#8e3c18; stroke-width:2.1; stroke-linecap:round; }
.staff-body .filter-toggle:hover { background:#f7e8d8; transform:translateY(1px); box-shadow:none; }
.staff-body .workspace-toolbar { margin:0; }
.staff-body .product-filter-panel { margin-top:10px; }
.customer-site .catalog-weight-toggle { width:34px; height:34px; display:grid; place-items:center; padding:0; border:1px solid #dfc9ad; border-radius:50%; color:#8e3c18; background:#fffaf4; box-shadow:0 2px 0 #eadbc8; }
.customer-site .catalog-weight-toggle:hover { background:#f7e8d8; transform:translateY(1px); box-shadow:none; }
@media (max-width:760px) {
  .staff-body .product-control-row { gap:9px; }
  .staff-body .product-action-combo #new-product { min-height:39px; padding:7px 10px; font-size:13px; }
  .staff-body .product-menu-trigger { width:34px; min-height:39px; padding:0 8px; }
  .staff-body .product-control-row .product-quick-tools { gap:7px; justify-content:flex-end; }
  .staff-body .product-control-row .product-stats { overflow:hidden; font-size:10px; text-overflow:ellipsis; }
  .staff-body .product-control-row .filter-toggle { width:32px; min-height:32px; }
  .staff-body .workspace-toolbar { margin:0; }
}

/* V14.2: required ICP service filing footer; intentionally isolated from page content. */
.customer-site .site-icp-footer { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px 12px; padding:22px 20px calc(22px + env(safe-area-inset-bottom)); border-top:1px solid #eadfce; color:#8a7563; background:#f8f3ec; font-size:12px; line-height:1.6; text-align:center; }
.customer-site .site-icp-footer a { color:#8e3c18; text-decoration:none; text-underline-offset:3px; }
.customer-site .site-icp-footer a:hover,.customer-site .site-icp-footer a:focus-visible { color:#5e2710; text-decoration:underline; }
@media (max-width:420px) { .customer-site .site-icp-footer { gap:3px; padding:18px 16px calc(18px + env(safe-area-inset-bottom)); font-size:11px; }.customer-site .site-icp-footer span,.customer-site .site-icp-footer a { width:100%; } }
