:root {
  --bg: #f4f6f8;
  --panel: #ffffff;
  --ink: #182026;
  --muted: #6f7882;
  --line: #e3e7eb;
  --sidebar: #172027;
  --sidebar-soft: #253039;
  --accent: #ec5b36;
  --accent-dark: #cf4524;
  --blue: #2c6eb8;
  --green: #218568;
  --amber: #c98519;
  --soft-coral: #fff0eb;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--bg); font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; scrollbar-gutter: stable; }

:where(html, body, nav, main, .admin-scroll-table .table-wrap, .support-thread, .support-ticket-list, .support-conversation-body, .support-customer-card, .refund-review-scroll, .modal) {
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .78) transparent;
}

*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-track {
  background: transparent;
}

*::-webkit-scrollbar-thumb {
  min-height: 42px;
  background:
    linear-gradient(180deg, rgba(203, 213, 225, .86), rgba(148, 163, 184, .86))
    content-box;
  border: 2px solid transparent;
  border-radius: 999px;
}

*::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, rgba(148, 163, 184, 1), rgba(100, 116, 139, 1))
    content-box;
}

*::-webkit-scrollbar-corner,
*::-webkit-scrollbar-button {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
  background: transparent;
}

*::-webkit-scrollbar-button:single-button,
*::-webkit-scrollbar-button:start:decrement,
*::-webkit-scrollbar-button:end:increment {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }

.login-screen { min-height: 100vh; padding: 30px 6vw; color: #fff; background: #152027; position: relative; overflow: hidden; }
.login-screen::after { content: ""; position: absolute; width: 48vw; height: 48vw; right: -12vw; bottom: -24vw; border-radius: 50%; background: #ec5b36; opacity: .9; }
.login-brand, .app-brand { display: flex; align-items: center; gap: 12px; font-weight: 800; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 7px; color: #fff; background: var(--accent); font: 900 23px Georgia, serif; transform: skew(-5deg); }
.brand-mark.small { width: 34px; height: 34px; font-size: 19px; }
.login-brand span { font-size: 21px; }
.login-layout { position: relative; z-index: 1; width: min(1120px, 100%); min-height: calc(100vh - 102px); margin: 0 auto; display: grid; grid-template-columns: 1.2fr 430px; align-items: center; gap: 80px; }
.login-copy h1 { font-size: clamp(38px, 4vw, 60px); line-height: 1.16; margin: 18px 0; letter-spacing: 0; }
.login-copy > p { max-width: 650px; color: #b9c4cb; font-size: 17px; line-height: 1.8; }
.eyebrow { color: var(--accent); font-size: 13px; font-weight: 800; letter-spacing: 0; }
.feature-strip { margin-top: 34px; display: flex; align-items: center; flex-wrap: wrap; gap: 14px; color: #e6ebee; }
.feature-strip i { width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }
.login-card { color: var(--ink); background: #fff; border-radius: 8px; padding: 36px; box-shadow: 0 22px 60px rgba(0,0,0,.25); display: grid; gap: 20px; }
.login-card h2 { font-size: 27px; margin: 8px 0; }
.login-card p, .login-card small { color: var(--muted); }
.login-help-row { margin-top: -8px; display: flex; justify-content: flex-end; }
.login-help-row button { padding: 0; border: 0; color: var(--accent); background: transparent; font-size: 13px; font-weight: 800; }
.login-help-row button:hover { color: #c84525; text-decoration: underline; }
.forgot-password-panel {
  display: grid;
  gap: 6px;
  padding: 13px 14px;
  border: 1px solid #ffd8c7;
  border-radius: 8px;
  color: #2e3a43;
  background: #fff7f2;
}
.forgot-password-panel strong { font-size: 14px; color: #17212b; }
.forgot-password-panel p { margin: 0; color: #596775; font-size: 13px; line-height: 1.7; }
.forgot-password-panel span { color: #cf512e; font-size: 12px; font-weight: 800; }
label { display: grid; gap: 8px; color: #49525a; font-size: 13px; font-weight: 700; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); outline: none; transition: border-color .2s, box-shadow .2s; }
input { height: 42px; padding: 0 13px; font-size: 13px; font-weight: 700; letter-spacing: 0; }
textarea { padding: 12px; resize: vertical; line-height: 1.6; }
input:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(236,91,54,.1); }
input::placeholder, textarea::placeholder { color: #8c98a3; font-weight: 600; opacity: 1; }
input:focus::placeholder, textarea:focus::placeholder { color: #aeb7bf; }
.form-select { height: 42px; padding: 0 10px; }
.password-field { position: relative; display: block; width: 100%; min-width: 0; }
.password-field input { padding-right: 52px; }
.password-toggle {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 32px;
  height: 28px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #64717d;
  background: transparent;
  transform: translateY(-50%);
  transition: color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.password-toggle:hover, .password-toggle:focus-visible {
  color: #16232d;
  background: #f8fafc;
  border-color: #dce5ec;
  box-shadow: 0 4px 12px rgba(24, 32, 38, .08);
  outline: none;
}
.password-toggle span {
  position: relative;
  width: 18px;
  height: 12px;
  display: block;
}
.password-toggle span::before {
  content: "";
  position: absolute;
  inset: 1px 0;
  border: 2px solid currentColor;
  border-radius: 50% / 58%;
  background: #fff;
}
.password-toggle span::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  transform: translate(-50%, -50%);
}
.password-toggle.is-visible {
  color: var(--accent-dark);
  background: #fff3ee;
  border-color: #ffd7c9;
}
.password-toggle.is-visible span::before { background: #fff8f5; }
.password-toggle.is-visible::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 8px;
  width: 19px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform: rotate(-34deg);
  transform-origin: center;
}

.primary, .secondary, .light-button, .text-button, .link-button, .icon-button, .subtab, .danger-button, .table-button { border: 0; border-radius: 6px; font-weight: 700; }
.primary { min-height: 42px; padding: 0 18px; background: var(--accent); color: #fff; }
.primary:hover { background: var(--accent-dark); }
.wide { width: 100%; display: flex; align-items: center; justify-content: space-between; }
.secondary { height: 36px; padding: 0 14px; background: #eef1f3; color: #46515a; }
.light-button { height: 40px; padding: 0 17px; background: #fff; color: #1f2b33; }
.text-button, .link-button { background: transparent; color: var(--muted); }
.link-button { color: var(--accent-dark); }
.icon-button { width: 38px; height: 38px; background: #fff; border: 1px solid var(--line); color: #4d5861; font-size: 19px; }
.table-button { min-height: 30px; padding: 0 10px; color: #46515a; background: #edf1f3; font-size: 11px; }
.table-button:hover { color: var(--accent-dark); background: var(--soft-coral); }
.danger-button { min-height: 40px; padding: 0 15px; color: #a63f2d; background: #fff0ed; }
.status-select, .progress-input { height: 32px; border: 1px solid var(--line); border-radius: 5px; background: #fff; color: #45515a; font-size: 11px; }
.status-select { min-width: 104px; padding: 0 6px; }
.progress-control { display: flex; align-items: center; gap: 8px; }
.progress-input { width: 66px; padding: 0 7px; }

.app-shell { width: 100%; min-height: 100vh; display: grid; grid-template-columns: 226px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; background: var(--sidebar); color: #fff; padding: 24px 16px; display: flex; flex-direction: column; }
.app-brand { padding: 0 7px 26px; }
.app-brand div:last-child { display: grid; }
.app-brand strong { font-size: 18px; }
.app-brand span { color: #73828d; font-size: 9px; letter-spacing: 1.6px; margin-top: 2px; }
nav { min-height: 0; display: grid; gap: 5px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(226, 232, 240, .42) transparent; }
nav::-webkit-scrollbar {
  width: 7px;
}

nav::-webkit-scrollbar-track {
  margin: 10px 0;
  background: transparent;
}

nav::-webkit-scrollbar-thumb {
  min-height: 48px;
  background: rgba(226, 232, 240, .36) content-box;
  border: 2px solid transparent;
  border-radius: 999px;
  box-shadow: none;
}

nav:hover::-webkit-scrollbar-thumb {
  background: rgba(226, 232, 240, .58) content-box;
}

nav::-webkit-scrollbar-button,
nav::-webkit-scrollbar-button:single-button,
nav::-webkit-scrollbar-button:start:decrement,
nav::-webkit-scrollbar-button:end:increment {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
.nav { height: 44px; display: flex; align-items: center; gap: 12px; padding: 0 13px; border: 0; border-radius: 6px; background: transparent; color: #aab5bd; text-align: left; font-size: 14px; }
.nav:hover, .nav.active { color: #fff; background: var(--sidebar-soft); }
.nav.active { box-shadow: inset 3px 0 var(--accent); }
.nav-icon { width: 22px; color: #82919b; text-align: center; font-weight: 900; }
.nav.active .nav-icon { color: var(--accent); }
.sidebar-foot { margin-top: auto; padding: 16px 10px 4px; border-top: 1px solid #2a353e; display: grid; gap: 5px; color: #9cacb6; font-size: 12px; }
.sidebar-foot span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #43b88a; }
.sidebar-foot small { color: #60717d; }
.sidebar-foot .unhealthy::before { background: #d65d47; }

main { min-width: 0; padding: 0 28px 36px; overflow: auto; }
.topbar { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.topbar p { margin: 0 0 5px; color: #929aa1; font-size: 12px; }
.topbar h1 { margin: 0; font-size: 23px; }
.top-actions { display: flex; align-items: center; gap: 12px; }
#status { max-width: 200px; color: var(--muted); font-size: 12px; text-align: right; }
.user-chip { height: 42px; padding: 0 12px; border-left: 1px solid var(--line); display: flex; align-items: center; gap: 9px; }
.user-chip > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #29363f; color: #fff; font-weight: 800; }
.user-chip div { display: grid; }
.user-chip strong { font-size: 13px; }
.user-chip small { color: var(--muted); font-size: 10px; }

.welcome-band { min-height: 104px; margin-bottom: 18px; padding: 23px 28px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-radius: 8px; color: #fff; background: linear-gradient(100deg, #27323a 0%, #27323a 68%, #db5535 68%, #f1734f 100%); }
.welcome-band span { color: #aeb9bf; font-size: 12px; }
.welcome-band h2 { margin: 7px 0 0; font-size: 20px; letter-spacing: 0; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 14px; margin-bottom: 16px; }
.metrics article, .panel { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.metrics article { min-height: 138px; padding: 19px; }
.metrics article:hover, .panel:hover { border-color: #d6dce1; box-shadow: 0 12px 28px rgba(24, 32, 38, .05); }
.metric-head { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 13px; }
.metric-icon { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 6px; font-size: 14px; }
.coral { color: var(--accent-dark); background: var(--soft-coral); }
.blue { color: var(--blue); background: #eaf3fc; }
.green { color: var(--green); background: #e9f6f1; }
.amber { color: var(--amber); background: #fff6e6; }
.metrics strong { display: block; margin: 14px 0 7px; font-size: 27px; }
.metrics small { color: #98a0a7; font-size: 11px; }
.panel { min-width: 0; padding: 19px; margin-bottom: 16px; }
.view { min-width: 0; }
.panel-head { min-height: 42px; margin-bottom: 15px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.panel-head span { color: #929aa1; font-size: 11px; }
.panel-head h2 { margin: 4px 0 0; font-size: 17px; }
.panel-tools { display: flex; align-items: center; gap: 8px; }
.search-input { width: 180px; height: 34px; font-size: 12px; }
.filter-select { width: 112px; height: 34px; padding: 0 7px; font-size: 11px; }
.count-badge { min-width: 27px; height: 27px; padding: 0 8px; display: grid; place-items: center; border-radius: 6px; background: #f0f2f4; color: #68737c; font-size: 12px; }
.order-list-tools { flex-wrap: wrap; justify-content: flex-end; }
.order-show-all {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #dce2e8;
  border-radius: 6px;
  color: #46515b;
  background: #fff;
  font-size: 11px;
  font-weight: 900;
}
.order-show-all:hover,
.order-show-all.is-active { color: #1d2329; background: #fff8d4; border-color: #efd04b; }
.order-count-badge { min-width: 52px; height: 34px; color: #45515c; font-size: 11px; white-space: nowrap; }
#orderTable tr.order-row-selected > td { background: #fffbed; }
#orderTable tr.order-row-selected > td:first-child { box-shadow: inset 3px 0 #ffd926; }
#orderTable td { vertical-align: middle; }
.order-product-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 220px;
  white-space: normal;
}
.order-product-thumb {
  position: relative;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #344054;
  background: #f8fafc;
  border: 1px solid #dbe2e8;
  border-radius: 9px;
  box-shadow: 0 3px 10px rgba(24, 32, 38, .07);
}
.order-product-thumb:focus-visible {
  outline: 3px solid rgba(23, 92, 211, .28);
  outline-offset: 2px;
}
.order-product-thumb > em {
  position: absolute;
  top: 2px;
  right: 2px;
  padding: 1px 3px;
  color: #7a4b00;
  background: rgba(255, 242, 178, .94);
  border: 1px solid rgba(236, 192, 43, .8);
  border-radius: 3px;
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.2;
}
.order-product-thumb img {
  width: 100%;
  height: 100%;
  padding: 2px;
  object-fit: contain;
  background: #fff;
  transition: transform .18s ease;
}
.order-product-thumb:hover img { transform: scale(1.06); }
.order-product-thumb.is-placeholder {
  padding: 5px;
  color: #765900;
  background: linear-gradient(145deg, #fffbe5, #ffe778);
  border-color: #f0d457;
  font-size: 11px;
  text-align: center;
}
.order-product-thumb.is-broken { color: #667085; background: #f2f4f7; border-color: #d0d5dd; }
.order-product-thumb.art-card { color: #175cd3; background: linear-gradient(145deg, #eff8ff, #d1e9ff); border-color: #b2ddff; }
.order-product-thumb.art-sticker { color: #027a48; background: linear-gradient(145deg, #ecfdf3, #abefc6); border-color: #75e0a7; }
.order-product-thumb.art-box { color: #b54708; background: linear-gradient(145deg, #fff6ed, #fedf89); border-color: #fec84b; }
.order-product-thumb.art-poster { color: #7f56d9; background: linear-gradient(145deg, #f9f5ff, #e9d7fe); border-color: #d6bbfb; }
.order-product-meta {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.order-product-meta b {
  color: #101828;
  font-size: 12px;
  overflow-wrap: anywhere;
}
.order-product-meta small {
  display: block;
  max-width: 150px;
  overflow: hidden;
  color: #667085;
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 780px) {
  #orderTable td[data-label="产品 / SKU"] { align-items: center; }
  .order-product-cell { min-width: 0; flex: 1; justify-content: flex-end; }
  .order-product-thumb { width: 48px; height: 48px; flex-basis: 48px; }
  .order-product-meta { max-width: min(180px, 48vw); text-align: right; }
  .order-product-meta small { max-width: 100%; }
}
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, .8fr); gap: 16px; }
.dashboard-operations-panel {
  padding: 0;
  overflow: hidden;
  border-color: #dfe5eb;
  box-shadow: 0 14px 34px rgba(24, 32, 38, .065);
}
.dashboard-operations-switcher {
  display: flex;
  min-height: 88px;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 16px 20px;
  background: linear-gradient(105deg, #fff 0%, #fffdf3 100%);
  border-bottom: 1px solid #e4e8ed;
}
.dashboard-operations-heading {
  display: grid;
  min-width: 190px;
  gap: 2px;
}
.dashboard-operations-heading > span {
  color: #9a6b00;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
}
.dashboard-operations-heading > strong {
  color: #182026;
  font-size: 19px;
}
.dashboard-operations-heading > small {
  color: #7b858e;
  font-size: 11px;
}
.dashboard-operations-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px;
  background: #f2f4f6;
  border: 1px solid #e5e9ed;
  border-radius: 10px;
}
.dashboard-operations-tabs button {
  display: inline-flex;
  min-width: 132px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 14px;
  color: #65717b;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 800;
  transition: color .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.dashboard-operations-tabs button b {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  color: #7f8992;
  background: #fff;
  border: 1px solid #dfe5ea;
  border-radius: 7px;
  font-size: 10px;
}
.dashboard-operations-tabs button:hover {
  color: #182026;
  background: rgba(255, 255, 255, .72);
}
.dashboard-operations-tabs button.active {
  color: #182026;
  background: #fff;
  border-color: #e5d98e;
  box-shadow: 0 7px 18px rgba(24, 32, 38, .08);
}
.dashboard-operations-tabs button.active b {
  color: #4b3900;
  background: #ffdf3e;
  border-color: #ffdf3e;
}
.dashboard-operation-panels {
  min-width: 0;
  background: #fff;
}
.dashboard-operation-module {
  min-width: 0;
  min-height: 400px;
  padding: 20px 20px 22px;
  background: #fff;
}
.dashboard-operation-module[hidden] {
  display: none !important;
}
.dashboard-operation-module .panel-head {
  min-height: 44px;
  margin-bottom: 13px;
}
.dashboard-operation-module .panel-head > div > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #9a6b00;
  font-weight: 800;
}
.dashboard-operation-module .panel-head > div > span::before {
  width: 14px;
  height: 3px;
  background: #ffd52c;
  border-radius: 999px;
  content: "";
}
.dashboard-alert-module {
  background: linear-gradient(145deg, #fff 0%, #fffdf8 100%);
}
.dashboard-inventory-module {
  background: linear-gradient(180deg, #fbfcfd 0%, #fff 42%);
}
.dashboard-inventory-module .panel-head {
  align-items: center;
}
.dashboard-operation-module .admin-scroll-table .table-wrap {
  border-color: #e8edf2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}
.dashboard-alert-module .alerts {
  padding: 2px 6px 2px 0;
}
.dashboard-alert-module .alert {
  border: 1px solid #f4ead3;
  border-left: 3px solid var(--amber);
  border-radius: 7px;
}
.dashboard-order-pagination {
  display: flex;
  min-height: 66px;
  align-items: center;
  gap: 16px;
  margin-top: 12px;
  padding: 12px 16px;
  color: #64717d;
  background: #fff;
  border: 1px solid #e1e7ec;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, .035);
  font-size: 13px;
}
.dashboard-order-pagination > span b {
  margin: 0 3px;
  color: #182026;
  font-weight: 900;
}
.dashboard-order-pages {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}
.dashboard-page-numbers {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dashboard-order-pages button,
.dashboard-page-gap {
  display: inline-flex;
  min-width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0 8px;
  color: #64717d;
  background: #f7f9fb;
  border: 1px solid #dfe5ea;
  border-radius: 4px;
  box-shadow: none;
  line-height: 1;
}
.dashboard-page-numbers button.is-active {
  color: #fff;
  background: #1d2730;
  border-color: #1d2730;
  box-shadow: 0 5px 12px rgba(29, 39, 48, .16);
  font-weight: 900;
}
.dashboard-page-gap {
  color: #182026;
  border-color: transparent;
  background: transparent;
  font-weight: 900;
}
.dashboard-order-pages button:hover:not(:disabled) {
  color: #182026;
  background: #fff2a8;
  border-color: #ffd52c;
}
.dashboard-page-numbers button.is-active:hover:not(:disabled) {
  color: #fff;
  background: #1d2730;
  border-color: #1d2730;
}
.dashboard-order-pages button:disabled {
  color: #c8d0d8;
  background: #f6f8fa;
  cursor: not-allowed;
}
.dashboard-order-pagination > label {
  margin: 0;
}
.dashboard-order-pagination select {
  width: 128px;
  height: 36px;
  padding: 0 34px 0 12px;
  color: #35414a;
  background: #fff;
  border: 1px solid #d7dfe6;
  border-radius: 6px;
  outline: 0;
  font-size: 13px;
}
.dashboard-order-pagination select:focus {
  border-color: #e7b914;
  box-shadow: 0 0 0 3px rgba(255, 213, 44, .18);
}
@media (max-width: 780px) {
  .dashboard-operations-switcher {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }
  .dashboard-operations-tabs {
    width: 100%;
    overflow-x: auto;
  }
  .dashboard-operations-tabs button {
    flex: 1 0 126px;
    min-width: 126px;
  }
  .dashboard-operation-module {
    min-height: 360px;
    padding: 16px;
  }
  .dashboard-order-pagination {
    flex-wrap: wrap;
    gap: 10px 12px;
  }
  .dashboard-order-pages {
    order: 3;
    width: 100%;
    overflow-x: auto;
    padding-bottom: 4px;
    scrollbar-width: thin;
  }
  .dashboard-order-pages button,
  .dashboard-page-gap {
    flex: 0 0 auto;
    min-width: 40px;
    height: 40px;
  }
  .dashboard-order-pagination > label {
    margin-left: auto;
  }
}
.phase2-strip { min-width: 0; margin-bottom: 16px; padding: 14px 18px; display: grid; grid-template-columns: 180px minmax(0, 1fr); align-items: center; gap: 18px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.phase2-strip > div:first-child { display: grid; gap: 4px; }
.phase2-strip > div:first-child span { color: var(--accent-dark); font-size: 10px; font-weight: 800; }
.phase2-strip > div:first-child strong { font-size: 14px; }
.phase2-metrics { display: grid; grid-template-columns: repeat(4, minmax(100px, 1fr)); gap: 8px; }
.phase2-metric { padding: 8px 12px; border-left: 1px solid var(--line); }
.phase2-metric span { display: block; color: var(--muted); font-size: 10px; }
.phase2-metric b { display: block; margin-top: 4px; font-size: 16px; }
button:disabled { cursor: not-allowed; opacity: .55; }
.light-button.is-busy, .primary.is-busy { position: relative; color: transparent; }
.light-button.is-busy::after, .primary.is-busy::after { content: ""; position: absolute; inset: 0; margin: auto; width: 15px; height: 15px; border-radius: 50%; border: 2px solid currentColor; border-top-color: transparent; color: #59636b; animation: spin .7s linear infinite; }
.primary.is-busy::after { color: #fff; }
@keyframes spin { to { transform: rotate(360deg); } }
.view.is-loading .metrics article, .view.is-loading .boss-goals article, .view.is-loading .panel { opacity: .64; }
.view.is-loading .chart-shell::after { content: "正在刷新图表..."; position: absolute; inset: 0; display: grid; place-items: center; color: #68737c; background: rgba(255,255,255,.62); font-size: 13px; font-weight: 700; }
.boss-hero { min-height: 132px; margin-bottom: 16px; padding: 24px 28px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-radius: 8px; color: #fff; background: #223039; }
.boss-hero span { color: #91a2ad; font-size: 11px; font-weight: 800; }
.boss-hero h2 { margin: 7px 0; font-size: 24px; letter-spacing: 0; }
.boss-hero p { max-width: 620px; margin: 0; color: #bdc8cf; font-size: 13px; line-height: 1.7; }
.boss-actions { min-width: min(560px, 100%); display: grid; gap: 10px; justify-items: end; }
.range-tabs, .alert-filters, .boss-action-buttons, .ai-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.range-tabs button, .alert-filters button { min-height: 32px; padding: 0 11px; border: 0; border-radius: 6px; color: #d5dde2; background: #2d3a43; font-size: 12px; font-weight: 800; }
.range-tabs button.active, .alert-filters button.active { color: #172027; background: #fff; }
.date-range { display: flex; gap: 8px; }
.date-range input { width: 142px; height: 34px; color: #fff; background: #293741; border-color: #46545e; }
.boss-goals { display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: 12px; margin-bottom: 16px; }
.boss-goals article { min-height: 96px; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.boss-goals span { color: var(--muted); font-size: 11px; font-weight: 800; }
.boss-goals strong { display: block; margin: 8px 0 5px; font-size: 21px; }
.boss-goals strong.up { color: var(--green); }
.boss-goals strong.down { color: #b94c3b; }
.boss-goals small { color: #8c969e; font-size: 11px; }
.goal-progress { height: 7px; overflow: hidden; border-radius: 999px; background: #edf0f2; }
.goal-progress i { display: block; height: 100%; background: var(--green); }
#boss .boss-analysis-workbench {
  padding: 0;
  overflow: hidden;
  background: linear-gradient(145deg, #fff 0%, #fffefa 100%);
}
#boss .boss-analysis-header {
  min-height: 88px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: linear-gradient(100deg, #fffdf5 0%, #fff 55%, #f7f9fb 100%);
  border-bottom: 1px solid var(--line);
}
#boss .boss-analysis-heading {
  flex: 0 0 auto;
  display: grid;
  gap: 3px;
}
#boss .boss-analysis-heading > span {
  color: #a47700;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .8px;
}
#boss .boss-analysis-heading > strong {
  color: #182026;
  font-size: 19px;
}
#boss .boss-analysis-heading > small {
  color: #7a858d;
  font-size: 11px;
}
#boss .boss-analysis-tabs {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #c9d2dc transparent;
}
#boss .boss-analysis-tabs button {
  position: relative;
  flex: 0 0 auto;
  min-width: 126px;
  height: 46px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #68737c;
  background: #f4f6f8;
  border: 1px solid #e2e7ec;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
#boss .boss-analysis-tabs button b {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  color: #7f8992;
  background: #fff;
  border: 1px solid #dfe5ea;
  border-radius: 7px;
  font-size: 10px;
}
#boss .boss-analysis-tabs button:hover {
  color: #182026;
  background: #fff9dc;
  border-color: #edd467;
}
#boss .boss-analysis-tabs button.active {
  color: #182026;
  background: #fff;
  border-color: #e4ca59;
  box-shadow: 0 7px 18px rgba(24, 32, 38, .08);
}
#boss .boss-analysis-tabs button.active::after {
  position: absolute;
  right: 12px;
  bottom: -1px;
  left: 12px;
  height: 3px;
  background: #ffd52c;
  border-radius: 999px 999px 0 0;
  content: "";
}
#boss .boss-analysis-tabs button.active b {
  color: #4b3900;
  background: #ffdf3e;
  border-color: #ffdf3e;
}
#boss .boss-analysis-stage {
  height: 430px;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}
#boss .boss-analysis-panel {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 20px;
  overflow: auto;
}
#boss .boss-analysis-panel[hidden] {
  display: none !important;
}
#boss .boss-analysis-panel .panel-head {
  flex: 0 0 auto;
  margin-bottom: 12px;
}
#boss .boss-analysis-panel.is-chart,
#boss .boss-analysis-panel.is-table,
#boss .boss-analysis-panel.is-paginated {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#boss .boss-analysis-panel.is-chart > div:last-child,
#boss .boss-analysis-panel.is-table > div:last-child {
  flex: 1 1 auto;
  min-height: 0;
}
#boss .boss-analysis-panel.is-chart .chart-shell {
  height: 100%;
  min-height: 0;
}
#boss .boss-analysis-panel.is-table .admin-scroll-table,
#boss .boss-analysis-panel.is-table .table-wrap {
  height: 100%;
  min-height: 0;
}
#boss .boss-analysis-panel.is-table .table-wrap {
  max-height: none;
  overflow: auto;
}
#boss .boss-analysis-panel .boss-ai-list {
  max-height: 100%;
  padding-right: 6px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}
#boss .boss-analysis-panel.is-paginated .boss-ai-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
}
#boss .boss-analysis-pagination {
  flex: 0 0 auto;
  margin-top: 12px;
}
.boss-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); gap: 16px; align-items: stretch; }
.boss-chart-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 16px; align-items: start; }
.boss-trend-panel { min-height: 310px; }
.chart-shell { position: relative; width: 100%; height: 320px; min-height: 280px; overflow: hidden; border: 1px solid #eef1f3; border-radius: 8px; background: #fff; }
.chart-shell canvas { width: 100%; height: 100%; display: block; }
.boss-trend { display: grid; gap: 13px; }
.trend-row { display: grid; grid-template-columns: 66px minmax(0, 1fr) 168px; align-items: center; gap: 12px; }
.trend-row.single { grid-template-columns: 66px minmax(0, 1fr) 92px; }
.trend-row > span { color: #7a858d; font-size: 12px; font-weight: 800; }
.trend-row > b { color: #344049; font-size: 12px; text-align: right; }
.trend-bars { display: grid; gap: 5px; }
.trend-bars i { display: block; height: 8px; border-radius: 999px; background: var(--accent); }
.trend-bars i.profit { background: var(--green); }
.trend-bars i.refund { background: var(--amber); }
.trend-bars i.negative { background: #b94c3b; }
.platform-bars { display: grid; gap: 13px; }
.platform-bar-row { display: grid; grid-template-columns: 78px minmax(0, 1fr) 148px; align-items: center; gap: 12px; }
.platform-bar-row b { font-size: 12px; }
.platform-bar-row small { color: #68737c; font-size: 11px; text-align: right; }
.platform-bar-row div { display: grid; gap: 5px; }
.platform-bar-row span { height: 7px; overflow: hidden; border-radius: 999px; background: #edf0f2; }
.platform-bar-row i { display: block; height: 100%; border-radius: inherit; }
.platform-bar-row .sale { background: var(--accent); }
.platform-bar-row .profit { background: var(--green); }
.platform-bar-row .refund { background: var(--amber); }
.boss-ai-list { display: grid; gap: 10px; }
.boss-ai-tip { min-height: 62px; padding: 12px 13px; display: grid; grid-template-columns: 26px 1fr; gap: 10px; border: 1px solid var(--line); border-radius: 7px; background: #fbfcfd; }
.boss-ai-tip b { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; color: #fff; background: var(--accent); font-size: 12px; }
.boss-ai-tip p { margin: 0; color: #4f5b64; font-size: 12px; line-height: 1.7; }
.business-alert-list {
  max-height: 520px;
  padding-right: 8px;
  display: grid;
  gap: 10px;
  overflow-y: auto;
  scrollbar-gutter: stable;
  scrollbar-color: #96a6b8 #eef3f7;
}
.business-alert-list::-webkit-scrollbar {
  width: 10px;
}
.business-alert-list::-webkit-scrollbar-track {
  background: #eef3f7;
  border-radius: 8px;
}
.business-alert-list::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #b8c4d0, #8ea0b2) content-box;
  border: 2px solid #eef3f7;
  border-radius: 8px;
}
.business-alert-list::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #9aaabc, #718397) content-box;
}
.business-alert { min-height: 74px; padding: 13px 14px; display: grid; grid-template-columns: minmax(160px, .35fr) minmax(0, 1fr) auto; align-items: center; gap: 14px; border: 1px solid var(--line); border-left: 4px solid #aab4bc; border-radius: 7px; background: #fff; }
.business-alert.high { border-left-color: #c74733; background: #fff8f6; }
.business-alert.medium { border-left-color: var(--amber); background: #fffbf2; }
.business-alert span { color: #8d969e; font-size: 10px; text-transform: uppercase; }
.business-alert h3 { margin: 4px 0 0; font-size: 14px; }
.business-alert p { margin: 0; color: #54616b; font-size: 12px; line-height: 1.7; }
.business-alert > b { color: #6d7780; font-size: 12px; }
.alert-filters button { color: #53606a; background: #eef1f3; }
.alert-filters button.active { color: #fff; background: #26333b; }
.alerts {
  max-height: 360px;
  padding-right: 8px;
  display: grid;
  gap: 10px;
  overflow-y: auto;
  scrollbar-gutter: stable;
  scrollbar-color: #96a6b8 #eef3f7;
}
.alerts::-webkit-scrollbar {
  width: 10px;
}
.alerts::-webkit-scrollbar-track {
  background: #eef3f7;
  border-radius: 8px;
}
.alerts::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #b8c4d0, #8ea0b2) content-box;
  border: 2px solid #eef3f7;
  border-radius: 8px;
}
.alerts::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #9aaabc, #718397) content-box;
}
.alert { padding: 12px 13px; border-left: 3px solid var(--amber); border-radius: 4px; background: #fff9ee; }
.alert b { font-size: 13px; }
.alert p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.empty-state { padding: 36px 12px; color: var(--muted); text-align: center; border-radius: 8px; background: linear-gradient(180deg, #fbfcfd, #fff); }
.empty-state.compact { padding: 18px 10px; font-size: 12px; }

.table-wrap { width: 100%; max-width: 100%; overflow-x: auto; }
.admin-scroll-table .table-wrap {
  max-height: clamp(280px, calc(100vh - 300px), 420px);
  overflow: auto;
  border: 1px solid #edf1f5;
  border-radius: 8px;
  background: #fff;
}
.admin-scroll-table.scroll-sm .table-wrap {
  max-height: clamp(220px, calc(100vh - 340px), 320px);
}
.admin-scroll-table.scroll-md .table-wrap {
  max-height: clamp(280px, calc(100vh - 300px), 420px);
}
.admin-scroll-table.scroll-lg .table-wrap {
  max-height: clamp(360px, calc(100vh - 260px), 560px);
}
.admin-scroll-table table {
  min-width: 720px;
}
.admin-scroll-table.scroll-wide table {
  min-width: 980px;
}
.admin-scroll-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: 0 1px 0 #edf0f2;
}
.admin-scroll-table tbody tr:last-child td {
  border-bottom: 0;
}
.admin-scroll-table .empty-state {
  margin: 0;
  border: 1px solid #edf1f5;
}
.payment-scroll .table-wrap {
  max-height: clamp(240px, calc(100vh - 430px), 330px);
  overflow: auto;
}
.payment-scroll table {
  min-width: 1560px;
}
.payment-scroll .order-product-cell {
  min-width: 270px;
  gap: 12px;
}
.payment-scroll .order-product-thumb {
  width: 58px;
  height: 58px;
  flex-basis: 58px;
  border-radius: 10px;
}
.payment-scroll .order-product-meta b {
  font-size: 13px;
  line-height: 1.45;
}
.payment-scroll .order-product-meta small {
  max-width: 220px;
}
.file-links { display: grid; gap: 8px; min-width: 280px; max-width: 380px; white-space: normal; }
.file-links a { overflow: hidden; color: #1463ff; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.file-links small, .muted { color: #7b8494; font-size: 12px; }
.file-review-row { display: grid; grid-template-columns: 92px repeat(4, minmax(72px, 1fr)) minmax(140px, 1.4fr) auto; gap: 6px; }
.file-review-row input { width: 100%; height: 31px; padding: 0 8px; border: 1px solid var(--line); border-radius: 5px; font-size: 11px; }
.design-workbench-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 14px 0 10px;
  padding: 12px 14px;
  background: linear-gradient(180deg, #f8fbff, #fff);
  border: 1px solid #dce7f2;
  border-radius: 8px;
}
.design-workbench-head strong {
  color: #111827;
  font-size: 15px;
  font-weight: 1000;
}
.design-workbench-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}
.design-request-actions {
  display: grid;
  grid-template-columns: 138px minmax(160px, 1fr) auto auto;
  gap: 8px;
  min-width: 560px;
}
.design-request-actions input {
  width: 100%;
  height: 31px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 11px;
}

#design .design-review-panel {
  padding: 16px;
  background:
    radial-gradient(circle at 94% 0, rgba(255, 217, 38, .14), transparent 280px),
    #f7f9fc;
}
.design-review-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 124px;
  padding: 24px 26px;
  overflow: hidden;
  background:
    radial-gradient(circle at 64% 50%, rgba(255, 217, 38, .16) 0 90px, transparent 91px),
    linear-gradient(115deg, #fff 0%, #fffdf4 62%, #fff4ad 100%);
  border: 1px solid #efd45d;
  border-left: 6px solid #ffd926;
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}
.design-review-title { min-width: 0; }
.design-review-title > span {
  display: block;
  margin-bottom: 5px;
  color: #9a6700;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: 1.2px;
}
.design-review-title h2 {
  margin: 0;
  color: #111827;
  font-size: 25px;
  line-height: 1.25;
}
.design-review-title p {
  max-width: 720px;
  margin: 8px 0 0;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.7;
}
.design-review-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(92px, 1fr));
  gap: 10px;
  flex: 0 0 auto;
}
.design-review-metrics > span {
  display: grid;
  place-items: center;
  min-height: 72px;
  padding: 10px 15px;
  background: rgba(255, 255, 255, .88);
  border: 1px solid rgba(226, 189, 36, .48);
  border-radius: 12px;
  box-shadow: 0 7px 18px rgba(100, 78, 0, .06);
}
.design-review-metrics b {
  color: #111827;
  font-size: 24px;
  line-height: 1;
}
.design-review-metrics small {
  margin-top: 6px;
  color: #7b8494;
  font-size: 11px;
  font-weight: 900;
}
.design-review-guide {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0;
}
.design-review-guide > span {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 10px;
  align-items: center;
  min-height: 66px;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid #e1e8f0;
  border-radius: 11px;
}
.design-review-guide i {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  color: #151b24;
  background: #ffdf44;
  border-radius: 10px;
  font-size: 11px;
  font-style: normal;
  font-weight: 1000;
}
.design-review-guide b { color: #172033; font-size: 13px; }
.design-review-guide small { color: #7b8494; font-size: 11px; line-height: 1.45; }
.design-review-block {
  padding: 14px;
  margin-top: 14px;
  background: #fff;
  border: 1px solid #dfe6ee;
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .045);
}
#design .design-workbench-head {
  align-items: center;
  margin: 0 0 12px;
  padding: 0 2px 12px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e5eaf0;
  border-radius: 0;
}
#design .design-workbench-head > div { display: grid; gap: 4px; }
#design .design-workbench-head strong { font-size: 17px; }
#design .design-workbench-head small {
  color: #7b8494;
  font-size: 11px;
  font-weight: 700;
}
#design .design-workbench-head > span {
  padding: 6px 10px;
  color: #8a6500;
  background: #fff8d4;
  border: 1px solid #f3df7c;
  border-radius: 999px;
  white-space: nowrap;
}
#design .admin-scroll-table .table-wrap {
  border-color: #dfe6ee;
  border-radius: 11px;
  box-shadow: inset 0 1px 0 #fff;
}
#design #designRequestTable table { min-width: 1240px; }
#design #designReviewTable table { min-width: 1420px; }
#design .admin-scroll-table th {
  padding: 12px;
  color: #64748b;
  background: #f5f7fa;
  font-size: 11px;
  letter-spacing: .2px;
}
#design .admin-scroll-table td {
  padding: 12px;
  vertical-align: middle;
  background: #fff;
}
#design .admin-scroll-table tbody tr:hover td { background: #fffdf4; }
.design-product-cell {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 230px;
  max-width: 310px;
  white-space: normal;
}
.design-product-thumb {
  position: relative;
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  overflow: hidden;
  color: #8a6500;
  background: linear-gradient(145deg, #fff9da, #fff);
  border: 1px solid #ead88a;
  border-radius: 12px;
  box-shadow: 0 5px 12px rgba(15, 23, 42, .07);
  text-decoration: none;
}
.design-product-thumb img {
  width: 100%;
  height: 100%;
  padding: 3px;
  background: #fff;
  object-fit: contain;
}
.design-product-thumb em {
  position: absolute;
  right: 4px;
  bottom: 4px;
  padding: 2px 5px;
  color: #654b00;
  background: rgba(255, 235, 134, .94);
  border-radius: 999px;
  font-size: 8px;
  font-style: normal;
  font-weight: 1000;
}
.design-product-thumb.is-placeholder {
  border-style: dashed;
  box-shadow: none;
}
.design-product-thumb.is-placeholder b { font-size: 11px; }
.design-product-meta {
  display: grid;
  min-width: 0;
  gap: 5px;
}
.design-product-meta strong {
  overflow: hidden;
  color: #111827;
  font-size: 14px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-product-meta small {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-product-meta em {
  justify-self: start;
  padding: 3px 7px;
  color: #7c5d00;
  background: #fff8d4;
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}
.design-order-cell,
.design-file-cell {
  display: grid;
  gap: 5px;
  min-width: 170px;
  max-width: 240px;
  white-space: normal;
}
.design-order-cell b,
.design-file-cell b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#design .design-request-actions {
  grid-template-columns: minmax(128px, .85fr) minmax(160px, 1.15fr);
  min-width: 330px;
  max-width: 420px;
}
#design .design-request-actions .table-button {
  min-height: 34px;
  border-radius: 7px;
}
#design .design-request-actions .save-design-request {
  color: #111827;
  background: #ffdc31;
  border-color: #e0b900;
}
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
#design .design-unified-block {
  padding: 0;
  overflow: hidden;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.design-unified-layout {
  display: grid;
  grid-template-columns: 350px minmax(0, 1fr);
  height: clamp(780px, calc(100vh - 160px), 1100px);
  min-height: 0;
  overflow: hidden;
  background: #f4f7fa;
  border: 1px solid #dce4ec;
  border-radius: 13px;
}
.design-job-sidebar {
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  background: #f7f9fc;
  border-right: 1px solid #dce4ec;
}
.design-job-sidebar > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 15px 16px 12px;
  background: #fff;
  border-bottom: 1px solid #dce4ec;
}
.design-job-sidebar > header > div {
  display: grid;
  gap: 3px;
}
.design-job-sidebar > header strong {
  color: #111827;
  font-size: 15px;
}
.design-job-sidebar > header small {
  color: #7b8494;
  font-size: 10px;
}
.design-job-sidebar > header > span {
  padding: 5px 8px;
  color: #8a94a1;
  background: #f3f6f9;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
}
.design-job-sidebar > header > b {
  display: grid;
  place-items: center;
  min-width: 36px;
  height: 36px;
  color: #111827;
  background: #ffdf44;
  border-radius: 10px;
  font-size: 14px;
}
.design-job-list {
  display: grid;
  align-content: start;
  flex: 1 1 auto;
  gap: 9px;
  min-height: 0;
  padding: 10px;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.design-job-list::-webkit-scrollbar { display: none; }
.design-job-select {
  position: relative;
  display: block;
  width: 100%;
  min-height: 190px;
  padding: 14px;
  color: #111827;
  text-align: left;
  background: #fff;
  border: 1px solid #dce3eb;
  border-left-width: 4px;
  border-radius: 12px;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.design-job-select:hover {
  border-color: #e9bf18;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .07);
  transform: translateY(-1px);
}
.design-job-select.is-active {
  background: linear-gradient(110deg, #fffdf2, #fff 72%);
  border-color: #e7b900;
  box-shadow: 0 9px 22px rgba(126, 97, 0, .09);
}
.design-job-card-head {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.design-job-card-head > strong {
  overflow: hidden;
  color: #0f2744;
  font-size: 12px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-job-card-head > em {
  display: inline-flex;
  flex: 0 0 auto;
  min-height: 26px;
  padding: 0 10px;
  align-items: center;
  justify-content: center;
  color: #8a6500;
  background: #fff1b5;
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
  font-weight: 1000;
}
.design-job-card-head > em.is-done {
  color: #08794f;
  background: #ddf5e9;
}
.design-job-select .design-product-cell {
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 11px;
  min-width: 0;
  max-width: none;
  margin: 12px 0 11px;
}
.design-job-select .design-product-thumb {
  width: 58px;
  height: 58px;
  border-radius: 9px;
}
.design-job-select .design-product-meta {
  align-content: center;
  gap: 3px;
}
.design-job-select .design-product-meta strong { font-size: 14px; }
.design-job-select .design-product-meta small {
  color: #708096;
  font-size: 11px;
}
.design-job-select .design-product-meta em { display: none; }
.design-job-customer {
  display: block;
  overflow: hidden;
  margin-bottom: 10px;
  color: #59687a;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-job-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 32px;
  padding-top: 10px;
  border-top: 1px dashed #dce3ea;
}
.design-job-card-foot small {
  color: #8a96a5;
  font-size: 10px;
}
.design-job-card-foot b {
  padding: 5px 9px;
  color: #946300;
  background: #fff2bd;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 1000;
  white-space: nowrap;
}
.design-job-order {
  overflow: hidden;
  color: #334155;
  font-size: 11px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-job-summary {
  grid-column: 1;
  overflow: hidden;
  color: #7b8494;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-job-select > em {
  grid-column: 2;
  grid-row: 2 / 4;
  align-self: center;
  padding: 4px 7px;
  color: #995c00;
  background: #fff0b7;
  border-radius: 999px;
  font-size: 9px;
  font-style: normal;
  font-weight: 1000;
  white-space: nowrap;
}
.design-job-select > em.is-done {
  color: #08794f;
  background: #ddf5e9;
}
.design-job-detail {
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  background: #fff;
}
.design-job-detail-head {
  display: grid;
  grid-template-columns: minmax(250px, 1.15fr) minmax(230px, .9fr) auto;
  gap: 18px;
  align-items: center;
  min-height: 98px;
  padding: 14px 18px;
  background:
    radial-gradient(circle at 92% 50%, rgba(255, 217, 38, .13), transparent 150px),
    #fff;
  border-bottom: 1px solid #e2e8f0;
}
.design-job-detail-head > .design-product-cell {
  min-width: 0;
  max-width: 380px;
}
.design-job-order-meta {
  display: grid;
  min-width: 0;
  gap: 4px;
  padding-left: 18px;
  border-left: 1px solid #e5eaf0;
}
.design-job-order-meta > span {
  color: #8a6500;
  font-size: 9px;
  font-weight: 1000;
  letter-spacing: .5px;
}
.design-job-order-meta strong {
  overflow: hidden;
  color: #172033;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-job-order-meta small {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-job-progress {
  display: grid;
  grid-template-columns: repeat(3, 72px);
  gap: 8px;
}
.design-job-progress > span {
  display: grid;
  place-items: center;
  min-height: 58px;
  padding: 7px;
  background: #f7f9fc;
  border: 1px solid #e1e7ee;
  border-radius: 10px;
}
.design-job-progress b {
  color: #111827;
  font-size: 18px;
}
.design-job-progress small {
  color: #7b8494;
  font-size: 9px;
  font-weight: 800;
}
.design-job-body {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr);
  grid-template-rows: auto minmax(0, 1fr);
  flex: 1 1 auto;
  gap: 12px;
  min-height: 0;
  padding: 12px;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.design-job-body::-webkit-scrollbar { display: none; }
.design-demand-card,
.design-action-card,
.design-files-card {
  min-width: 0;
  padding: 14px;
  background: #fff;
  border: 1px solid #dfe6ee;
  border-radius: 12px;
  box-shadow: 0 5px 15px rgba(15, 23, 42, .035);
}
.design-demand-card > header,
.design-action-card > header,
.design-files-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  margin-bottom: 11px;
  border-bottom: 1px solid #e8edf2;
}
.design-demand-card > header > div,
.design-files-card > header > div:first-child,
.design-action-card > header {
  min-width: 0;
}
.design-demand-card header span,
.design-action-card header > span,
.design-files-card header span {
  display: block;
  margin-bottom: 2px;
  color: #a36f00;
  font-size: 8px;
  font-weight: 1000;
  letter-spacing: 1px;
}
.design-demand-card h3,
.design-action-card h3,
.design-files-card h3 {
  margin: 0;
  color: #172033;
  font-size: 15px;
}
.design-demand-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, .45fr);
  gap: 12px;
}
.design-requirement-copy {
  display: grid;
  gap: 6px;
  padding: 13px;
  background: #f7f9fc;
  border-left: 4px solid #ffd51f;
  border-radius: 9px;
}
.design-requirement-copy span {
  color: #7b8494;
  font-size: 10px;
}
.design-requirement-copy strong {
  color: #172033;
  font-size: 14px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.design-requirement-copy small {
  color: #64748b;
  font-size: 10px;
  line-height: 1.5;
}
.design-demand-meta {
  display: grid;
  gap: 8px;
}
.design-demand-meta > span {
  display: grid;
  gap: 4px;
  align-content: center;
  min-height: 56px;
  padding: 10px;
  background: #fffdf4;
  border: 1px solid #f2e3a0;
  border-radius: 9px;
}
.design-demand-meta small {
  color: #8a7240;
  font-size: 9px;
}
.design-demand-meta b {
  overflow: hidden;
  color: #172033;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-asset-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.design-asset-link,
.design-empty-value {
  display: grid;
  min-width: 0;
  min-height: 50px;
  align-content: center;
  gap: 3px;
  padding: 9px 10px;
  color: #172033;
  background: #f7f9fc;
  border: 1px solid #dfe6ee;
  border-radius: 9px;
  text-decoration: none;
}
.design-asset-link:hover {
  background: #fffbea;
  border-color: #e8c52b;
}
.design-asset-link span {
  color: #8a6500;
  font-size: 9px;
  font-weight: 900;
}
.design-asset-link b {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-empty-value {
  place-items: center;
  color: #8b95a3;
  border-style: dashed;
  font-size: 10px;
}
.design-action-card { align-self: stretch; }
.design-action-card > header {
  display: block;
}
.design-unified-controls {
  display: grid;
  gap: 10px;
}
.design-unified-controls label {
  display: grid;
  gap: 5px;
  color: #556170;
  font-size: 10px;
  font-weight: 900;
}
.design-unified-controls select,
.design-unified-controls textarea {
  width: 100%;
  color: #172033;
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
}
.design-unified-controls select { height: 38px; padding: 0 10px; }
.design-unified-controls textarea {
  min-height: 84px;
  padding: 10px;
  resize: vertical;
  font: inherit;
  line-height: 1.5;
}
.design-unified-buttons {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 8px;
}
.design-unified-buttons .table-button {
  min-height: 40px;
  border-radius: 8px;
  font-weight: 1000;
}
.design-unified-buttons .save-design-request {
  color: #111827;
  background: #ffda24;
  border-color: #d8ae00;
}
.design-readonly-note,
.design-no-files {
  display: grid;
  place-items: center;
  min-height: 130px;
  padding: 18px;
  color: #64748b;
  background: #f8fafc;
  border: 1px dashed #cfd8e3;
  border-radius: 9px;
  font-size: 11px;
  text-align: center;
}
.design-files-card {
  display: flex;
  grid-column: 1 / 3;
  min-height: 0;
  flex-direction: column;
}
.design-files-count {
  color: #64748b;
  font-size: 10px;
  white-space: nowrap;
}
.design-files-count b { color: #172033; font-size: 14px; }
.design-files-count strong { color: #c06e00; }
.design-unified-file-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  flex: 1 1 auto;
  align-content: start;
  gap: 9px;
  min-height: 0;
}
.design-unified-file-list .order-file-review-card {
  min-height: 78px;
  align-content: center;
  padding: 11px 12px;
  background: #f8fafc;
  border-radius: 10px;
}
.design-unified-file-list .order-file-review-main {
  min-width: 0;
}
.design-unified-file-list .order-file-review-main a,
.design-unified-file-list .order-file-review-main span {
  display: block;
  overflow: hidden;
  color: #172033;
  font-size: 12px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.design-unified-file-list .order-file-review-main small {
  display: -webkit-box;
  margin-top: 5px;
  overflow: hidden;
  color: #64748b;
  font-size: 9px;
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.design-unified-file-list .order-file-review-actions {
  display: grid;
  justify-items: end;
  gap: 7px;
}
.design-unified-file-list .open-file-review {
  min-height: 30px;
  color: #fff;
  background: #172033;
  border-color: #172033;
  border-radius: 7px;
}
.design-unified-file-list .design-no-files {
  grid-column: 1 / 3;
  min-height: 100%;
}
.design-no-files { gap: 6px; }
.design-no-files b { color: #334155; font-size: 13px; }
.design-no-files span { font-size: 10px; }
.design-review-pagination {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  flex: 0 0 auto;
  min-height: 68px;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px;
  color: #536170;
  background: linear-gradient(90deg, #fffdf3, #fff);
  border: 0;
  border-top: 1px solid #dce4ec;
  border-radius: 0;
  box-shadow: none;
}
.design-pagination-total {
  display: grid;
  justify-self: start;
  gap: 2px;
  min-width: 66px;
  padding-left: 8px;
  border-left: 3px solid #ffd51f;
}
.design-pagination-total small {
  color: #8a6500;
  font-size: 9px;
  font-weight: 1000;
  letter-spacing: .4px;
}
.design-pagination-total strong {
  color: #5f6c79;
  font-size: 10px;
  white-space: nowrap;
}
.design-pagination-total b {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  margin: 0 2px;
  color: #111827;
  background: #ffdf44;
  border-radius: 7px;
  font-size: 10px;
}
.design-review-pagination .dashboard-order-pages {
  justify-self: center;
  max-width: 100%;
  gap: 3px;
  padding: 3px;
  overflow-x: auto;
  background: #f5f7fa;
  border: 1px solid #e0e6ed;
  border-radius: 8px;
  scrollbar-width: none;
}
.design-review-pagination .dashboard-order-pages::-webkit-scrollbar { display: none; }
.design-review-pagination .dashboard-page-numbers { gap: 3px; }
.design-review-pagination .dashboard-order-pages button {
  flex: 0 0 auto;
  min-width: 34px;
  height: 34px;
  padding: 0 7px;
  color: #536170;
  background: #fff;
  border-color: #dce3ea;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 900;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.design-review-pagination .dashboard-order-pages button:hover:not(:disabled) {
  color: #111827;
  background: #fff7c7;
  border-color: #e3bd18;
  transform: translateY(-1px);
}
.design-review-pagination .dashboard-page-numbers button.is-active {
  color: #fff;
  background: #172033;
  border-color: #172033;
  box-shadow: 0 5px 12px rgba(23, 32, 51, .18);
}
.design-review-pagination .design-page-arrow {
  color: #344050;
  background: transparent;
  border-color: transparent;
  font-size: 18px;
}
.design-review-pagination .design-page-arrow:disabled {
  color: #bcc5cf;
  background: transparent;
  border-color: transparent;
}
.design-pagination-size {
  display: flex;
  align-items: center;
  justify-self: end;
  gap: 0;
}
.design-pagination-size > span {
  display: none;
}
.design-review-pagination select {
  width: 94px;
  height: 36px;
  padding: 0 25px 0 8px;
  color: #263240;
  background-color: #fff;
  border-color: #d8e0e8;
  border-radius: 7px;
  font-size: 10px;
  font-weight: 900;
}
.design-review-pagination select:focus {
  border-color: #d5b21d;
  box-shadow: 0 0 0 3px rgba(255, 213, 31, .12);
}

@media (max-width: 1120px) {
  .design-review-hero { align-items: flex-start; flex-direction: column; }
  .design-review-metrics { width: 100%; }
  .design-unified-layout {
    grid-template-columns: 320px minmax(0, 1fr);
  }
  .design-review-pagination {
    grid-template-columns: 1fr auto;
  }
  .design-review-pagination .dashboard-order-pages {
    grid-column: 1 / 3;
    grid-row: 2;
    justify-self: stretch;
    justify-content: center;
  }
  .design-job-detail-head {
    grid-template-columns: minmax(230px, 1fr) minmax(200px, .8fr);
  }
  .design-job-progress {
    grid-column: 1 / 3;
    grid-template-columns: repeat(3, 1fr);
  }
  .design-job-body { grid-template-columns: 1fr; }
  .design-files-card { grid-column: 1; }
  .design-unified-file-list { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  #design .design-review-panel { padding: 10px; }
  .design-review-hero { padding: 18px; }
  .design-review-title h2 { font-size: 21px; }
  .design-review-guide { grid-template-columns: 1fr; }
  .design-review-metrics { grid-template-columns: repeat(3, 1fr); }
  .design-review-metrics > span { min-height: 64px; padding: 8px; }
  .design-review-metrics b { font-size: 20px; }
  #design .design-workbench-head { align-items: flex-start; flex-direction: column; }
  .design-unified-layout {
    display: block;
    height: auto;
    overflow: visible;
  }
  .design-job-sidebar {
    border-right: 0;
    border-bottom: 1px solid #dce4ec;
  }
  .design-job-list {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
    max-height: 240px;
    overflow: auto;
  }
  .design-job-detail-head { grid-template-columns: 1fr; }
  .design-job-order-meta {
    padding: 0;
    border-left: 0;
  }
  .design-job-progress {
    grid-column: 1;
    grid-template-columns: repeat(3, 1fr);
  }
  .design-job-body { overflow: visible; }
  .design-demand-main,
  .design-asset-row { grid-template-columns: 1fr; }
  .design-review-pagination {
    grid-template-columns: 1fr;
    gap: 10px;
    justify-items: stretch;
  }
  .design-pagination-total,
  .design-review-pagination .dashboard-order-pages,
  .design-pagination-size {
    justify-self: stretch;
  }
  .design-review-pagination .dashboard-order-pages {
    grid-column: 1;
    grid-row: auto;
    justify-content: center;
    order: 2;
    overflow-x: auto;
  }
  .design-pagination-size {
    justify-content: space-between;
  }
}
.file-links { display: grid; gap: 8px; }
.file-links a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 8px;
  color: #075985;
  background: #e0f2fe;
  border: 1px solid #bae6fd;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}
.file-links-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px;
  color: #64748b;
  font-size: 11px;
}
.file-links-summary strong { color: #25313b; font-size: 12px; }
.file-links-summary span { color: #9a6700; font-weight: 900; }
.order-file-review-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px 10px;
  min-width: 0;
  padding: 9px 10px;
  background: #f8fafc;
  border: 1px solid #e5eaf0;
  border-left: 3px solid #cbd5e1;
  border-radius: 8px;
}
.order-file-review-card.is-danger { background: #fff7f5; border-color: #fecaca; border-left-color: #e5484d; }
.order-file-review-card.is-approved { background: #f2fbf7; border-color: #c7ead7; border-left-color: #24a46d; }
.order-file-review-card.is-confirmed { background: #f2f7ff; border-color: #cfe0ff; border-left-color: #3b82f6; }
.order-file-review-main { display: grid; gap: 3px; min-width: 0; }
.order-file-review-main a {
  min-height: 0;
  padding: 0;
  overflow: hidden;
  color: #075985;
  background: transparent;
  border: 0;
  border-radius: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.order-file-review-main small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.order-file-review-actions { display: flex; align-items: center; gap: 6px; }
.file-review-state {
  display: inline-flex;
  min-height: 23px;
  align-items: center;
  padding: 0 7px;
  color: #64748b;
  background: #eef2f6;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
}
.file-review-state.is-danger { color: #b42318; background: #fee4e2; }
.file-review-state.is-approved { color: #067647; background: #dff5e8; }
.file-review-state.is-confirmed { color: #175cd3; background: #dbeafe; }
.order-file-review-card p {
  grid-column: 1 / -1;
  margin: 0;
  overflow: hidden;
  color: #b42318;
  font-size: 10px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 12px 10px; border-bottom: 1px solid #edf0f2; text-align: left; white-space: nowrap; }
th { color: #8a949c; background: #f8f9fa; font-size: 11px; font-weight: 700; }
tbody tr:hover { background: #fbfcfc; }
.tag { display: inline-flex; align-items: center; min-height: 25px; padding: 0 8px; border-radius: 5px; background: #edf5f8; color: #277087; font-size: 11px; }
.tag.warn { color: #ac6610; background: #fff4df; }
.tier-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 999px; border: 1px solid #d9e9ff; background: #f3f9ff; color: #1169b6; font-size: 11px; font-weight: 900; white-space: nowrap; }
.tier-platinum { color: #475467; background: linear-gradient(180deg, #f8fafc, #edf2f7); border-color: #d7dee8; }
.tier-diamond { color: #7c3aed; background: linear-gradient(180deg, #f8f5ff, #ede9fe); border-color: #ddd6fe; box-shadow: 0 6px 16px rgba(124, 58, 237, .12); }
.tier-help { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 12px; }
.tier-filter {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  color: #415064;
  background: linear-gradient(180deg, #fff, #f7fafc);
  border: 1px solid #dce6f1;
  border-radius: 999px;
  box-shadow: 0 5px 12px rgba(15, 23, 42, .04);
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, color .18s ease, background .18s ease, border-color .18s ease;
}
.tier-filter:hover { transform: translateY(-2px); border-color: #bcd5f0; box-shadow: 0 10px 20px rgba(15, 23, 42, .09); }
.tier-filter.active {
  color: #fff;
  background: linear-gradient(135deg, #111827, #263241);
  border-color: #111827;
  box-shadow: 0 12px 26px rgba(17, 24, 39, .2);
  transform: translateY(-1px) scale(1.03);
}
.tier-filter.is-popping { animation: tier-filter-pop .26s ease; }
@keyframes tier-filter-pop {
  0% { transform: scale(.96); }
  55% { transform: translateY(-3px) scale(1.08); }
  100% { transform: translateY(-1px) scale(1.03); }
}
#partners .dual-module {
  align-items: stretch;
}
#partners .partner-equal-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#partners .customer-panel {
  height: clamp(420px, calc(100vh - 250px), 520px);
}
#partners .member-tier-panel {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: stretch;
  height: auto;
}
#partners .partner-equal-panel .panel-head,
#partners .partner-equal-panel .compact-form,
#partners .partner-equal-panel .tier-help {
  flex: 0 0 auto;
}
#partners .partner-equal-panel .admin-scroll-table {
  min-height: 0;
  flex: 1 1 auto;
}
#partners .partner-equal-panel .admin-scroll-table .table-wrap {
  height: 100%;
  max-height: none;
}
#partners .member-tier-panel .admin-scroll-table .table-wrap {
  overflow-y: scroll;
  scrollbar-gutter: stable both-edges;
}
.member-tier-panel table small { display: block; margin-top: 3px; }
.money { font-weight: 800; }
.progress { width: 110px; height: 6px; overflow: hidden; border-radius: 4px; background: #edf0f2; }
.progress i { display: block; height: 100%; background: var(--green); }

.split-layout { display: grid; grid-template-columns: minmax(320px, .72fr) minmax(0, 1.4fr); gap: 16px; align-items: start; }
.quote-layout { display: grid; grid-template-columns: minmax(330px, .75fr) minmax(0, 1.25fr); gap: 16px; align-items: stretch; margin-bottom: 16px; }
.quote-layout > * { margin-bottom: 0; }
.stack-form { display: grid; gap: 15px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#products .product-layout {
  grid-template-columns: minmax(430px, .9fr) minmax(640px, 1.75fr);
  gap: 18px;
  align-items: stretch;
}
#products .product-layout > .panel {
  margin-bottom: 0;
}
.product-create-panel,
.product-list-panel {
  padding: 0;
  overflow: hidden;
  border-color: #dce5ee;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  box-shadow: 0 16px 38px rgba(18, 28, 38, .06);
}
.product-create-panel { overflow: visible; }
.product-list-panel {
  min-height: 0;
  height: var(--product-list-height, calc(100vh - 132px));
  max-height: var(--product-list-height, calc(100vh - 132px));
  display: flex;
  flex-direction: column;
}
.product-create-panel .panel-head,
.product-list-panel .panel-head {
  min-height: 76px;
  margin: 0;
  padding: 20px 22px 16px;
  align-items: center;
  border-bottom: 1px solid #edf1f5;
  background: #fff;
}
.product-create-panel .panel-head span,
.product-list-panel .panel-head span {
  color: #83909b;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .4px;
}
.product-create-panel .panel-head h2,
.product-list-panel .panel-head h2 {
  margin-top: 5px;
  color: #071522;
  font-size: 20px;
}
.product-list-panel .panel-tools {
  min-width: 250px;
  justify-content: flex-end;
}
.product-list-panel .search-input {
  width: 220px;
  height: 38px;
  padding-left: 14px;
  border-color: #dbe5ef;
  border-radius: 7px;
  background: #fbfcfd;
  font-weight: 800;
}
.product-list-panel .count-badge {
  height: 34px;
  min-width: 38px;
  border-radius: 7px;
  background: #eef3f7;
  color: #34424e;
  font-weight: 900;
}
.product-list-panel .product-list-pagination {
  width: auto;
  min-height: 62px;
  flex: 0 0 auto;
  margin: 0 18px 18px;
  padding: 10px 12px;
}
.sku-upload-board {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: 14px;
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid #e4eaf1;
  border-radius: 8px;
  background:
    linear-gradient(135deg, #fff7ef 0%, #fff 46%, #f5f9ff 100%);
}
.sku-upload-copy {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}
.sku-upload-copy > span {
  color: var(--accent-dark);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .4px;
}
.sku-upload-copy strong {
  color: #172027;
  font-size: 18px;
  font-weight: 900;
}
.sku-upload-copy p {
  margin: 0;
  color: #6c7680;
  font-size: 12px;
  line-height: 1.7;
}
.sku-template-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding-top: 4px;
}
.sku-template-row button {
  min-height: 30px;
  padding: 0 10px;
  color: #46515a;
  background: #fff;
  border: 1px solid #e0e7ef;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}
.sku-template-row button:hover,
.sku-template-row button.active {
  color: #172027;
  background: #ffe66d;
  border-color: #ffd44d;
}
.sku-upload-actions {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.sku-upload-actions .secondary,
.sku-image-upload {
  width: 100%;
  min-height: 40px;
}
.sku-image-upload {
  display: grid;
  gap: 4px;
  place-items: center;
  padding: 12px;
  color: #172027;
  background: #fff;
  border: 1px dashed #cbd5df;
  border-radius: 8px;
  text-align: center;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.sku-image-upload:hover {
  background: #fffaf0;
  border-color: #ffd15e;
  box-shadow: 0 8px 18px rgba(24, 32, 38, .05);
}
.sku-image-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.sku-image-upload:focus-within {
  border-color: #dcae00;
  box-shadow: 0 0 0 3px rgba(255, 216, 61, .22);
}
.sku-image-upload span {
  color: #172027;
  font-weight: 900;
}
.sku-image-upload small {
  color: #7a858d;
  font-size: 11px;
  line-height: 1.4;
}
.sku-image-preview {
  display: grid;
  min-height: 128px;
  overflow: hidden;
  place-items: center;
  border: 1px solid #e5ebf2;
  border-radius: 8px;
  background: #f8fafc;
}
.sku-image-preview img {
  width: 100%;
  height: 118px;
  object-fit: cover;
}
.sku-image-preview span {
  max-width: 100%;
  padding: 8px;
  overflow: hidden;
  color: #7a858d;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.product-form {
  padding-top: 2px;
}
.product-create-panel .sku-upload-board {
  margin: 18px 18px 0;
  padding: 18px;
  border-color: #dfe8f1;
  background:
    radial-gradient(circle at top right, rgba(255, 201, 77, .20), transparent 38%),
    linear-gradient(135deg, #fffaf1 0%, #fff 48%, #f6fbff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}
.product-create-panel .sku-upload-copy > span {
  color: #ec5b36;
}
.product-create-panel .sku-upload-copy strong {
  font-size: 19px;
}
.product-create-panel .sku-category-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 4px;
  color: #263341;
  font-size: 12px;
  font-weight: 900;
}
.product-create-panel .sku-category-head small {
  color: #8a96a3;
  font-size: 10px;
  font-weight: 800;
}
.product-create-panel .sku-template-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding-top: 0;
}
.product-create-panel .sku-template-row button {
  --category-color: #2f80ed;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 40px;
  min-width: 0;
  padding: 4px 7px 4px 25px;
  overflow: visible;
  color: #344256;
  border-color: #dbe5ef;
  border-radius: 8px;
  background: linear-gradient(180deg, #fff 0%, #f8fbfe 100%);
  box-shadow: 0 3px 9px rgba(15, 23, 42, .035);
  text-align: left;
  font-size: 11px;
  line-height: 1.2;
  text-overflow: clip;
  white-space: normal;
  word-break: break-all;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
.product-create-panel .sku-template-row button::before {
  content: "";
  position: absolute;
  left: 8px;
  width: 7px;
  height: 7px;
  background: var(--category-color);
  border: 3px solid color-mix(in srgb, var(--category-color) 16%, white);
  border-radius: 3px;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--category-color) 28%, transparent);
}
.product-create-panel .sku-template-row button::after {
  display: none;
}
.product-create-panel .sku-template-row button:nth-child(3n + 2) { --category-color: #8b5cf6; }
.product-create-panel .sku-template-row button:nth-child(3n + 3) { --category-color: #16a36a; }
.product-create-panel .sku-template-row button:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}
.product-create-panel .sku-template-row button:hover {
  color: #172027;
  background: #fff;
  border-color: color-mix(in srgb, var(--category-color) 44%, #dbe5ef);
  box-shadow: 0 8px 16px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
}
.product-create-panel .sku-template-row button:focus-visible {
  outline: 3px solid rgba(47, 128, 237, .2);
  outline-offset: 2px;
}
.product-create-panel .sku-template-row button.active {
  color: #172027;
  background: linear-gradient(180deg, #fff4b5 0%, #ffe16a 100%);
  border-color: #ffc83d;
  box-shadow: 0 8px 18px rgba(255, 197, 64, .24);
  transform: none;
}
.product-create-panel .sku-upload-actions .secondary {
  height: 42px;
  color: #172027;
  background: #eef2f5;
}
.product-create-panel .sku-image-upload {
  min-height: 86px;
  background: rgba(255, 255, 255, .72);
  border-style: solid;
}
.product-create-panel .sku-image-preview {
  min-height: 126px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(247, 250, 252, .96));
}
.product-create-panel .product-form {
  padding: 18px;
}
.product-create-panel .primary {
  min-height: 44px;
  border-radius: 7px;
  background: #172027;
}
.product-create-panel .primary:hover {
  background: #26333b;
}
.product-create-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  color: #7b5b00;
  border: 1px solid #f3d56a;
  border-radius: 999px;
  background: #fff8d7;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.product-create-panel .sku-builder {
  display: grid;
  gap: 14px;
  padding: 16px;
  background: #f7f9fb;
}
.sku-form-card {
  min-width: 0;
  padding: 15px;
  border: 1px solid #dfe7ef;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .035);
}
.sku-section-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 13px;
}
.sku-section-head > b {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  color: #172027;
  border-radius: 10px;
  background: #ffdc42;
  font-size: 11px;
  font-weight: 1000;
}
.sku-section-head h3 {
  margin: 0;
  color: #071522;
  font-size: 16px;
  line-height: 1.25;
}
.sku-section-head p {
  margin: 3px 0 0;
  color: #788591;
  font-size: 10px;
  line-height: 1.45;
}
.sku-create-modes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin-bottom: 13px;
  padding: 4px;
  border: 1px solid #e1e8ef;
  border-radius: 9px;
  background: #f4f7fa;
}
.sku-create-modes button {
  min-height: 34px;
  color: #687581;
  border: 0;
  border-radius: 7px;
  background: transparent;
  font-size: 12px;
  font-weight: 900;
}
.sku-create-modes button.active {
  color: #172027;
  background: #fff;
  box-shadow: 0 3px 10px rgba(15, 23, 42, .09);
}
.sku-builder .sku-category-head,
.sku-popular-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: #263341;
  font-size: 11px;
  font-weight: 900;
}
.sku-builder .sku-category-head small,
.sku-popular-head small {
  color: #8a96a3;
  font-size: 9px;
  font-weight: 800;
  text-align: right;
}
.sku-builder .sku-template-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  padding: 0;
}
.sku-builder .sku-template-row button,
.sku-builder .sku-template-row button:last-child:nth-child(odd) {
  --category-color: #2f80ed;
  position: relative;
  grid-column: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  min-width: 0;
  min-height: 43px;
  padding: 7px 7px 7px 10px;
  color: #344256;
  border: 1px solid #dce5ed;
  border-radius: 8px;
  background: linear-gradient(180deg, #fff, #f9fbfd);
  box-shadow: none;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.25;
  text-align: left;
  transform: none;
}
.sku-builder .sku-template-row button::before,
.sku-builder .sku-template-row button::after { display: none; }
.sku-builder .sku-template-row button > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sku-builder .sku-template-row button > small {
  display: grid;
  min-width: 24px;
  height: 22px;
  padding: 0 5px;
  flex: 0 0 auto;
  place-items: center;
  color: #6d7882;
  border-radius: 7px;
  background: #eef3f7;
  font-size: 9px;
  font-weight: 900;
}
.sku-builder .sku-template-row button:hover {
  color: #172027;
  border-color: #f2cf4d;
  background: #fffdf4;
  box-shadow: 0 7px 14px rgba(15, 23, 42, .07);
  transform: translateY(-1px);
}
.sku-builder .sku-template-row button.active {
  color: #172027;
  border-color: #f4c832;
  background: linear-gradient(135deg, #fff8d4, #ffe478);
  box-shadow: inset 3px 0 #172027, 0 7px 16px rgba(240, 184, 18, .14);
}
.sku-builder .sku-template-row button.active > small {
  color: #172027;
  background: rgba(255, 255, 255, .72);
}
.sku-popular-head {
  margin-top: 15px;
}
.sku-popular-templates {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sku-popular-templates button {
  min-height: 30px;
  padding: 0 9px;
  color: #55626e;
  border: 1px solid #dce5ed;
  border-radius: 999px;
  background: #fff;
  font-size: 10px;
  font-weight: 850;
}
.sku-popular-templates button:hover,
.sku-popular-templates button.active {
  color: #172027;
  border-color: #f0c62f;
  background: #fff7c7;
}
.sku-library-search {
  display: grid;
  gap: 6px;
  color: #25313d;
  font-size: 11px;
  font-weight: 900;
}
.sku-library-search input {
  height: 40px;
  padding: 0 12px;
  border-color: #d8e2ec;
  background: #fff;
}
.sku-clone-tip {
  margin: 8px 0 10px;
  color: #73808c;
  font-size: 10px;
  line-height: 1.5;
}
.sku-clone-results {
  display: grid;
  gap: 7px;
  max-height: 330px;
  overflow-y: auto;
  padding-right: 2px;
}
.sku-clone-results > button {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  min-width: 0;
  min-height: 60px;
  padding: 7px;
  color: #172027;
  border: 1px solid #e0e7ee;
  border-radius: 9px;
  background: #fff;
  text-align: left;
}
.sku-clone-results > button:hover {
  border-color: #f2cc42;
  background: #fffdf5;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .06);
}
.sku-clone-thumb {
  display: grid;
  width: 46px;
  height: 46px;
  overflow: hidden;
  place-items: center;
  color: #9a7b13;
  border-radius: 8px;
  background: #fff5bd;
  font-size: 9px;
  font-weight: 900;
}
.sku-clone-thumb img { width: 100%; height: 100%; object-fit: contain; background: #f8fafc; }
.sku-clone-copy { display: grid; gap: 2px; min-width: 0; }
.sku-clone-copy b,
.sku-clone-copy small,
.sku-clone-copy em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sku-clone-copy b { font-size: 11px; }
.sku-clone-copy small { color: #1672c7; font-size: 9px; font-weight: 900; }
.sku-clone-copy em { color: #7b8791; font-size: 9px; font-style: normal; }
.sku-clone-results > button > strong {
  color: #172027;
  font-size: 10px;
}
.sku-clone-empty {
  padding: 24px 12px;
  color: #7d8994;
  border: 1px dashed #d8e2ec;
  border-radius: 9px;
  background: #f8fafc;
  text-align: center;
  font-size: 10px;
}
.sku-core-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px;
  gap: 13px;
  align-items: start;
}
.sku-field-grid,
.sku-advanced-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}
.sku-core-layout .sku-field-grid { grid-template-columns: 1fr; }
.sku-field-grid label,
.sku-advanced-grid label {
  min-width: 0;
  color: #34414d;
  font-size: 10px;
  font-weight: 850;
}
.sku-field-grid input,
.sku-field-grid select,
.sku-advanced-grid input,
.sku-advanced-grid select,
.sku-advanced-grid textarea {
  margin-top: 5px;
  border-color: #d9e3ec;
  background: #fbfcfd;
  font-weight: 750;
}
.sku-field-grid input:focus,
.sku-field-grid select:focus,
.sku-advanced-grid input:focus,
.sku-advanced-grid select:focus,
.sku-advanced-grid textarea:focus {
  border-color: #efc52f;
  box-shadow: 0 0 0 3px rgba(255, 216, 61, .16);
}
.field-wide { grid-column: 1 / -1; }
.sku-input-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-top: 5px;
}
.sku-input-action input {
  min-width: 0;
  margin-top: 0;
  border-radius: 7px 0 0 7px;
}
.sku-input-action button {
  min-width: 76px;
  padding: 0 8px;
  color: #172027;
  border: 1px solid #efc632;
  border-left: 0;
  border-radius: 0 7px 7px 0;
  background: #ffe16a;
  font-size: 10px;
  font-weight: 900;
}
.sku-image-field {
  min-width: 0;
  margin: 0;
  padding: 10px;
  border: 1px solid #dfe7ef;
  border-radius: 9px;
  background: #fafcfd;
}
.sku-image-field legend {
  padding: 0 5px;
  color: #34414d;
  font-size: 10px;
  font-weight: 900;
}
.sku-image-field .sku-image-upload {
  display: block;
  width: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px dashed #b8c7d5;
  border-radius: 8px;
  background: #fff;
}
.sku-image-field .sku-image-upload:hover,
.sku-image-field .sku-image-upload.is-dragging {
  border-color: #e8b800;
  background: #fffdf2;
  box-shadow: 0 7px 16px rgba(15, 23, 42, .07);
}
.sku-image-field .sku-image-upload.is-uploading { opacity: .62; pointer-events: none; }
.sku-image-field .sku-image-upload.is-uploading .sku-image-preview::after {
  content: "正在上传…";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #172027;
  background: rgba(255, 248, 210, .88);
  font-size: 11px;
  font-weight: 900;
}
.sku-image-field .sku-image-preview {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 132px;
  aspect-ratio: 1;
  place-content: center;
  gap: 4px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(135deg, #fff, #f3f7fa);
  text-align: center;
}
.sku-image-field .sku-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sku-image-preview .sku-upload-icon {
  display: grid;
  width: 34px;
  height: 34px;
  margin: 0 auto 3px;
  padding: 0;
  overflow: visible;
  place-items: center;
  color: #172027;
  border-radius: 11px;
  background: #ffdc42;
  font-size: 18px;
  font-weight: 500;
}
.sku-image-preview strong { color: #26323d; font-size: 11px; }
.sku-image-preview small { color: #8b97a1; font-size: 8px; }
.sku-image-ready {
  position: absolute;
  right: 6px;
  bottom: 6px;
  padding: 4px 7px;
  color: #0c704c;
  border-radius: 999px;
  background: rgba(232, 250, 242, .94);
  font-size: 8px;
  font-weight: 900;
}
.sku-image-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 7px;
}
.sku-image-upload:not(.has-image) + .sku-image-actions { display: none; }
.sku-image-actions button {
  min-height: 28px;
  padding: 0 5px;
  color: #51606d;
  border: 1px solid #dce5ed;
  border-radius: 6px;
  background: #fff;
  font-size: 9px;
  font-weight: 850;
}
.sku-image-field > small {
  display: block;
  margin-top: 7px;
  color: #89949e;
  font-size: 8px;
  line-height: 1.4;
}
.sku-business-fields { margin-bottom: 11px; }
.sku-pricing-hint {
  display: grid;
  gap: 2px;
  padding: 10px 11px;
  color: #785900;
  border-left: 3px solid #efbd17;
  border-radius: 7px;
  background: #fff9df;
}
.sku-pricing-hint.is-auto {
  color: #086b4b;
  border-left-color: #24a475;
  background: #edf9f4;
}
.sku-pricing-hint b { font-size: 10px; }
.sku-pricing-hint span { font-size: 9px; line-height: 1.5; }
.sku-advanced-fields {
  margin-top: 11px;
  border: 1px solid #e1e8ef;
  border-radius: 8px;
  background: #fbfcfd;
}
.sku-advanced-fields summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 11px;
  color: #2e3b47;
  cursor: pointer;
  font-size: 10px;
  font-weight: 900;
  list-style: none;
}
.sku-advanced-fields summary::-webkit-details-marker { display: none; }
.sku-advanced-fields summary::after { content: "展开"; color: #8b6b00; font-size: 9px; }
.sku-advanced-fields[open] summary::after { content: "收起"; }
.sku-advanced-fields summary small { color: #89959f; font-size: 8px; }
.sku-advanced-grid {
  padding: 0 11px 12px;
  border-top: 1px solid #e9eef3;
  padding-top: 11px;
}
.sku-savebar {
  position: sticky;
  bottom: 10px;
  z-index: 6;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  padding: 11px;
  border: 1px solid #d8e1e9;
  border-radius: 10px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 -8px 24px rgba(15, 23, 42, .10);
  backdrop-filter: blur(8px);
}
.sku-savebar > div {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.sku-savebar > div b { color: #725700; font-size: 10px; }
.sku-savebar > div b.is-complete { color: #087451; }
.sku-savebar > div small { color: #87939d; font-size: 8px; text-align: right; }
.sku-savebar button {
  width: 100%;
  min-width: 0;
  min-height: 36px;
  padding: 0 7px;
  border-radius: 7px;
  font-size: 10px;
  font-weight: 900;
}
.sku-savebar .secondary {
  color: #172027;
  border-color: #efc62c;
  background: #fff5b5;
}
.product-list-panel #productTable {
  min-height: 0;
  padding: 18px;
  display: flex;
  flex: 1;
  flex-direction: column;
}
.product-list-panel #productTable .table-wrap {
  min-height: 0;
  height: 100%;
  max-height: 100%;
  flex: 1;
  overflow-x: auto;
  overflow-y: scroll;
  scrollbar-gutter: stable;
  scrollbar-color: #96a6b8 #eef3f7;
  border-color: #dfe7ef;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}
.product-list-panel #productTable .table-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.product-list-panel #productTable .table-wrap::-webkit-scrollbar-track {
  background: #eef3f7;
  border-radius: 8px;
}
.product-list-panel #productTable .table-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #b8c4d0, #8ea0b2) content-box;
  border: 2px solid #eef3f7;
  border-radius: 8px;
}
.product-list-panel #productTable .table-wrap::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #9aaabc, #718397) content-box;
}
.product-list-panel #productTable table {
  min-width: 1180px;
}
.product-list-panel #productTable th {
  height: 42px;
  background: #f5f7f9;
  color: #74818d;
  font-size: 11px;
}
.product-list-panel #productTable td {
  height: 76px;
  padding-top: 9px;
  padding-bottom: 9px;
}
.product-list-panel #productTable tbody tr:hover {
  background: #fffaf2;
}
.product-list-panel #productTable td:first-child b {
  color: #071522;
  font-size: 13px;
}
.product-list-panel #productTable th:nth-child(2),
.product-list-panel #productTable td:nth-child(2) { min-width: 330px; }
.product-library-product {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.product-library-thumb {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  overflow: hidden;
  color: #8a97a5;
  border: 1px solid #dce5ed;
  border-radius: 9px;
  background: #f4f7fa;
  font-size: 10px;
  font-weight: 900;
}
.product-library-thumb img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.product-library-copy { display: grid; min-width: 0; gap: 3px; }
.product-library-copy b,
.product-library-copy small,
.product-library-copy em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-library-copy b { color: #0b1725; font-size: 14px; }
.product-library-copy small { color: #536273; font-size: 11px; font-style: normal; }
.product-library-copy em { color: #8a97a5; font-size: 11px; font-style: normal; }
.grid-form { display: grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); gap: 14px; }
.align-end { align-self: end; }
.tab-bar { display: flex; gap: 4px; margin-bottom: 14px; border-bottom: 1px solid var(--line); }
.subtab { padding: 10px 16px; color: var(--muted); background: transparent; border-radius: 0; border-bottom: 2px solid transparent; }
.subtab.active { color: var(--accent-dark); border-bottom-color: var(--accent); }
.form-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 13px; }
.form-footer small { color: var(--muted); }
.quote-result-empty, .quote-result-card { min-height: 100%; border-radius: 8px; }
.quote-result-empty { display: grid; place-content: center; text-align: center; padding: 40px; border: 1px dashed #cad1d6; color: var(--muted); background: #f8fafb; }
.quote-result-empty h2 { color: var(--ink); margin: 13px 0 5px; font-size: 19px; }
.quote-result-empty p { max-width: 380px; line-height: 1.7; font-size: 13px; }
.quote-symbol { width: 54px; height: 54px; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--soft-coral); color: var(--accent); font-size: 24px; font-weight: 900; }
.quote-result-card { padding: 28px; color: #fff; background: #223039; }
.quote-result-card > span { color: #95a6b1; font-size: 12px; }
.quote-price { margin: 8px 0 22px; font-size: 43px; font-weight: 900; }
.quote-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.quote-grid div { padding: 12px; border: 1px solid #3a4851; border-radius: 6px; }
.quote-grid span { display: block; color: #94a4ae; font-size: 11px; margin-bottom: 5px; }
.panel-caption {
  max-width: 420px;
  color: #7b8791;
  font-size: 12px;
  line-height: 1.6;
  text-align: right;
}
.quote-rule-panel {
  border-color: #dfe7ef;
  box-shadow: 0 16px 36px rgba(15, 23, 42, .06);
}
.quote-rule-form {
  display: grid;
  gap: 14px;
}
.quote-rule-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.quote-rule-group {
  min-width: 0;
  margin: 0;
  padding: 15px;
  border: 1px solid #e1e8f0;
  border-radius: 8px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}
.quote-rule-group-wide {
  grid-column: 1 / -1;
}
.quote-rule-group legend {
  padding: 0 8px;
  color: #10202c;
  font-size: 13px;
  font-weight: 900;
}
.quote-rule-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 12px;
}
.quote-rule-grid.two {
  grid-template-columns: repeat(2, minmax(150px, 1fr));
}
.quote-rule-form label {
  gap: 7px;
  color: #21303c;
  font-size: 12px;
  font-weight: 800;
}
.quote-rule-form input,
.quote-rule-form select {
  height: 42px;
  border-radius: 7px;
  background: #fff;
  border-color: #d7e2ec;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}
.quote-rule-form input:focus,
.quote-rule-form select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(236, 91, 54, .12);
}
.quote-rule-actions {
  grid-column: 2 / -1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 2px;
  padding-top: 0;
}
.quote-rule-actions button {
  width: 190px;
  height: 42px;
  padding: 0 24px;
  border-radius: 8px;
  font-weight: 900;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.quote-rule-actions .secondary {
  color: #26333b;
  background: #fff;
  border: 1px solid #d9e3ec;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .05);
}
.quote-rule-actions .secondary:hover {
  color: #172027;
  background: #f8fafc;
  border-color: #c8d5df;
  transform: translateY(-1px);
}
.quote-rule-actions .primary {
  background: linear-gradient(180deg, #f15f3d, #e94f2d);
  box-shadow: 0 12px 24px rgba(236, 91, 54, .22);
}
.quote-rule-actions .primary:hover {
  background: linear-gradient(180deg, #e95533, #d94727);
  box-shadow: 0 14px 26px rgba(236, 91, 54, .28);
  transform: translateY(-1px);
}

/* Automatic quote workspace -------------------------------------------- */
#quotes .quote-workspace {
  padding: 0;
  overflow: hidden;
  border: 1px solid #dfe6ef;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(28, 39, 55, .07);
}

#quotes .quote-workspace-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 24px;
  border-bottom: 1px solid #e4e9f0;
  background:
    radial-gradient(circle at 8% 0, rgba(255, 220, 55, .18), transparent 31%),
    linear-gradient(135deg, #fffdf5 0%, #fff 58%, #f8fafc 100%);
}

#quotes .quote-workspace-title {
  min-width: 260px;
}

#quotes .quote-workspace-title > span {
  display: block;
  margin-bottom: 4px;
  color: #9a6a00;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .11em;
}

#quotes .quote-workspace-title h2 {
  margin: 0;
  color: #111d2e;
  font-size: 25px;
  line-height: 1.25;
}

#quotes .quote-workspace-title p {
  margin: 6px 0 0;
  color: #64748b;
  font-size: 14px;
  line-height: 1.6;
}

#quotes .quote-workspace-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(145px, 1fr));
  gap: 6px;
  min-width: min(100%, 520px);
  padding: 5px;
  border: 1px solid #dde4ec;
  border-radius: 12px;
  background: #f1f4f8;
}

#quotes .quote-workspace-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #536174;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

#quotes .quote-workspace-tabs button:hover {
  color: #121d2c;
  background: rgba(255, 255, 255, .72);
}

#quotes .quote-workspace-tabs button:focus-visible {
  outline: 3px solid rgba(255, 211, 38, .32);
  outline-offset: 2px;
}

#quotes .quote-workspace-tabs button b {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border: 1px solid #dce3eb;
  border-radius: 8px;
  background: #fff;
  color: #8390a1;
  font-size: 11px;
}

#quotes .quote-workspace-tabs button.active {
  border-color: #e8c332;
  background: #fff;
  color: #111d2e;
  box-shadow: 0 7px 18px rgba(28, 39, 55, .09);
}

#quotes .quote-workspace-tabs button.active b {
  border-color: #ffd524;
  background: #ffd524;
  color: #111d2e;
}

#quotes .quote-workspace-body {
  min-height: 500px;
  padding: 22px 24px 26px;
  background: #fff;
}

#quotes .quote-workspace-panel {
  display: block;
  min-width: 0;
  min-height: 0;
  margin: 0;
}

#quotes .quote-workspace-panel[hidden] {
  display: none !important;
}

#quotes .quote-workspace-panel > .panel-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 18px;
  padding: 0 0 15px;
  border-bottom: 1px solid #e5eaf0;
}

#quotes .quote-workspace-panel > .panel-head span {
  display: block;
  margin-bottom: 3px;
  color: #a87400;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .09em;
}

#quotes .quote-workspace-panel > .panel-head h2 {
  margin: 0;
  color: #111d2e;
  font-size: 21px;
  line-height: 1.3;
}

#quotes .quote-workspace-panel .quote-layout {
  margin: 0;
}

#quotes .quote-workspace-panel.quote-rule-panel {
  border: 0;
  box-shadow: none;
}

#quotes .quote-workspace-panel > .admin-scroll-table {
  border: 1px solid #e0e7ef;
  border-radius: 12px;
  background: #fff;
}

#quotes .quote-rule-pagination,
#quotes .quote-history-pagination {
  margin-top: 12px;
  border-color: #e0e7ef;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
}

#quotes [data-quote-workspace-panel="history"] > .admin-scroll-table {
  min-height: 430px;
}

#quotes #quoteTable .order-product-cell {
  min-width: 290px;
  gap: 12px;
}

#quotes #quoteTable .order-product-thumb {
  width: 60px;
  height: 60px;
  flex-basis: 60px;
  border-radius: 10px;
}

#quotes #quoteTable .order-product-meta b {
  font-size: 13px;
  line-height: 1.45;
}

#quotes #quoteTable .order-product-meta small {
  max-width: 235px;
}

#quotes #quoteTable td {
  padding-top: 13px;
  padding-bottom: 13px;
  vertical-align: middle;
}

@media (max-width: 980px) {
  #quotes .quote-workspace-head {
    align-items: flex-start;
    flex-direction: column;
  }
  #quotes .quote-workspace-tabs {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 620px) {
  #quotes .quote-workspace-head,
  #quotes .quote-workspace-body {
    padding: 16px;
  }
  #quotes .quote-workspace-title h2 { font-size: 22px; }
  #quotes .quote-workspace-tabs {
    grid-template-columns: 1fr;
  }
  #quotes .quote-workspace-tabs button {
    justify-content: flex-start;
  }
  #quotes .quote-workspace-panel > .panel-head {
    align-items: flex-start;
    flex-direction: column;
  }
  #quotes .panel-caption {
    text-align: left;
  }
}

.finance-metrics { grid-template-columns: repeat(3, 1fr); }
.finance-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 16px; }
.finance-profit-module {
  padding: 0;
  overflow: hidden;
  border-color: #d9e2ec;
  background: #fff;
  box-shadow: 0 18px 42px rgba(26, 39, 54, .07);
}

.finance-profit-head {
  display: flex;
  min-height: 88px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 24px;
  background:
    radial-gradient(circle at 86% 15%, rgba(255, 216, 47, .2), transparent 210px),
    linear-gradient(105deg, #fffdf1 0%, #fff 45%, #f9fbfd 100%);
  border-bottom: 1px solid #dfe6ee;
}

.finance-profit-head > div {
  display: grid;
  gap: 3px;
  padding-left: 13px;
  border-left: 4px solid #ffd329;
}

.finance-profit-head span,
.finance-profit-block > header span,
.finance-profit-ranking > header span {
  color: #9b7000;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .1em;
}

.finance-profit-head h2 {
  margin: 0;
  color: #172234;
  font-size: 22px;
}

.finance-profit-head p {
  margin: 0;
  color: #7b8795;
  font-size: 11px;
}

.finance-profit-head > em {
  flex: 0 0 auto;
  padding: 7px 11px;
  color: #6e5a12;
  background: #fff5bf;
  border: 1px solid #ecd260;
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

.finance-profit-overview {
  display: grid;
  grid-template-columns: minmax(360px, .82fr) minmax(560px, 1.18fr);
  gap: 0;
  padding: 0;
  background: #fff;
}

.finance-profit-block {
  min-width: 0;
  padding: 20px 22px 22px;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.finance-profit-block.platform {
  border-left: 1px solid #dfe6ee;
}

.finance-profit-block > header {
  display: grid;
  gap: 3px;
  min-height: 43px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid #edf1f5;
}

.finance-profit-block > header h3,
.finance-profit-ranking > header h3 {
  margin: 0;
  color: #172234;
  font-size: 17px;
}

.finance-profit-block #platformTable {
  max-height: 250px;
  border: 1px solid #e1e7ee;
  border-radius: 8px;
}

.finance-profit-ranking {
  min-width: 0;
  margin: 0;
  padding: 20px 22px 22px;
  background: #fff;
  border: 0;
  border-top: 1px solid #dfe6ee;
  border-radius: 0;
  box-shadow: none;
}

.finance-profit-ranking > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid #edf1f5;
}

.finance-profit-ranking > header > div {
  display: grid;
  gap: 3px;
}

.finance-profit-ranking > header > small {
  color: #8a96a5;
  font-size: 10px;
}

.finance-profit-ranking #skuProfitTable {
  max-height: none;
  border: 0;
  border-radius: 0;
}

.finance-profit-ranking #skuProfitTable .order-product-cell {
  min-width: 300px;
  gap: 13px;
}

.finance-profit-ranking #skuProfitTable .order-product-thumb {
  width: 62px;
  height: 62px;
  flex-basis: 62px;
  border-radius: 11px;
}

.finance-profit-ranking #skuProfitTable .order-product-meta b {
  font-size: 14px;
  line-height: 1.45;
}

.finance-profit-ranking #skuProfitTable .order-product-meta small {
  max-width: 260px;
}

.finance-profit-ranking #skuProfitTable td {
  padding-top: 13px;
  padding-bottom: 13px;
  vertical-align: middle;
}

.finance-profit-ranking #skuProfitTable .table-wrap {
  max-height: clamp(340px, calc(100vh - 330px), 500px);
  overflow: auto;
  border: 1px solid #dfe6ee;
  border-radius: 10px 10px 0 0;
  scrollbar-gutter: stable;
}

.finance-profit-ranking .finance-sku-pagination {
  min-height: 58px;
  gap: 12px;
  margin-top: -1px;
  padding: 10px 14px;
  background: linear-gradient(180deg, #fff 0%, #fafbfd 100%);
  border-color: #dfe6ee;
  border-radius: 0 0 10px 10px;
  box-shadow: none;
}

.finance-profit-ranking .finance-sku-pagination > span {
  flex: 0 0 auto;
  min-width: 62px;
  color: #667382;
}

.finance-profit-ranking .finance-sku-pagination .dashboard-order-pages,
.finance-profit-ranking .finance-sku-pagination .dashboard-page-numbers {
  gap: 6px;
}

.finance-profit-ranking .finance-sku-pagination .dashboard-order-pages button,
.finance-profit-ranking .finance-sku-pagination .dashboard-page-gap {
  min-width: 36px;
  height: 36px;
  border-radius: 7px;
}

.finance-profit-ranking .finance-sku-pagination select {
  width: 112px;
  height: 36px;
  border-radius: 7px;
}

@media (max-width: 1100px) {
  .finance-profit-overview {
    grid-template-columns: 1fr;
  }
  .finance-profit-block.platform {
    border-top: 1px solid #dfe6ee;
    border-left: 0;
  }
}

@media (max-width: 680px) {
  .finance-profit-head,
  .finance-profit-ranking > header {
    align-items: flex-start;
    flex-direction: column;
  }
  .finance-profit-overview {
    padding: 0;
  }
  .finance-profit-ranking {
    margin: 0;
  }
}

.dual-module { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.production-qc-workspace {
  padding: 0;
  overflow: hidden;
  border-color: #d9e3ee;
  background: #fff;
  box-shadow: 0 18px 42px rgba(22, 40, 66, .08);
}
.production-qc-head {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(560px, 1.45fr);
  gap: 28px;
  align-items: center;
  padding: 22px 28px;
  background:
    radial-gradient(circle at 4% 16%, rgba(255, 216, 40, .16), transparent 24%),
    linear-gradient(110deg, #fffdf4 0%, #fff 48%, #f8fbff 100%);
  border-bottom: 1px solid var(--line);
}
.production-qc-head > div:first-child {
  display: grid;
  align-content: center;
  gap: 5px;
  padding-left: 14px;
  border-left: 4px solid #ffd629;
}
.production-qc-head span,
.production-qc-panel-head span {
  color: #9b6c00;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.production-qc-head h2 {
  margin: 0;
  color: var(--ink);
  font-size: 25px;
  line-height: 1.15;
}
.production-qc-head p,
.production-qc-panel-head small {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.production-qc-metrics {
  min-width: 0;
}
.production-qc-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: 86px;
  padding: 0;
  background: #fff;
  border: 1px solid #d9e3ee;
  border-radius: 14px;
  box-shadow: 0 10px 26px rgba(15, 28, 44, .06);
  overflow: hidden;
}
.production-qc-metric {
  display: flex;
  min-height: 86px;
  padding: 13px 16px;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  text-align: left;
  border: 0;
  border-right: 1px solid #e6edf5;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease;
}
.production-qc-metric:last-child {
  border-right: 0;
}
.production-qc-metric:hover,
.production-qc-metric.active {
  border-bottom-color: #ffd629;
  background: linear-gradient(180deg, #fffdf3 0%, #fff8d6 100%);
  box-shadow: none;
}
.production-qc-metric span {
  display: grid;
  gap: 5px;
}
.production-qc-metric small {
  color: #697684;
  font-size: 12px;
  font-weight: 800;
}
.production-qc-metric strong {
  color: var(--ink);
  font-size: 26px;
  line-height: 1;
}
.production-qc-metric em {
  color: #7b8490;
  font-size: 12px;
  font-style: normal;
}
.production-qc-metric b {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
  color: #0f1d2b;
  background: #eef6ff;
  border-radius: 10px;
  font-size: 13px;
}
.production-qc-metric.amber b { background: #fff2cf; color: #9a6500; }
.production-qc-metric.green b { background: #dff7ec; color: #0e7a50; }
.production-qc-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  padding: 10px 28px;
  background: #f7f9fc;
  border-bottom: 1px solid var(--line);
}
.production-qc-tab {
  min-height: 40px;
  color: #233348;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 900;
  transition: all .18s ease;
}
.production-qc-tab:hover,
.production-qc-tab.active {
  color: #111827;
  background: #fff;
  border-color: #e4bd10;
  box-shadow: 0 5px 16px rgba(28, 45, 68, .08), inset 0 -3px 0 #ffd629;
}
.production-qc-body {
  padding: 22px 28px 28px;
  background: #f7f9fc;
}
.production-qc-panel {
  min-height: 390px;
}
.production-qc-panel-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.production-qc-panel-head h3 {
  margin: 3px 0 0;
  color: var(--ink);
  font-size: 21px;
}
.production-qc-quality-layout {
  display: grid;
  grid-template-columns: minmax(540px, 1.25fr) minmax(330px, .75fr);
  gap: 16px;
  align-items: stretch;
}
.production-qc-form {
  min-width: 0;
  min-height: 300px;
  padding: 20px;
  background: #fff;
  border: 1px solid #dfe8f2;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(15, 28, 44, .05);
}
.production-qc-form-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 15px;
  border-bottom: 1px solid #e8eef5;
}
.production-qc-form-title > div {
  display: grid;
  gap: 3px;
}
.production-qc-form-title b {
  color: var(--ink);
  font-size: 17px;
}
.production-qc-form-title small {
  color: var(--muted);
  font-size: 12px;
}
.production-qc-form-title > span {
  padding: 6px 10px;
  color: #8b6500;
  background: #fff7d4;
  border: 1px solid #f1d35c;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}
.production-qc-form .primary {
  min-height: 46px;
  margin-top: 8px;
  color: #101827;
  background: #ffd629;
  border-color: #e6b900;
  box-shadow: 0 8px 18px rgba(239, 192, 0, .18);
}
.production-qc-form .primary:hover {
  background: #ffdf4d;
}
.production-qc-context {
  min-width: 0;
  min-height: 300px;
  padding: 20px;
  background: linear-gradient(145deg, #17243a 0%, #23334c 100%);
  border: 1px solid #2d405d;
  border-radius: 12px;
  color: #fff;
  box-shadow: 0 14px 30px rgba(23, 36, 58, .14);
}
.production-qc-context-head {
  display: grid;
  gap: 4px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.production-qc-context-head span {
  color: #ffd629;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
}
.production-qc-context-head b {
  font-size: 17px;
}
.production-qc-context-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 15px 0;
}
.production-qc-context-item {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px 11px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 9px;
}
.production-qc-context-item small {
  color: #9fb0c7;
  font-size: 11px;
}
.production-qc-context-item strong {
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.production-qc-context-empty {
  grid-column: 1 / -1;
  padding: 26px 10px;
  color: #b7c3d4;
  text-align: center;
}
.production-qc-guide {
  display: grid;
  gap: 8px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.14);
}
.production-qc-guide > b {
  margin-bottom: 2px;
  color: #ffd629;
  font-size: 13px;
}
.production-qc-guide p {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0;
  color: #dce5f0;
  font-size: 12px;
}
.production-qc-guide i {
  display: grid;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  place-items: center;
  color: #17243a;
  background: #ffd629;
  border-radius: 50%;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.production-qc-panel #qualityTable .table-wrap {
  min-height: 350px;
  max-height: clamp(360px, calc(100vh - 360px), 560px);
}
.production-qc-panel #workOrderTable .table-wrap {
  max-height: clamp(420px, calc(100vh - 340px), 620px);
}
#workorders .production-pagination {
  min-height: 62px;
  margin-top: 14px;
  border-color: #d9e3ee;
  box-shadow: 0 8px 22px rgba(22, 40, 66, .045);
}
#workorders .production-pagination > label {
  margin-left: 0;
}
@media (max-width: 1100px) {
  .production-qc-head {
    grid-template-columns: 1fr;
  }
  .production-qc-quality-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .production-qc-head,
  .production-qc-tabs,
  .production-qc-body {
    padding-left: 14px;
    padding-right: 14px;
  }
  .production-qc-tabs {
    grid-template-columns: 1fr;
  }
  .production-qc-summary,
  .production-qc-context-body {
    grid-template-columns: 1fr;
  }
  .production-qc-metric {
    border-right: 0;
    border-bottom: 1px solid #e6edf5;
  }
  .production-qc-metric:last-child {
    border-bottom: 0;
  }
}
.quality-module {
  align-items: stretch;
}
.quality-equal-panel {
  min-height: 330px;
  display: flex;
  flex-direction: column;
}
.quality-form-panel .stack-form {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.quality-form-panel .stack-form .primary {
  margin-top: auto;
}
.quality-history-panel .admin-scroll-table {
  min-height: 0;
  flex: 1;
}
.quality-history-panel .admin-scroll-table .table-wrap {
  height: 100%;
  min-height: 214px;
  max-height: none;
  overflow: auto;
}
#workorders .quality-module {
  align-items: stretch;
}
#workorders .quality-module > .panel {
  min-height: 390px;
  display: flex;
  flex-direction: column;
}
#workorders .quality-form-panel .stack-form {
  flex: 1;
  display: flex;
  flex-direction: column;
}
#workorders .quality-form-panel .stack-form .primary {
  margin-top: auto;
}
#workorders .quality-history-panel .admin-scroll-table {
  min-height: 0;
  flex: 1;
}
#workorders .quality-history-panel .admin-scroll-table .table-wrap {
  height: 100%;
  min-height: 280px;
  max-height: none;
  overflow: auto;
}
.compact-form { display: grid; grid-template-columns: repeat(3, minmax(100px, 1fr)); gap: 10px; padding-bottom: 18px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.compact-form input, .compact-form select { height: 44px; border-radius: 7px; background: #fff; }
.compact-form input:focus, .compact-form select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(236,91,54,.1); }
.compact-form .primary { min-width: 110px; }
.inline-action { display: flex; align-items: center; gap: 6px; }
.inline-action input { width: 72px; height: 31px; padding: 0 7px; font-size: 11px; }
.inline-action .table-button { flex: 0 0 auto; }
.receivable-scroll .table-wrap {
  max-height: clamp(260px, calc(100vh - 360px), 360px);
  overflow: auto;
  border: 1px solid #edf1f5;
  border-radius: 8px;
  background: #fff;
}
.receivable-scroll table {
  min-width: 760px;
}
.receivable-scroll th {
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: 0 1px 0 #edf0f2;
}
.receivable-scroll tbody tr:last-child td {
  border-bottom: 0;
}
.shipment-scroll .table-wrap {
  min-height: 220px;
  max-height: clamp(220px, calc(100vh - 360px), 360px);
  overflow-x: auto;
  overflow-y: scroll;
  scrollbar-gutter: stable;
  scrollbar-color: #96a6b8 #eef3f7;
  border: 1px solid #edf1f5;
  border-radius: 8px;
  background: #fff;
}
.shipment-scroll .table-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.shipment-scroll .table-wrap::-webkit-scrollbar-track {
  background: #eef3f7;
  border-radius: 8px;
}
.shipment-scroll .table-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #b8c4d0, #8ea0b2) content-box;
  border: 2px solid #eef3f7;
  border-radius: 8px;
}
.shipment-scroll .table-wrap::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #9aaabc, #718397) content-box;
}
.shipment-scroll table {
  min-width: 1080px;
}
.shipment-scroll .order-product-cell {
  min-width: 270px;
  gap: 12px;
}
.shipment-scroll .order-product-thumb {
  width: 60px;
  height: 60px;
  flex-basis: 60px;
  border-radius: 10px;
}
.shipment-scroll .order-product-meta b {
  font-size: 13px;
  line-height: 1.45;
}
.shipment-scroll .order-product-meta small {
  max-width: 220px;
}
.shipment-scroll th {
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: 0 1px 0 #edf0f2;
}
.shipment-scroll tbody tr:last-child td {
  border-bottom: 0;
}
#shipping > .dual-module {
  align-items: stretch;
}
#shipping > .dual-module > .panel {
  height: clamp(660px, calc(100vh - 140px), 780px);
  max-height: clamp(660px, calc(100vh - 140px), 780px);
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
}
#shipping > .dual-module > .panel > .admin-scroll-table {
  min-height: 0;
  display: flex;
  flex: 1;
  flex-direction: column;
}
#shipping #shipmentTable {
  min-height: 0;
  display: flex;
  flex: 1;
  flex-direction: column;
}
#shipping > .dual-module > .panel > .admin-scroll-table .table-wrap {
  min-height: 0;
  height: auto;
  max-height: none;
  flex: 1;
  overflow: auto;
}
#shipping #shipmentTable .table-wrap {
  min-height: 0;
  height: 100%;
  max-height: 100%;
  flex: 1;
  overflow-x: auto;
  overflow-y: scroll;
  scrollbar-gutter: stable;
}
.wide-action input { width: 170px; }
.wide-action .support-note { width: 220px; }
.payment-review-action, .invoice-review-action { align-items: stretch; min-width: 360px; }
.payment-review-action input, .invoice-review-action input, .invoice-no { height: 32px; padding: 0 8px; border: 1px solid var(--line); border-radius: 5px; background: #fff; font-size: 11px; }
.payment-review-action input { width: 116px; }
.panel-note {
  margin: -4px 0 14px;
  padding: 10px 12px;
  color: #7a4b00;
  background: #fffaeb;
  border-left: 3px solid #f4c430;
  border-radius: 4px;
  font-size: 12px;
  line-height: 1.55;
}
.recharge-review-action {
  align-items: flex-end;
  flex-wrap: wrap;
  min-width: 540px;
}
.recharge-review-action label {
  display: grid;
  gap: 3px;
  color: #667085;
  font-size: 10px;
  font-weight: 700;
}
.recharge-review-action input {
  width: 142px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  font-size: 11px;
}
.recharge-review-action label input { width: 105px; }
.table-button.danger {
  color: #b42318;
  background: #fef3f2;
  border: 1px solid #fecdca;
}
.recharge-review-scroll .table-wrap {
  max-height: 360px;
  overflow: auto;
  scrollbar-gutter: stable;
}
.invoice-review-action input { width: 220px; }
.work-schedule-action {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  min-width: 0;
}
.work-schedule-action label {
  gap: 3px;
  min-width: 0;
  color: #7a8695;
  font-size: 9px;
}
.work-schedule-action input {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  font-size: 11px;
}
.work-schedule-action .work-schedule-date { grid-column: 1 / -1; }
.work-schedule-action input[type="date"] {
  width: 100%;
  min-width: 0;
  padding-right: 6px;
  font-variant-numeric: tabular-nums;
}
#workOrderTable table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
#workOrderTable th,
#workOrderTable td {
  padding: 15px 12px;
  vertical-align: middle;
  white-space: normal;
}
#workOrderTable th:nth-child(1) { width: 15%; }
#workOrderTable th:nth-child(2) { width: 24%; }
#workOrderTable th:nth-child(3) { width: 10%; }
#workOrderTable th:nth-child(4) { width: 22%; }
#workOrderTable th:nth-child(5) { width: 10%; }
#workOrderTable th:nth-child(6) { width: 19%; }
#workOrderTable .order-product-cell { min-width: 0; gap: 12px; }
#workOrderTable .order-product-thumb {
  width: 68px;
  height: 68px;
  flex-basis: 68px;
  border-radius: 11px;
}
#workOrderTable .order-product-meta b {
  display: -webkit-box;
  overflow: hidden;
  font-size: 14px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
#workOrderTable .order-product-meta small {
  max-width: none;
  white-space: normal;
}
.work-identity-cell,
.work-detail-cell,
.work-schedule-readonly {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.work-identity-cell b {
  overflow-wrap: anywhere;
  color: #111827;
  font-size: 12px;
  line-height: 1.45;
}
.work-identity-cell small {
  display: grid;
  gap: 2px;
  overflow-wrap: anywhere;
  color: #64748b;
  font-size: 10px;
  line-height: 1.45;
}
.work-identity-cell small span {
  color: #9a6b00;
  font-weight: 900;
}
.work-detail-cell b { color: #111827; font-size: 14px; }
.work-detail-cell span {
  overflow: hidden;
  color: #344054;
  font-size: 11px;
  line-height: 1.4;
  text-overflow: ellipsis;
}
.work-detail-cell small,
.work-schedule-readonly small { color: #7a8695; font-size: 10px; }
.work-schedule-readonly b { color: #111827; font-size: 12px; }
.work-schedule-readonly span { color: #475467; font-size: 11px; }
#taskTable .order-product-cell { min-width: 250px; }
#taskTable .order-product-meta b { font-size: 13px; }
#taskTable .order-product-meta small { max-width: 200px; }
#taskTable .order-product-thumb {
  width: 58px;
  height: 58px;
  flex-basis: 58px;
}
#production #taskTable .table-wrap {
  max-height: none;
  overflow-x: hidden;
  overflow-y: visible;
}
#production #taskTable table {
  min-width: 0;
  table-layout: fixed;
}
#production #taskTable th:nth-child(1) { width: 18%; }
#production #taskTable th:nth-child(2) { width: 42%; }
#production #taskTable th:nth-child(3) { width: 10%; }
#production #taskTable th:nth-child(4) { width: 10%; }
#production #taskTable th:nth-child(5) { width: 14%; }
#production #taskTable th:nth-child(6) { width: 6%; }
#production .task-pagination {
  min-height: 62px;
  margin-top: 14px;
  border-color: #d9e3ee;
  box-shadow: 0 8px 22px rgba(22, 40, 66, .045);
}
#workOrderTable .table-wrap {
  height: clamp(520px, calc(100vh - 225px), 720px);
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-color: #91a2b5 #edf2f6;
}
#workOrderTable .table-wrap::-webkit-scrollbar {
  width: 10px;
  height: 0;
}
#workOrderTable .table-wrap::-webkit-scrollbar-track {
  background: #edf2f6;
  border-radius: 8px;
}
#workOrderTable .table-wrap::-webkit-scrollbar-thumb {
  min-height: 48px;
  background: linear-gradient(180deg, #b5c1cd, #8799ac) content-box;
  border: 2px solid #edf2f6;
  border-radius: 8px;
}
#workOrderTable .table-wrap::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #98a8b9, #6f8499) content-box;
}
.work-progress-cell { display: grid; gap: 8px; min-width: 0; padding: 3px 0; }
.work-progress-save { display: grid; grid-template-columns: 58px 12px minmax(0, 1fr); gap: 5px; align-items: center; }
.work-progress-save input {
  width: 64px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid #d8dee7;
  border-radius: 6px;
  background: #fff;
  color: #1f2937;
  font-weight: 800;
}
.work-progress-save > span { color: #7a8591; font-size: 11px; font-weight: 800; }
.work-progress-save .table-button { height: 32px; color: #344054; background: #f0f3f6; }
.work-finish-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid #e2bd10;
  border-radius: 7px;
  color: #171a1f;
  background: linear-gradient(180deg, #ffe96a, #ffdc2f);
  box-shadow: 0 4px 10px rgba(224, 183, 0, .18);
  font-size: 12px;
  font-weight: 1000;
}
.work-finish-button:hover { background: linear-gradient(180deg, #ffed7d, #ffd91f); transform: translateY(-1px); }
.work-finish-button:disabled { cursor: wait; opacity: .65; transform: none; }
.work-progress-hint, .work-row-feedback { display: block; color: #8a6b00; font-size: 10px; line-height: 1.4; white-space: normal; }
.work-row-feedback { padding: 5px 7px; border-radius: 5px; background: #fff8d8; }
.work-row-feedback.is-error { color: #b42318; background: #fff0ee; }
.work-qc-tag { border-color: #f3d34a; color: #7a5c00; background: #fff9d9; }
.work-qc-ready { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; min-width: 190px; align-items: center; white-space: normal; }
.work-qc-ready strong { color: #1f7a5b; font-size: 16px; }
.work-qc-ready span { color: #755a00; font-size: 12px; font-weight: 900; }
.work-qc-ready small { grid-column: 1 / -1; color: #7b8490; font-size: 10px; }
.work-qc-attention { border-color: #f1cd35 !important; box-shadow: 0 0 0 4px rgba(255, 221, 51, .18), 0 12px 30px rgba(33, 38, 45, .08) !important; }
.invoice-file-cell { display: flex; align-items: center; gap: 8px; min-width: 180px; }
.invoice-file-cell a { max-width: 120px; overflow: hidden; color: #1463ff; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.invoice-file-input { display: none; }
.invoice-admin-note { margin: -6px 0 14px; padding: 11px 13px; border: 1px solid #dce8f6; border-radius: 7px; background: #f7fbff; color: #52616d; font-size: 12px; line-height: 1.6; }
.wrap-text { display: inline-block; max-width: 260px; white-space: normal; line-height: 1.5; }
.block { display: block; margin-top: 4px; }
.support-record-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0 0 14px; }
.support-record-summary article { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: #fbfcfd; }
.support-record-summary span { display: block; color: var(--muted); font-size: 11px; }
.support-record-summary strong { display: block; margin-top: 5px; color: var(--ink); font-size: 22px; }
.support-chat-cell { display: grid; gap: 8px; min-width: 320px; max-width: 520px; }
.support-thread { display: grid; gap: 6px; max-height: 168px; overflow: auto; padding: 9px; border: 1px solid #e4eaf1; border-radius: 7px; background: #f8fafc; }
.support-thread-line { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 7px; align-items: start; white-space: normal; }
.support-thread-line b { color: #7a8590; font-size: 11px; }
.support-thread-line span { color: #26323c; font-size: 12px; line-height: 1.5; }
.support-thread-line small { color: #9aa3ad; font-size: 10px; white-space: nowrap; }
.support-thread-line.agent span { color: #0f5f8c; }
.support-reply-box { display: grid; grid-template-columns: minmax(0, 1fr) 82px; gap: 7px; align-items: stretch; }
.support-reply-box textarea { min-height: 54px; max-height: 96px; padding: 8px 10px; resize: vertical; border: 1px solid #d8e1ec; border-radius: 6px; font-size: 12px; line-height: 1.5; }
.support-reply-box .table-button { min-height: 54px; color: #fff; background: var(--accent); }
.support-reply-box .table-button:hover { color: #fff; background: var(--accent-dark); }
.support-workspace-panel { padding: 0; overflow: hidden; }
.support-workspace-panel .panel-head { margin: 0; padding: 18px 18px 12px; border-bottom: 1px solid var(--line); }
.support-workspace-panel .support-record-summary { margin: 0; padding: 14px 18px; border-bottom: 1px solid var(--line); background: #fbfcfd; }
.support-workbench { display: grid; grid-template-columns: 260px minmax(360px, 1fr) 250px; min-height: 560px; background: #fff; }
.support-ticket-list { min-width: 0; overflow: auto; border-right: 1px solid var(--line); background: #fbfcfd; }
.support-ticket-item { display: grid; gap: 8px; padding: 14px; border: 0; border-bottom: 1px solid #edf1f5; background: transparent; text-align: left; cursor: pointer; }
.support-ticket-item:hover, .support-ticket-item.active { background: #fff; }
.support-ticket-item.active { box-shadow: inset 3px 0 0 var(--accent); }
.support-ticket-item div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.support-ticket-item strong { color: var(--ink); font-size: 13px; }
.support-ticket-item div span { overflow: hidden; color: #7c8791; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.support-ticket-item p { margin: 0; overflow: hidden; color: #34404a; font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.support-ticket-item footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.support-ticket-item footer b { padding: 4px 7px; border-radius: 5px; color: #277087; background: #edf5f8; font-size: 10px; }
.support-ticket-item footer small { color: #9aa3ad; font-size: 10px; }
.support-conversation { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-width: 0; background: #f6f8fb; }
.support-conversation-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 12px 16px; border-bottom: 1px solid #e4eaf1; background: #fff; }
.support-conversation-head span { display: block; color: #8a949c; font-size: 11px; }
.support-conversation-head strong { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 3px; font-size: 14px; }
.support-conversation-body { display: grid; align-content: start; gap: 13px; min-height: 0; overflow: auto; padding: 18px 16px; }
.support-message { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 8px; align-items: start; }
.support-message.agent { grid-template-columns: minmax(0, 1fr) 42px; }
.support-message b { display: grid; width: 32px; height: 32px; place-items: center; color: #fff; background: #ec5b36; border-radius: 50%; font-size: 11px; }
.support-message.agent b { order: 2; background: #24313a; }
.support-message div { width: fit-content; max-width: min(480px, 86%); padding: 9px 11px; border-radius: 6px; background: #fff; box-shadow: 0 8px 20px rgba(24, 32, 38, .05); }
.support-message.agent div { justify-self: end; color: #fff; background: #20aeea; box-shadow: none; }
.support-message span { display: block; white-space: pre-wrap; font-size: 13px; line-height: 1.55; }
.support-message small { display: block; margin-top: 5px; color: #9aa3ad; font-size: 10px; }
.support-message.agent small { color: rgba(255,255,255,.75); }
.support-compose { display: grid; grid-template-columns: minmax(0, 1fr) 106px; gap: 10px; padding: 14px 16px; border-top: 1px solid #e4eaf1; background: #fff; }
.support-compose textarea { min-height: 78px; max-height: 150px; padding: 10px 12px; resize: vertical; border: 1px solid #cfd9e4; border-radius: 6px; font-size: 13px; line-height: 1.5; }
.support-compose .primary { min-height: 78px; }
.support-customer-card { min-width: 0; overflow: auto; padding: 18px 16px; border-left: 1px solid var(--line); background: #fbfcfd; }
.support-customer-card > span { color: #8a949c; font-size: 11px; }
.support-customer-card > strong { display: block; margin: 6px 0 14px; font-size: 18px; }
.support-customer-card dl { display: grid; gap: 0; margin: 0; }
.support-customer-card dl div { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 8px; padding: 10px 0; border-top: 1px solid #e7edf3; }
.support-customer-card dt { color: #7c8791; font-size: 11px; font-weight: 800; }
.support-customer-card dd { margin: 0; color: #34404a; font-size: 12px; line-height: 1.6; word-break: break-word; }
.support-customer-card p, .support-empty-state { margin: 14px 0 0; padding: 12px; border: 1px solid #e7edf3; border-radius: 7px; color: #53606a; background: #fff; font-size: 12px; line-height: 1.6; }
#support .dual-module { grid-template-columns: 1fr; }
#support .dual-module .finance-only {
  min-height: 420px;
}
.refund-review-scroll {
  min-height: 320px;
  max-height: 540px;
  overflow: auto;
  border: 1px solid #edf1f5;
  border-radius: 8px;
  background: #fbfcfd;
  scrollbar-width: thin;
  scrollbar-color: #c4cdd6 transparent;
}
.refund-review-scroll::-webkit-scrollbar { width: 8px; height: 8px; }
.refund-review-scroll::-webkit-scrollbar-thumb { background: #c4cdd6; border-radius: 999px; }
.refund-review-scroll::-webkit-scrollbar-track { background: transparent; }
.refund-review-scroll .empty-state {
  min-height: 318px;
  margin: 0;
  display: grid;
  place-items: center;
  background: #fff;
}
.refund-review-scroll .table-wrap {
  min-height: 318px;
  overflow: auto;
}

/* Comfortable support workbench */
.support-workspace-panel {
  border-color: #d8e0e8;
  box-shadow: 0 14px 34px rgba(24, 32, 38, .05);
}
.support-workspace-panel .panel-head {
  min-height: 54px;
  padding: 14px 18px 10px;
}
.support-workspace-panel .support-record-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 10px 18px 12px;
  background: #fff;
}
.support-workspace-panel .support-record-summary article {
  min-height: 58px;
  padding: 10px 12px;
  background: #f8fafc;
}
.support-workspace-panel .support-record-summary strong {
  margin-top: 3px;
  font-size: 20px;
}
.support-workbench {
  grid-template-columns: 270px minmax(520px, 1fr) 240px;
  min-height: 640px;
  border-top: 1px solid var(--line);
}
.support-ticket-list {
  background: #f8fafc;
}
.support-ticket-item {
  gap: 7px;
  padding: 12px 14px;
}
.support-ticket-item.active {
  background: #fff;
  box-shadow: inset 4px 0 0 var(--accent), 0 8px 22px rgba(24, 32, 38, .04);
}
.support-ticket-item p {
  display: -webkit-box;
  min-height: 34px;
  white-space: normal;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.support-conversation {
  background: #f2f5f8;
}
.support-conversation-head {
  min-height: 54px;
  padding: 10px 16px;
}
.support-conversation-head .status-select {
  width: 132px;
}
.support-conversation-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px 18px 16px;
  background:
    linear-gradient(#f2f5f8, #f2f5f8),
    repeating-linear-gradient(0deg, rgba(24,32,38,.025) 0 1px, transparent 1px 36px);
}
.support-message {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.support-message.agent {
  justify-content: flex-end;
}
.support-message b {
  flex: 0 0 auto;
}
.support-message.agent b {
  order: 2;
}
.support-message div {
  max-width: min(560px, 72%);
  padding: 10px 12px;
  border-radius: 8px;
}
.support-message.customer div {
  background: #fff;
}
.support-message.agent div {
  background: #1fafe7;
}
.support-compose {
  grid-template-columns: minmax(0, 1fr) 96px;
  gap: 10px;
  padding: 12px 16px;
}
.support-compose textarea {
  min-height: 58px;
  max-height: 118px;
  border-color: #cbd6e2;
  background: #fff;
}
.support-compose .primary {
  min-height: 58px;
  padding: 0 12px;
}
.support-customer-card {
  padding: 18px 16px;
  background: #f8fafc;
}
.support-customer-card > strong {
  margin-bottom: 16px;
}
.support-customer-card dl div {
  grid-template-columns: 42px minmax(0, 1fr);
  padding: 9px 0;
}
.support-customer-card p {
  max-height: 140px;
  overflow: auto;
}

/* Compact scrollable ticket queue */
.support-workbench {
  grid-template-columns: 210px minmax(520px, 1fr) 240px;
}
.support-ticket-list {
  max-height: 640px;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #c4cdd6 transparent;
}
.support-ticket-list::-webkit-scrollbar { width: 6px; }
.support-ticket-list::-webkit-scrollbar-thumb { background: #c4cdd6; border-radius: 999px; }
.support-ticket-list::-webkit-scrollbar-track { background: transparent; }
.support-ticket-item {
  position: relative;
  gap: 6px;
  padding: 10px 12px;
}
.support-ticket-item.has-unread {
  background: #fff;
}
.support-ticket-item.has-unread strong::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 6px;
  vertical-align: 1px;
  border-radius: 50%;
  background: #f04438;
  box-shadow: 0 0 0 3px rgba(240, 68, 56, .14);
}
.support-ticket-item.has-unread p {
  color: #172027;
  font-weight: 800;
}
.support-ticket-item div span {
  max-width: 110px;
  font-size: 10px;
}
.support-ticket-item p {
  min-height: 18px;
  -webkit-line-clamp: 1;
}
.support-ticket-item footer b {
  padding: 3px 6px;
}

/* Support workbench final polish */
.support-workspace-panel {
  border-color: #d8e2ec;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(24, 32, 38, .06);
}
.support-workspace-panel .panel-head {
  min-height: 62px;
  padding: 16px 20px 12px;
  background: linear-gradient(180deg, #fff, #fafbfd);
}
.support-workspace-panel .support-record-summary {
  gap: 12px;
  padding: 12px 20px;
  background: #f6f8fb;
}
.support-workspace-panel .support-record-summary article {
  position: relative;
  min-height: 66px;
  padding: 12px 16px 12px 18px;
  overflow: hidden;
  border-color: #dfe7ef;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(24, 32, 38, .035);
}
.support-workspace-panel .support-record-summary article::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: #aab5c0;
}
.support-workspace-panel .support-record-summary .open::before { background: #f05a37; }
.support-workspace-panel .support-record-summary .processing::before { background: #1fafe7; }
.support-workspace-panel .support-record-summary .done::before { background: #22a06b; }
.support-workspace-panel .support-record-summary .total::before { background: #53606a; }
.support-workspace-panel .support-record-summary span {
  color: #687586;
  font-weight: 800;
}
.support-workspace-panel .support-record-summary strong {
  margin-top: 4px;
  color: #0f172a;
  font-size: 24px;
  line-height: 1;
}
.support-workbench {
  grid-template-columns: 292px minmax(560px, 1fr) 280px;
  height: clamp(430px, calc(100vh - 330px), 650px);
  min-height: 430px;
  border-top: 1px solid #dfe7ef;
  background: #fff;
}
.support-ticket-list {
  height: 100%;
  max-height: none;
  padding: 8px;
  border-right: 1px solid #dfe7ef;
  background: #f6f8fb;
}
.support-ticket-item {
  gap: 8px;
  margin-bottom: 8px;
  padding: 12px 13px;
  border: 1px solid transparent;
  border-radius: 8px;
  border-bottom: 1px solid transparent;
  background: transparent;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.support-ticket-item:hover {
  border-color: #dfe7ef;
  background: #fff;
}
.support-ticket-item.active {
  border-color: #d9e3ed;
  background: #fff;
  box-shadow: inset 4px 0 0 #f05a37, 0 10px 24px rgba(24, 32, 38, .06);
}
.support-ticket-item div span {
  max-width: 150px;
  color: #7c8997;
  font-size: 11px;
}
.support-ticket-item p {
  min-height: 34px;
  color: #26323c;
  line-height: 1.45;
  -webkit-line-clamp: 2;
}
.support-ticket-item footer b {
  padding: 4px 7px;
  color: #0d6f8a;
  background: #e8f6fb;
  border-radius: 6px;
  font-weight: 900;
}
.support-ticket-item footer small {
  font-size: 11px;
}
.support-ticket-item.has-unread {
  border-color: #ffd9d2;
  background: #fff;
}
.support-conversation {
  border-right: 1px solid #dfe7ef;
  background: #eef3f7;
  min-height: 0;
}
.support-conversation-head {
  min-height: 60px;
  padding: 12px 18px;
  border-bottom-color: #dfe7ef;
  background: #fff;
}
.support-conversation-head strong {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #111827;
}
.support-conversation-head strong em {
  padding: 3px 8px;
  border-radius: 999px;
  color: #607086;
  background: #f1f5f9;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.support-conversation-head .status-select {
  width: 136px;
  height: 36px;
}
.support-conversation-body {
  position: relative;
  min-height: 0;
  overflow: auto;
  gap: 14px;
  padding: 22px 24px 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.34), rgba(238,243,247,.64)),
    #eef3f7;
}
.support-conversation-body::before {
  content: "";
  margin-top: auto;
}
.support-message {
  gap: 10px;
}
.support-message b {
  width: 34px;
  height: 34px;
  box-shadow: 0 8px 18px rgba(236, 91, 54, .18);
}
.support-message.agent b {
  background: #172331;
  box-shadow: 0 8px 18px rgba(23, 35, 49, .18);
}
.support-message div {
  max-width: min(640px, 76%);
  padding: 11px 13px;
  border: 1px solid rgba(221, 229, 238, .85);
  border-radius: 8px;
  box-shadow: 0 10px 26px rgba(24, 32, 38, .06);
}
.support-message.customer div {
  background: #fff;
}
.support-message.agent div {
  border-color: #1fafe7;
  background: #1fafe7;
}
.support-message span {
  font-size: 14px;
}
.support-message small {
  margin-top: 6px;
}
.support-compose {
  grid-template-columns: minmax(0, 1fr) 128px;
  gap: 12px;
  padding: 13px 18px;
  border-top-color: #dfe7ef;
  background: #fff;
  box-shadow: 0 -8px 22px rgba(24, 32, 38, .035);
  position: sticky;
  bottom: 0;
  z-index: 2;
}
.support-compose textarea {
  min-height: 64px;
  max-height: 132px;
  padding: 12px 14px;
  border-color: #cbd7e4;
  border-radius: 8px;
  resize: none;
  font-size: 14px;
}
.support-compose textarea:focus {
  border-color: #1fafe7;
  box-shadow: 0 0 0 3px rgba(31, 175, 231, .12);
  outline: none;
}
.support-compose .primary {
  min-height: 64px;
  padding: 0 14px;
  border-radius: 8px;
  background: #f05a37;
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
}

.support-compose {
  display: block;
  padding: 12px 16px;
}

.support-compose-shell {
  position: relative;
  min-width: 0;
}

.support-compose .support-note {
  width: 100%;
  min-height: 74px;
  max-height: 132px;
  padding: 13px 58px 37px 14px;
  color: #1f2937;
  background: #fff;
  border: 1px solid #20afe9;
  border-radius: 8px;
  resize: none;
  font-size: 14px;
  line-height: 1.55;
}

.support-compose .support-note:focus {
  border-color: #139bd3;
  box-shadow: 0 0 0 3px rgba(32, 175, 233, .12);
  outline: none;
}

.support-compose-tools {
  position: absolute;
  left: 12px;
  bottom: 11px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 10px;
}

.support-tool-button {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  padding: 0;
  color: #536273;
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.support-tool-button:hover,
.support-tool-button[aria-expanded="true"],
.support-tool-button.is-busy {
  color: #0f8fc6;
  background: #eaf7fd;
}

.support-attach-input {
  display: none;
}

.support-compose .support-send-button {
  position: absolute;
  right: 10px;
  bottom: 9px;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  color: #fff;
  background: #20afe9;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 8px 18px rgba(32, 175, 233, .22);
  font-family: Arial, sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  text-indent: 2px;
}

.support-compose .support-send-button:hover {
  background: #0f8fc6;
  box-shadow: 0 10px 22px rgba(15, 143, 198, .25);
  transform: translateY(-1px);
}

.support-tool-panel {
  position: absolute;
  left: 6px;
  bottom: 44px;
  z-index: 8;
  width: 294px;
  max-width: calc(100% - 12px);
  padding: 10px;
  background: #fff;
  border: 1px solid #dbe6f1;
  border-radius: 8px;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
}

.support-tool-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.support-tool-panel-head strong {
  color: #172027;
  font-size: 13px;
}

.support-panel-close {
  width: 24px;
  height: 24px;
  padding: 0;
  color: #667085;
  background: #f3f6f9;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}

.support-emoji-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 6px;
}

.support-emoji-grid button,
.support-template-list button {
  min-width: 0;
  border: 1px solid #e5edf5;
  background: #f8fafc;
  cursor: pointer;
}

.support-emoji-grid button {
  height: 34px;
  padding: 0;
  border-radius: 7px;
  font-size: 18px;
}

.support-template-list {
  display: grid;
  gap: 6px;
}

.support-template-list button {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 7px;
  color: #233140;
  font-size: 12px;
  font-weight: 900;
  text-align: left;
}

.support-emoji-grid button:hover,
.support-template-list button:hover {
  background: #eef8fd;
  border-color: #bfe8f8;
}
.support-customer-card {
  padding: 20px 18px;
  border-left: 0;
  background: #f8fafc;
}
.support-customer-card > span {
  color: #7b8794;
  font-weight: 900;
}
.support-customer-card > strong {
  position: relative;
  margin: 7px 0 18px;
  padding-left: 13px;
  color: #0f172a;
  font-size: 24px;
  line-height: 1.1;
}
.support-customer-card > strong::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22a06b;
  box-shadow: 0 0 0 3px rgba(34, 160, 107, .14);
}
.support-customer-card dl {
  gap: 8px;
}
.support-customer-card dl div {
  grid-template-columns: 42px minmax(0, 1fr);
  padding: 10px 12px;
  border: 1px solid #e3eaf2;
  border-radius: 8px;
  background: #fff;
}
.support-customer-card dt {
  color: #7c8791;
}
.support-customer-card dd {
  color: #26323c;
  font-weight: 800;
}
.support-customer-card p {
  max-height: 160px;
  padding: 13px;
  border-color: #e3eaf2;
  border-radius: 8px;
  background: #fff;
}
.connector-note { margin-bottom: 17px; padding: 12px 14px; border-left: 3px solid var(--blue); border-radius: 4px; color: #58646d; background: #eef5fb; font-size: 12px; line-height: 1.7; }
.module-note {
  margin: 0 0 14px;
  padding: 12px 14px;
  color: #58646d;
  background: linear-gradient(180deg, #f8fbff, #f3f8fd);
  border: 1px solid #dbe8f4;
  border-left: 3px solid var(--blue);
  border-radius: 7px;
  font-size: 12px;
  line-height: 1.7;
}
.permission-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 520px;
  max-width: 980px;
  white-space: normal;
}
.platform-grid { display: grid; grid-template-columns: repeat(4, minmax(170px, 1fr)); gap: 12px; }
.platform-card { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.platform-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.platform-logo { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 6px; color: #fff; background: #2b3841; font-weight: 900; }
.platform-card h3 { margin: 13px 0 5px; font-size: 15px; }
.platform-card p { min-height: 32px; margin: 0 0 13px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.platform-meta { display: grid; gap: 5px; margin-bottom: 13px; color: #78838b; font-size: 10px; }
.platform-card button { width: 100%; }
.status-dot { display: inline-flex; align-items: center; gap: 5px; color: var(--green); font-size: 10px; }
.status-dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-dot.offline { color: #a0a7ad; }
.system-health-band { margin-bottom: 16px; padding: 15px 18px; display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)) auto; align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.system-health-band > div { display: grid; gap: 4px; padding-right: 14px; border-right: 1px solid var(--line); }
.system-health-band span { color: var(--muted); font-size: 10px; }
.system-health-band strong { font-size: 15px; }
.cost-list { display: grid; gap: 15px; }
.cost-row { display: grid; gap: 7px; }
.cost-row > div { display: flex; justify-content: space-between; color: #59636b; font-size: 12px; }
.cost-bar { height: 7px; overflow: hidden; border-radius: 4px; background: #eef0f2; }
.cost-bar i { display: block; height: 100%; background: var(--accent); }

.ai-hero { min-height: 174px; margin-bottom: 16px; padding: 28px; display: grid; grid-template-columns: 74px 1fr auto; align-items: center; gap: 22px; border-radius: 8px; color: #fff; background: #243139; }
.ai-orbit { width: 70px; height: 70px; display: grid; place-items: center; border: 1px solid #66747d; border-radius: 50%; box-shadow: inset 0 0 0 9px #2e3d46; color: #ff7957; font-weight: 900; }
.ai-hero span { color: #92a3ad; font-size: 12px; }
.ai-hero h2 { margin: 8px 0; font-size: 21px; }
.ai-hero p { margin: 0; color: #b9c4ca; font-size: 13px; }
.ai-report { display: grid; grid-template-columns: 1.2fr .8fr; gap: 16px; }
.report-card { padding: 22px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.report-card h2, .report-card h3 { margin: 0 0 12px; }
.report-card p { color: #56616a; line-height: 1.8; }
.report-metrics { display: grid; grid-template-columns: repeat(4, minmax(90px, 1fr)); gap: 9px; margin: 16px 0; }
.report-metrics div { padding: 11px; border-radius: 7px; background: #f5f7f8; }
.report-metrics span { display: block; color: var(--muted); font-size: 10px; }
.report-metrics b { display: block; margin-top: 5px; font-size: 15px; }
.reason-item, .mini-alert { padding: 11px 12px; margin-top: 8px; border-radius: 7px; background: #f6f8f9; color: #4f5a62; font-size: 13px; line-height: 1.6; }
.mini-alert { display: grid; gap: 4px; border-left: 3px solid var(--amber); }
.mini-alert span { color: #66727b; }
.ai-top-card {
  position: relative;
  grid-column: 1 / -1;
  overflow: hidden;
  border-color: #e6edf4;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  box-shadow: 0 18px 45px rgba(19, 31, 42, .07);
}
.ai-top-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, #ec5b36, #ffc94d 48%, #172027);
}
.ai-top-card h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
}
.ai-top-card h3::after {
  content: "高金额优先";
  padding: 4px 8px;
  border: 1px solid #ffe0bf;
  border-radius: 6px;
  color: #d65a20;
  background: #fff8ec;
  font-size: 11px;
  font-weight: 900;
}
.ai-top-orders {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}
.ai-top-order {
  position: relative;
  min-height: 78px;
  padding: 14px 16px;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  overflow: hidden;
  border: 1px solid #e6edf4;
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #f8fbfd);
  box-shadow: 0 10px 24px rgba(19, 31, 42, .05);
}
.ai-top-order.leader {
  border-color: #ffd0aa;
  background: linear-gradient(135deg, #fff7ef, #fffdfa);
  box-shadow: 0 16px 34px rgba(236, 91, 54, .12);
}
.ai-rank {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #172027;
  background: #eef3f7;
}
.ai-rank span {
  color: #86939e;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}
.ai-rank strong {
  margin-top: -7px;
  font-size: 20px;
  line-height: 1;
}
.ai-top-order.leader .ai-rank {
  color: #fff;
  background: #ec5b36;
  box-shadow: 0 10px 18px rgba(236, 91, 54, .22);
}
.ai-top-order.leader .ai-rank span {
  color: rgba(255, 255, 255, .78);
}
.ai-top-order-main {
  min-width: 0;
  display: grid;
  gap: 7px;
}
.ai-top-order-main b {
  overflow: hidden;
  color: #071522;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ai-top-order-main span {
  overflow: hidden;
  color: #6d7b86;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ai-top-order-main i {
  display: block;
  height: 6px;
  border-radius: 4px;
  background: linear-gradient(90deg, #ec5b36, #ffb075);
}
.ai-top-order-money {
  color: #ec5b36;
  font-size: 18px;
  white-space: nowrap;
}
.report-copy-box { min-height: 126px; margin-bottom: 16px; font-size: 13px; line-height: 1.7; }
.suggestion { padding: 13px 13px 13px 40px; margin-top: 9px; position: relative; border-radius: 6px; background: #f7f8f9; color: #4f5a62; line-height: 1.6; font-size: 13px; }
.suggestion::before { content: "!"; position: absolute; left: 13px; top: 13px; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--accent); font-size: 10px; font-weight: 900; }

.toast { position: fixed; z-index: 20; right: 24px; bottom: 24px; max-width: 340px; padding: 13px 17px; border-radius: 6px; color: #fff; background: #26333b; box-shadow: 0 10px 30px rgba(0,0,0,.18); opacity: 0; transform: translateY(12px); pointer-events: none; transition: .2s; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { background: #aa3f2d; }
.modal-backdrop { position: fixed; z-index: 30; inset: 0; padding: 24px; display: grid; place-items: center; background: rgba(16, 24, 30, .55); }
.modal { width: min(520px, 100%); max-height: calc(100vh - 48px); overflow: auto; padding: 24px; border-radius: 8px; background: #fff; box-shadow: 0 22px 70px rgba(0,0,0,.28); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; }
.modal-head span { color: var(--muted); font-size: 11px; }
.modal-head h2 { margin: 4px 0 0; font-size: 20px; }
.modal-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 5px; }
.file-review-backdrop { z-index: 42; }
.file-review-modal {
  width: min(1120px, 100%);
  max-height: calc(100vh - 32px);
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
}
.file-review-modal-head {
  margin: 0;
  padding: 20px 22px 16px;
  background: linear-gradient(135deg, #fffdf2, #fff);
  border-bottom: 1px solid #e7ebf0;
}
.file-review-modal-head > div { min-width: 0; }
.file-review-modal-head span { color: #8a6500; font-weight: 900; }
.file-review-modal-head h2 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-review-modal-head p { margin: 5px 0 0; color: #64748b; font-size: 12px; }
.file-review-workspace {
  display: grid;
  grid-template-columns: minmax(300px, .82fr) minmax(420px, 1.18fr);
  max-height: calc(100vh - 122px);
  overflow: auto;
}
.file-review-preview-pane {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  padding: 20px;
  background: #f6f8fb;
  border-right: 1px solid #e3e8ef;
}
.file-review-preview-box {
  display: grid;
  min-height: 300px;
  place-items: center;
  overflow: hidden;
  color: #475467;
  background-color: #fff;
  background-image: linear-gradient(45deg, #f3f5f8 25%, transparent 25%), linear-gradient(-45deg, #f3f5f8 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f3f5f8 75%), linear-gradient(-45deg, transparent 75%, #f3f5f8 75%);
  background-position: 0 0, 0 8px, 8px -8px, -8px 0;
  background-size: 16px 16px;
  border: 1px solid #dce3ec;
  border-radius: 10px;
}
.file-review-preview-box img { display: block; width: 100%; max-height: 390px; object-fit: contain; }
.file-review-preview-fallback {
  display: grid;
  width: 96px;
  height: 118px;
  place-items: center;
  color: #475467;
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .12);
  font-size: 18px;
  font-weight: 1000;
}
.file-review-file-meta { display: grid; gap: 4px; min-width: 0; }
.file-review-file-meta strong { overflow: hidden; color: #111827; text-overflow: ellipsis; white-space: nowrap; }
.file-review-file-meta span { color: #7c8797; font-size: 11px; }
.file-review-preflight-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  background: #fff;
  border: 1px solid #dce3ec;
  border-radius: 9px;
}
.file-review-preflight-card > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.file-review-preflight-card > div:first-child > span { color: #344054; font-size: 12px; font-weight: 1000; }
.file-review-preflight-card p { margin: 0; color: #5f6b7a; font-size: 12px; line-height: 1.55; }
.file-review-preflight-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.file-review-preflight-stats span { display: grid; gap: 2px; padding: 8px; background: #f6f8fb; border-radius: 6px; }
.file-review-preflight-stats small { color: #98a2b3; font-size: 9px; }
.file-review-preflight-stats b { overflow: hidden; color: #344054; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.file-review-preflight-warnings { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.file-review-preflight-warnings li { position: relative; padding-left: 15px; color: #b54708; font-size: 11px; line-height: 1.45; }
.file-review-preflight-warnings li::before { content: "!"; position: absolute; left: 0; top: 1px; font-weight: 1000; }
.file-review-preflight-card > button { justify-self: start; }
.file-review-shared-notice {
  display: grid;
  gap: 4px;
  padding: 11px 12px;
  color: #6941c6;
  background: #f4f3ff;
  border: 1px solid #d9d6fe;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1.5;
}
.file-review-form {
  display: grid;
  align-content: start;
  gap: 14px;
  min-width: 0;
  padding: 20px 22px;
  background: #fff;
}
.file-review-form [hidden] { display: none !important; }
.file-review-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.file-review-flow li {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
  padding: 10px;
  color: #667085;
  background: #f7f9fc;
  border: 1px solid #e2e8f0;
  border-radius: 9px;
}
.file-review-flow li > b {
  display: grid;
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  place-items: center;
  color: #667085;
  background: #fff;
  border: 1px solid #d7dee8;
  border-radius: 50%;
  font-size: 11px;
}
.file-review-flow li > span { display: grid; min-width: 0; gap: 2px; }
.file-review-flow li strong { overflow: hidden; color: #344054; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.file-review-flow li small { overflow: hidden; color: #98a2b3; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.file-review-flow li.is-current { background: #fffbea; border-color: #f2cf52; box-shadow: inset 0 0 0 1px rgba(242, 207, 82, .25); }
.file-review-flow li.is-current > b { color: #6f5200; background: #ffe55c; border-color: #ffe55c; }
.file-review-flow li.is-done { background: #f3faf6; border-color: #cbe8d7; }
.file-review-flow li.is-done > b { color: #fff; background: #16805a; border-color: #16805a; }
.file-review-decision-section {
  display: grid;
  gap: 12px;
  padding: 15px;
  background: #fbfcfe;
  border: 1px solid #dfe6ef;
  border-radius: 11px;
}
.file-review-decision-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.file-review-decision-head > div { display: grid; gap: 3px; }
.file-review-decision-head > div span { color: #8a6500; font-size: 10px; font-weight: 1000; }
.file-review-decision-head > div strong { color: #111827; font-size: 17px; }
.file-review-current-status {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 0 10px;
  color: #667085;
  background: #eef2f6;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 1000;
  white-space: nowrap;
}
.file-review-current-status.is-danger { color: #b42318; background: #fee4e2; }
.file-review-current-status.is-approved { color: #067647; background: #dff5e8; }
.file-review-current-status.is-confirmed { color: #175cd3; background: #dbeafe; }
.file-review-decision-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.file-review-decision {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  min-height: 82px;
  align-items: center;
  padding: 12px 14px;
  text-align: left;
  background: #fff;
  border: 1px solid #dbe2ea;
  border-radius: 9px;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .05);
}
.file-review-decision > i {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 50%;
  font-size: 15px;
  font-style: normal;
  font-weight: 1000;
}
.file-review-decision > span { display: grid; gap: 4px; min-width: 0; }
.file-review-decision b { font-size: 14px; }
.file-review-decision small { color: #7b8494; font-size: 10px; line-height: 1.45; }
.file-review-decision.is-approve { color: #067647; background: #f9fdfb; border-color: #cbe8d7; }
.file-review-decision.is-approve > i { color: #067647; background: #dff5e8; }
.file-review-decision.is-fix { color: #b42318; background: #fffafa; border-color: #f6d1cc; }
.file-review-decision.is-fix > i { color: #b42318; background: #fee4e2; }
.file-review-decision:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(15, 23, 42, .08); }
.file-review-decision.is-selected {
  border-width: 2px;
  box-shadow: 0 0 0 3px rgba(22, 128, 90, .10), 0 10px 22px rgba(15, 23, 42, .08);
}
.file-review-decision.is-fix.is-selected { box-shadow: 0 0 0 3px rgba(180, 35, 24, .09), 0 10px 22px rgba(15, 23, 42, .08); }
.file-review-secondary-choice {
  justify-self: start;
  padding: 4px 2px;
  color: #667085;
  background: transparent;
  border: 0;
  font-size: 10px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.file-review-secondary-choice:hover { color: #344054; }
.file-review-secondary-choice.is-selected { color: #7a4d00; font-weight: 900; }
.file-review-confirmed-notice {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 17px;
  color: #05603f;
  background: #effaf4;
  border: 1px solid #a9dfc2;
  border-radius: 11px;
}
.file-review-confirmed-notice > span {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  color: #fff;
  background: #16805a;
  border-radius: 50%;
  font-size: 18px;
  font-weight: 1000;
}
.file-review-confirmed-notice > div { display: grid; gap: 4px; }
.file-review-confirmed-notice strong { font-size: 15px; }
.file-review-confirmed-notice p { margin: 0; color: #477160; font-size: 11px; }
.file-review-detail-panel { overflow: hidden; background: #f8fafc; border: 1px solid #dfe6ee; border-radius: 9px; }
.file-review-detail-panel summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; cursor: pointer; list-style: none; }
.file-review-detail-panel summary::-webkit-details-marker { display: none; }
.file-review-detail-panel summary span { color: #344054; font-size: 12px; font-weight: 1000; }
.file-review-detail-panel summary small { color: #98a2b3; font-size: 10px; }
.file-review-detail-panel[open] summary { border-bottom: 1px solid #e2e8f0; }
.file-review-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; }
.file-review-detail-grid label { display: grid; gap: 5px; color: #475467; font-size: 11px; font-weight: 800; }
.file-review-detail-grid label.is-wide { grid-column: 1 / -1; }
.file-review-detail-grid input,
.file-review-detail-grid select,
.file-review-detail-grid textarea { width: 100%; padding: 9px 10px; color: #20262d; background: #fff; border: 1px solid #d4dce6; border-radius: 7px; font: inherit; font-weight: 500; }
.file-review-detail-grid input,
.file-review-detail-grid select { min-height: 38px; }
.file-review-detail-grid textarea { resize: vertical; line-height: 1.55; }
.file-review-production-box { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; background: #fffaf0; border: 1px solid #f7d48b; border-radius: 9px; }
.file-review-production-box > div { display: grid; gap: 3px; }
.file-review-production-box strong { color: #7a4d00; font-size: 12px; }
.file-review-production-box span { color: #8b6a2f; font-size: 10px; }
.file-review-production-box button { min-height: 34px; padding: 0 12px; color: #fff; background: #7a4d00; border: 1px solid #684100; border-radius: 7px; font-weight: 900; white-space: nowrap; }
.file-review-form-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding-top: 14px;
  border-top: 1px solid #e6ebf1;
}
.file-review-action-hint { display: grid; gap: 3px; min-width: 0; }
.file-review-action-hint strong { color: #26333b; font-size: 12px; }
.file-review-action-hint span { color: #7c8797; font-size: 10px; line-height: 1.45; }
.file-review-action-buttons { display: flex; gap: 10px; }
.file-review-form-actions button { min-width: 132px; }
.file-review-form-actions .primary { min-width: 210px; }
.file-review-form-actions .primary:disabled { color: #98a2b3; background: #edf1f5; border-color: #edf1f5; cursor: not-allowed; }
.readonly-field { min-height: 58px; padding: 11px 13px; display: grid; gap: 4px; border-radius: 6px; background: #f5f7f8; }
.readonly-field span { color: var(--muted); font-size: 11px; }
.readonly-field strong { font-size: 14px; }

/* Shared seven-step order workflow */
.order-workflow-panel {
  --workflow-yellow: #ffdf3f;
  --workflow-yellow-soft: #fff9d7;
  padding: 0;
  overflow: hidden;
  border-color: #dfe5eb;
  box-shadow: 0 14px 34px rgba(31, 41, 55, .07);
}
.order-workflow-panel:hover { transform: none; }
.work-order-workflow-slot:empty { display: none; }
.work-order-workflow-slot {
  padding: 16px 18px 0;
  background: #f7f9fc;
}
.work-order-workflow-slot > .order-workflow-panel {
  margin: 0;
}
.order-workflow-head {
  min-height: 74px;
  margin: 0;
  padding: 16px 20px 14px;
  align-items: center;
  background: linear-gradient(105deg, #fff 0%, #fff 72%, #fffdf0 100%);
  border-bottom: 1px solid #edf0f3;
}
.order-workflow-head > div:first-child { display: grid; gap: 2px; }
.order-workflow-head > div:first-child > span { color: #af8500; font-size: 9px; font-weight: 1000; letter-spacing: .13em; }
.order-workflow-head h2 { margin: 0; color: #121820; font-size: 19px; }
.order-workflow-head p { margin: 2px 0 0; color: #7a8490; font-size: 11px; line-height: 1.5; }
.order-workflow-head-meta { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 10px; }
.order-workflow-head-meta > span { overflow: hidden; color: #344054; font-size: 12px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.order-workflow-head-meta > b { flex: 0 0 auto; color: #694f00; background: var(--workflow-yellow-soft); border: 1px solid #f1d04d; }
.order-workflow-board { min-width: 0; background: #fff; }
.order-workflow-panel.is-completed:not(.show-history) .admin-order-flow-scroll { display: none; }
.order-workflow-panel.is-completed:not(.show-history) .admin-order-flow-current { margin-top: 16px; }
.admin-order-flow-notice { display: flex; align-items: center; gap: 10px; margin: 14px 18px 0; padding: 10px 12px; color: #7a4d00; background: #fff8e7; border: 1px solid #f5d58a; border-radius: 8px; font-size: 11px; }
.admin-order-flow-notice strong { flex: 0 0 auto; }
.admin-order-flow-notice.is-danger { color: #9b1c1c; background: #fff1f0; border-color: #f6b8b2; }
.admin-order-flow-scroll { min-width: 0; overflow-x: auto; padding: 22px 14px 16px; outline: none; scroll-behavior: smooth; }
.admin-order-flow-scroll:focus-visible { box-shadow: inset 0 0 0 2px rgba(255, 214, 32, .75); }
.admin-order-flow-track {
  min-width: 960px;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(125px, 1fr));
  list-style: none;
}
.admin-order-flow-node { position: relative; min-width: 0; }
.admin-order-flow-node:not(:last-child)::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 13px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 1px;
  border-top: 2px dashed #e4e7eb;
}
.admin-order-flow-node.is-done:not(:last-child)::after { height: 2px; border: 0; background: var(--workflow-yellow); }
.admin-order-flow-node > button {
  position: relative;
  z-index: 1;
  width: 100%;
  min-width: 0;
  padding: 0 7px;
  display: grid;
  justify-items: center;
  gap: 3px;
  color: #94999f;
  background: transparent;
  border: 0;
  text-align: center;
}
.admin-order-flow-node > button:not(:disabled):hover strong { color: #151b22; }
.admin-order-flow-node > button:focus-visible { outline: 2px solid #e6b900; outline-offset: 5px; border-radius: 4px; }
.admin-order-flow-marker {
  width: 24px;
  height: 24px;
  margin-bottom: 6px;
  display: grid;
  place-items: center;
  color: #172027;
  background: #fff;
  border: 2px solid #e6e9ed;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #f7f8fa;
  font-size: 12px;
  font-weight: 1000;
}
.admin-order-flow-node.is-done .admin-order-flow-marker { background: var(--workflow-yellow); border-color: var(--workflow-yellow); box-shadow: none; }
.admin-order-flow-node.is-current .admin-order-flow-marker { background: #fff; border: 3px solid var(--workflow-yellow); box-shadow: 0 0 0 8px rgba(255, 223, 63, .22); }
.admin-order-flow-node.is-current .admin-order-flow-marker::after { content: ""; width: 7px; height: 7px; border: 2px solid #f0c900; border-radius: 50%; }
.admin-order-flow-node b { color: #90969c; font-size: 17px; line-height: 1.15; }
.admin-order-flow-node strong { color: #737a81; font-size: 13px; line-height: 1.3; transition: color .18s; }
.admin-order-flow-node small { color: #a1a8b0; font-size: 9px; font-weight: 800; }
.admin-order-flow-node em,
.admin-order-flow-node time { max-width: 125px; overflow: hidden; color: #a0a6ad; font-size: 9px; font-style: normal; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.admin-order-flow-node em.is-alert { color: #ef4b3f; font-weight: 1000; }
.admin-order-flow-node.is-done b,
.admin-order-flow-node.is-done strong,
.admin-order-flow-node.is-current b,
.admin-order-flow-node.is-current strong { color: #34393e; }
.admin-order-flow-node.is-current strong { font-weight: 1000; }
.admin-order-flow-current {
  margin: 0 18px 18px;
  padding: 14px 16px;
  display: grid;
  grid-template-columns: minmax(260px, 1.1fr) minmax(330px, 1fr) auto;
  align-items: center;
  gap: 18px;
  background: linear-gradient(100deg, #fffbed 0%, #fffdf8 100%);
  border: 1px solid #f3d77a;
  border-radius: 10px;
}
.admin-order-flow-current.is-warning { background: #fff7f4; border-color: #efc0b2; }
.admin-order-flow-current.is-completed {
  grid-template-columns: minmax(260px, 1fr) minmax(320px, 1fr) minmax(290px, .8fr);
  background: linear-gradient(110deg, #fff9d9 0%, #fffdf1 48%, #fff 100%);
  border-color: #ebd052;
  box-shadow: 0 10px 24px rgba(90, 72, 0, .07);
}
.admin-order-flow-current.is-completed .admin-order-flow-current-copy > span { color: #16704f; font-size: 10px; letter-spacing: .04em; }
.admin-order-flow-current-copy { display: grid; gap: 3px; }
.admin-order-flow-current-copy > span { color: #9c7400; font-size: 9px; font-weight: 1000; letter-spacing: .08em; }
.admin-order-flow-current-copy > strong { color: #151b22; font-size: 17px; }
.admin-order-flow-current-copy > p { max-width: 570px; margin: 1px 0 0; color: #697380; font-size: 11px; line-height: 1.55; }
.admin-order-flow-current dl { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(64px, 1fr)); gap: 7px; }
.admin-order-flow-current dl > div { min-width: 0; padding: 7px 9px; background: rgba(255, 255, 255, .88); border: 1px solid #eee6c8; border-radius: 7px; }
.admin-order-flow-current dt { color: #9a9380; font-size: 8px; }
.admin-order-flow-current dd { margin: 3px 0 0; overflow: hidden; color: #343a40; font-size: 10px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.admin-order-flow-current > button,
.workflow-module-context > button {
  min-height: 38px;
  padding: 0 15px;
  color: #fff;
  background: #1c232a;
  border: 1px solid #1c232a;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 1000;
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(28, 35, 42, .14);
}
.admin-order-flow-actions {
  min-width: 290px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}
.admin-order-flow-actions button {
  min-width: 0;
  min-height: 42px;
  padding: 8px 11px;
  display: grid;
  align-content: center;
  gap: 2px;
  border: 1px solid #dfe4e9;
  border-radius: 8px;
  color: #28313a;
  background: #fff;
  text-align: left;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.admin-order-flow-actions button > span { font-size: 11px; font-weight: 1000; }
.admin-order-flow-actions button > small {
  overflow: hidden;
  color: #7b8590;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-order-flow-actions .is-primary {
  grid-column: 1 / -1;
  color: #fff;
  background: #1c232a;
  border-color: #1c232a;
  box-shadow: 0 8px 18px rgba(28, 35, 42, .14);
}
.admin-order-flow-actions .is-primary > small { color: rgba(255, 255, 255, .68); }
.admin-order-flow-actions .is-secondary { background: #ffec72; border-color: #e8cc31; }
.admin-order-flow-actions .is-secondary > small { color: #6d5a00; }
.admin-order-flow-actions button:hover {
  transform: translateY(-1px);
  border-color: #d2b616;
  box-shadow: 0 8px 18px rgba(60, 50, 0, .10);
}
.admin-order-flow-current > button:hover,
.workflow-module-context > button:hover { color: #171d23; background: #ffdf3f; border-color: #eac600; }
.workflow-module-context {
  min-width: 0;
  margin-bottom: 16px;
  padding: 13px 16px;
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(260px, 1.4fr) auto;
  align-items: center;
  gap: 16px;
  color: #25303a;
  background: linear-gradient(100deg, #fff9d7, #fffdf4);
  border: 1px solid #eed15f;
  border-left: 4px solid #ffdb2e;
  border-radius: 9px;
  box-shadow: 0 9px 24px rgba(57, 47, 8, .06);
}
.workflow-module-context > div { display: grid; gap: 2px; min-width: 0; }
.workflow-module-context > div span { color: #9b7400; font-size: 9px; font-weight: 1000; }
.workflow-module-context > div strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.workflow-module-context > div small { color: #8c8270; font-size: 9px; }
.workflow-module-context p { margin: 0; color: #646d78; font-size: 11px; line-height: 1.55; }
.workflow-row-highlight > td { background: #fffbe5 !important; }
.workflow-row-highlight > td:first-child { box-shadow: inset 3px 0 #ffd926; }
.workflow-focus-flash { animation: workflow-focus 1.2s ease-out; }
@keyframes workflow-focus {
  0%, 36% { box-shadow: 0 0 0 4px rgba(255, 215, 35, .38), 0 14px 32px rgba(24, 32, 38, .08); }
  100% { box-shadow: 0 0 0 0 rgba(255, 215, 35, 0); }
}

@media (max-width: 1380px) {
  #products .product-layout { grid-template-columns: 1fr; }
  #products .product-list-panel {
    min-height: 560px;
    height: auto;
    max-height: none;
  }
  .sku-core-layout { grid-template-columns: minmax(0, 1fr) 220px; }
  .sku-core-layout .sku-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
  .metrics { grid-template-columns: repeat(2, 1fr); }
  .grid-form { grid-template-columns: repeat(2, 1fr); }
  .quote-rule-groups,
  .quote-rule-grid,
  .quote-rule-grid.two {
    grid-template-columns: 1fr;
  }
  .quote-rule-actions {
    grid-column: 1;
  }
  .dashboard-grid, .finance-grid { grid-template-columns: 1fr; }
  .boss-goals, .boss-chart-grid { grid-template-columns: 1fr; }
  .phase2-strip { grid-template-columns: 1fr; }
  .platform-grid { grid-template-columns: repeat(2, minmax(170px, 1fr)); }
  .system-health-band { grid-template-columns: repeat(3, 1fr); }
  .system-health-band button { grid-column: 1 / -1; }
  .admin-order-flow-current { grid-template-columns: minmax(230px, 1fr) minmax(300px, 1fr); }
  .admin-order-flow-current.is-completed { grid-template-columns: minmax(230px, 1fr) minmax(300px, 1fr); }
  .admin-order-flow-current > button { grid-column: 1 / -1; justify-self: end; }
  .admin-order-flow-actions { grid-column: 1 / -1; width: 100%; }
}

@media (max-width: 780px) {
  html, body { max-width: 100%; }
  .file-review-backdrop { padding: 6px; }
  .file-review-modal { max-height: calc(100vh - 12px); border-radius: 10px; }
  .file-review-modal-head { padding: 15px 16px 12px; }
  .file-review-workspace { grid-template-columns: 1fr; max-height: calc(100vh - 96px); }
  .file-review-preview-pane { padding: 14px; border-right: 0; border-bottom: 1px solid #e3e8ef; }
  .file-review-preview-box { min-height: 220px; }
  .file-review-form { padding: 15px; }
  .file-review-decision-buttons,
  .file-review-detail-grid { grid-template-columns: 1fr; }
  .file-review-detail-grid label.is-wide { grid-column: auto; }
  .file-review-production-box { align-items: stretch; flex-direction: column; }
  .file-review-production-box button { width: 100%; }
  .file-review-flow li { padding: 8px; }
  .file-review-flow li > b { width: 24px; height: 24px; flex-basis: 24px; }
  .file-review-flow li small { display: none; }
  .file-review-form-actions { display: grid; grid-template-columns: 1fr; }
  .file-review-action-buttons { display: grid; grid-template-columns: .7fr 1.3fr; }
  .file-review-form-actions button { min-width: 0; width: 100%; }
  .order-workflow-head { align-items: flex-start; flex-direction: column; }
  .order-workflow-head-meta { width: 100%; justify-content: space-between; }
  .admin-order-flow-scroll { padding-right: 8px; padding-left: 8px; }
  .admin-order-flow-track { min-width: 900px; }
  .admin-order-flow-current { margin: 0 10px 12px; grid-template-columns: 1fr; gap: 12px; }
  .admin-order-flow-current dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-order-flow-current > button { grid-column: auto; width: 100%; }
  .admin-order-flow-actions { min-width: 0; width: 100%; grid-template-columns: 1fr; }
  .admin-order-flow-actions .is-primary { grid-column: auto; }
  .order-list-tools { width: 100%; justify-content: stretch; }
  .order-list-tools .filter-select,
  .order-list-tools .search-input,
  .order-show-all { width: 100%; }
  .workflow-module-context { grid-template-columns: 1fr; gap: 9px; }
  .workflow-module-context > button { width: 100%; }
  .login-screen { padding: 22px; }
  .login-layout { grid-template-columns: 1fr; gap: 30px; padding: 50px 0; }
  .login-copy h1 { font-size: 36px; }
  .app-shell { min-width: 0; grid-template-columns: minmax(0, 1fr); }
  .quote-rule-actions {
    justify-content: stretch;
    gap: 10px;
  }
  .quote-rule-actions button {
    flex: 1 1 160px;
    width: auto;
    min-width: 0;
  }
  .sidebar { width: 100%; min-width: 0; position: static; height: auto; padding: 14px; }
  .app-brand { padding-bottom: 12px; }
  nav { width: 100%; min-width: 0; max-width: 100%; display: flex; overflow-x: auto; }
  .nav { flex: 0 0 auto; }
  .sidebar-foot { display: none; }
  main { padding: 0 15px 28px; }
  .topbar { align-items: flex-start; padding: 17px 0; }
  .top-actions { flex-wrap: wrap; justify-content: flex-end; }
  #status, .user-chip { display: none; }
  .welcome-band { align-items: flex-start; background: #27323a; }
  .metrics, .split-layout, .quote-layout, .ai-report, .dual-module, .boss-layout { grid-template-columns: 1fr; }
  #shipping > .dual-module > .panel {
    height: auto;
    max-height: none;
  }
  #shipping > .dual-module > .panel > .admin-scroll-table .table-wrap {
    max-height: clamp(260px, calc(100vh - 360px), 420px);
  }
  .support-record-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .support-workbench { grid-template-columns: 1fr; min-height: 0; }
  .support-ticket-list { max-height: 260px; border-right: 0; border-bottom: 1px solid var(--line); }
  .support-customer-card { border-left: 0; border-top: 1px solid var(--line); }
  .support-compose { grid-template-columns: 1fr; }
  .support-compose .primary { min-height: 42px; }
  .sku-core-layout,
  .sku-core-layout .sku-field-grid,
  .sku-field-grid,
  .sku-advanced-grid { grid-template-columns: 1fr; }
  .field-wide { grid-column: auto; }
  .sku-image-field { width: min(100%, 320px); justify-self: center; }
  .sku-savebar { position: static; }
  .sku-savebar button { min-height: 44px; }
  .finance-metrics { grid-template-columns: 1fr; }
  .boss-hero { align-items: flex-start; flex-direction: column; }
  .boss-actions { width: 100%; justify-items: stretch; }
  #boss .boss-analysis-header { align-items: flex-start; flex-direction: column; gap: 13px; }
  #boss .boss-analysis-tabs { width: 100%; }
  #boss .boss-analysis-tabs button { min-width: 116px; height: 44px; padding: 0 10px; }
  #boss .boss-analysis-stage { height: 390px; }
  #boss .boss-analysis-panel { padding: 15px; }
  .range-tabs, .alert-filters, .boss-action-buttons, .ai-actions { width: 100%; }
  .range-tabs button, .alert-filters button, .boss-action-buttons button, .ai-actions button { flex: 1 1 auto; }
  .date-range { width: 100%; }
  .date-range input { flex: 1; min-width: 0; }
  .chart-shell { height: 260px; min-height: 240px; }
  .trend-row { grid-template-columns: 56px minmax(0, 1fr); }
  .trend-row > b { grid-column: 2; text-align: left; }
  .platform-bar-row { grid-template-columns: 1fr; }
  .platform-bar-row small { text-align: left; }
  .business-alert { grid-template-columns: 1fr; }
  .ai-hero { grid-template-columns: 58px 1fr; }
  .ai-orbit { width: 56px; height: 56px; }
  .ai-hero .light-button { grid-column: 1 / -1; }
  .compact-form { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .phase2-metrics { grid-template-columns: repeat(2, 1fr); }
  table, thead, tbody, tr, th, td { display: block; }
  thead { display: none; }
  tr { margin-bottom: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
  td { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #edf0f2; white-space: normal; }
  td::before { content: attr(data-label); flex: 0 0 88px; color: #8a949c; font-size: 11px; font-weight: 800; }
  td:last-child { border-bottom: 0; }
}

@media (max-width: 520px) {
  .login-card { padding: 24px; }
  .login-copy h1 { font-size: 30px; }
  .metrics, .field-row, .grid-form, .compact-form, .platform-grid { grid-template-columns: 1fr; }
  .boss-goals, .report-metrics { grid-template-columns: 1fr; }
  .system-health-band { grid-template-columns: 1fr; }
  .system-health-band > div { padding: 0 0 9px; border-right: 0; border-bottom: 1px solid var(--line); }
  .welcome-band, .form-footer { align-items: stretch; flex-direction: column; }
  .jump-button { align-self: flex-start; }
  .topbar h1 { font-size: 19px; }
  .text-button { display: none; }
  .panel-head { flex-direction: column; }
  .panel-tools { width: 100%; flex-wrap: wrap; }
  .search-input { width: 100%; }
  .sku-builder .sku-template-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sku-popular-head { align-items: flex-start; flex-direction: column; }
  .sku-core-layout,
  .sku-core-layout .sku-field-grid,
  .sku-field-grid,
  .sku-advanced-grid { grid-template-columns: 1fr; }
  .field-wide { grid-column: auto; }
  .sku-image-field { max-width: 260px; width: 100%; justify-self: center; }
  .sku-savebar { grid-template-columns: 1fr 1fr; }
  .sku-savebar .primary { grid-column: 1 / -1; }
}

/* Boss manual quote workbench */
#quoteRequests {
  --mq-yellow: #ffdc35;
  --mq-yellow-soft: #fff9df;
  --mq-navy: #182334;
  --mq-blue-soft: #f4f7fb;
  --mq-border: #dbe3ec;
  display: grid;
  gap: 14px;
}

.manual-quote-hero {
  position: relative;
  overflow: hidden;
  min-height: 118px;
  padding: 24px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  border: 1px solid #f1d873;
  border-radius: 12px;
  color: var(--mq-navy);
  background:
    radial-gradient(circle at 87% 22%, rgba(255, 220, 53, .3), transparent 28%),
    linear-gradient(120deg, #fffdf4 0%, #fff 58%, #fff8cf 100%);
  box-shadow: 0 12px 32px rgba(37, 47, 63, .06);
}
.manual-quote-hero::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--mq-yellow); }
.manual-quote-hero > div:first-child { position: relative; z-index: 1; }
.manual-quote-hero span, .manual-quote-toolbar-title span { color: #9a6b00; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.manual-quote-hero h2 { margin: 5px 0 6px; font-size: 27px; letter-spacing: -.03em; }
.manual-quote-hero p { margin: 0; color: #667383; font-size: 13px; line-height: 1.7; }
.manual-quote-hero-steps { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(92px, 1fr)); gap: 7px; }
.manual-quote-hero-steps b { min-height: 48px; padding: 8px 11px; display: flex; align-items: center; gap: 8px; border: 1px solid rgba(232, 190, 22, .48); border-radius: 9px; background: rgba(255,255,255,.82); font-size: 12px; white-space: nowrap; }
.manual-quote-hero-steps i { width: 25px; height: 25px; flex: 0 0 25px; display: grid; place-items: center; border-radius: 7px; color: var(--mq-navy); background: var(--mq-yellow); font-size: 10px; font-style: normal; }

.manual-quote-toolbar { margin: 0; padding: 15px 18px; display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.manual-quote-toolbar-title { display: flex; align-items: center; gap: 10px; }
.manual-quote-toolbar-title h2 { margin: 2px 0 0; font-size: 19px; }
.manual-quote-filters { flex: 1; display: flex; justify-content: flex-end; align-items: end; gap: 9px; }
.manual-quote-filters label { display: grid; gap: 4px; }
.manual-quote-filters label > span { padding-left: 2px; color: #748091; font-size: 10px; }
.manual-quote-filters select { min-width: 152px; height: 38px; padding: 0 11px; }
.manual-quote-filters input { width: min(30vw, 300px); height: 38px; }
.manual-quote-filters button { min-height: 38px; }

.manual-quote-workspace { min-width: 0; display: grid; grid-template-columns: minmax(290px, 360px) minmax(0, 1fr); gap: 14px; align-items: start; }
.manual-quote-queue-panel, .manual-quote-detail-panel { margin: 0; min-width: 0; }
.manual-quote-queue-panel { position: sticky; top: 10px; padding: 0; overflow: hidden; }
.manual-quote-section-head { padding: 15px 16px 12px; border-bottom: 1px solid var(--mq-border); }
.manual-quote-section-head div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.manual-quote-section-head span { color: var(--mq-navy); font-size: 14px; font-weight: 900; }
.manual-quote-section-head strong { color: #8a95a2; font-size: 12px; }
.manual-quote-queue { max-height: calc(100vh - 310px); min-height: 420px; overflow-y: auto; padding: 8px; background: #f7f9fb; }
.manual-quote-queue-item { width: 100%; margin: 0 0 7px; padding: 13px 13px 11px; display: grid; gap: 5px; text-align: left; color: #667383; border: 1px solid var(--mq-border); border-left: 3px solid transparent; border-radius: 9px; background: #fff; transition: .18s ease; }
.manual-quote-queue-item:hover { border-color: #f0cd39; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(24,35,52,.07); }
.manual-quote-queue-item.active { border-color: #e7bd10; border-left-color: var(--mq-yellow); background: #fffdf2; box-shadow: 0 8px 20px rgba(173,130,0,.09); }
.manual-quote-queue-item > strong { overflow: hidden; color: var(--mq-navy); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.manual-quote-queue-item > span { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.manual-quote-queue-top, .manual-quote-queue-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.manual-quote-queue-top > b { color: var(--mq-navy); font-size: 12px; }
.manual-quote-queue-bottom { margin-top: 3px; padding-top: 8px; border-top: 1px dashed #e3e8ee; }
.manual-quote-queue-bottom small { color: #98a2ad; }
.manual-quote-queue-bottom em { color: #c84b28; font-style: normal; font-size: 12px; font-weight: 900; }
.manual-quote-status { display: inline-flex; min-height: 26px; padding: 0 10px; align-items: center; justify-content: center; border-radius: 999px; color: #775b00; background: #fff4bd; font-size: 11px; font-style: normal; font-weight: 900; white-space: nowrap; }
.manual-quote-status.is-success { color: #117154; background: #e5f7ef; }
.manual-quote-status.is-danger { color: #bc3f2d; background: #fff0ed; }
.manual-quote-status.is-info { color: #245f9d; background: #eaf3ff; }
.manual-quote-queue-empty, .manual-quote-queue-loading { min-height: 380px; padding: 25px; display: grid; place-content: center; gap: 6px; text-align: center; color: #8b96a3; }
.manual-quote-queue-empty b { color: var(--mq-navy); }
.manual-quote-queue-empty span, .manual-quote-queue-loading span { font-size: 11px; }
.manual-quote-queue-loading i, .manual-quote-loading { width: 30px; height: 30px; margin: 0 auto 7px; border: 3px solid #e7ebf0; border-top-color: #e4ba0d; border-radius: 50%; animation: manual-quote-spin .75s linear infinite; }
@keyframes manual-quote-spin { to { transform: rotate(360deg); } }
.manual-quote-pagination { min-height: 48px; padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid var(--mq-border); color: #738091; font-size: 11px; }
.manual-quote-pagination > div { display: flex; align-items: center; gap: 6px; }
.manual-quote-pagination button { min-width: 58px; height: 30px; border: 1px solid #d6dee8; border-radius: 6px; color: var(--mq-navy); background: #fff; font-size: 11px; font-weight: 800; }
.manual-quote-pagination button:disabled { cursor: not-allowed; color: #b4bdc7; background: #f4f6f8; }

.manual-quote-detail-panel { padding: 0; overflow: hidden; }
.manual-quote-empty { min-height: 540px; padding: 45px; display: grid; place-content: center; text-align: center; color: #7c8897; }
.manual-quote-empty-icon { width: 58px; height: 58px; margin: 0 auto 12px; display: grid; place-items: center; border: 1px solid #f1d24f; border-radius: 17px; color: var(--mq-navy); background: var(--mq-yellow); font-size: 25px; font-weight: 900; }
.manual-quote-empty h3 { margin: 0 0 7px; color: var(--mq-navy); font-size: 18px; }
.manual-quote-empty p { max-width: 430px; margin: 0; font-size: 12px; line-height: 1.7; }
.manual-quote-detail { min-width: 0; }
.manual-quote-detail-head { padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--mq-border); background: linear-gradient(100deg, #fffdf4, #fff); }
.manual-quote-detail-head span, .manual-quote-summary-grid article > span, .manual-quote-product-card span { color: #8793a1; font-size: 12px; font-weight: 800; }
.manual-quote-detail-head h2 { margin: 3px 0; color: var(--mq-navy); font-size: 20px; }
.manual-quote-detail-head p { margin: 0; color: #84909e; font-size: 12px; }
.manual-quote-detail-actions { display: flex; align-items: center; gap: 8px; }
.manual-quote-detail-actions button { min-height: 34px; }
.manual-quote-summary-grid { padding: 14px 20px; display: grid; grid-template-columns: minmax(245px, 1.25fr) repeat(3, minmax(150px, 1fr)); gap: 9px; background: #f7f9fb; }
.manual-quote-summary-grid article { min-width: 0; min-height: 108px; padding: 13px; border: 1px solid var(--mq-border); border-radius: 9px; background: #fff; }
.manual-quote-summary-grid h3 { margin: 7px 0 5px; color: var(--mq-navy); font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.manual-quote-summary-grid p { margin: 3px 0; color: #718090; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.manual-quote-product-card { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 11px; }
.manual-quote-product-card img, .manual-quote-product-placeholder { width: 72px; height: 72px; object-fit: cover; border: 1px solid #e0e6ed; border-radius: 8px; }
.manual-quote-product-placeholder { display: grid; place-items: center; color: #9a6b00; background: #fff5c4; font-size: 12px; font-weight: 900; }
.manual-quote-product-card h3 { margin: 3px 0; font-size: 14px; }
.manual-quote-product-card b { color: #4e5d6d; font-size: 12px; }
.manual-quote-requirements { margin: 14px 20px 0; padding: 14px; border: 1px solid var(--mq-border); border-radius: 9px; }
.manual-quote-requirements > header, .manual-quote-history > header, .manual-quote-publish > header { margin-bottom: 11px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.manual-quote-requirements > header span, .manual-quote-history > header span, .manual-quote-publish > header span { color: var(--mq-navy); font-size: 14px; font-weight: 900; }
.manual-quote-requirements > header b, .manual-quote-history > header b, .manual-quote-publish > header b { color: #9a6b00; font-size: 12px; }
.manual-quote-requirements > div:not(.manual-quote-file-list) { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.manual-quote-requirements dl { margin: 0; padding: 10px; border-radius: 7px; background: #f5f7fa; }
.manual-quote-requirements dt { color: #8995a2; font-size: 11px; }
.manual-quote-requirements dd { margin: 4px 0 0; color: var(--mq-navy); font-size: 13px; font-weight: 800; }
.manual-quote-specification { margin-top: 8px; }
.manual-quote-specification span { padding: 8px 10px; display: grid; gap: 3px; border: 1px solid #e5eaf0; border-radius: 7px; color: #596879; background: #fff; font-size: 11px; overflow-wrap: anywhere; }
.manual-quote-specification span b { color: #8b96a3; font-size: 10px; }
.manual-quote-requirements > p { margin: 10px 0 0; padding: 10px; color: #556474; border-left: 3px solid var(--mq-yellow); background: var(--mq-yellow-soft); font-size: 12px; line-height: 1.6; }
.manual-quote-file-list { margin-top: 10px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.manual-quote-file { min-width: 0; padding: 9px 11px; display: grid; gap: 3px; text-align: left; border: 1px solid #d5e0ed; border-radius: 7px; color: #627182; background: #f6faff; }
.manual-quote-file:hover { border-color: #82aee0; background: #edf6ff; }
.manual-quote-file b { overflow: hidden; color: #245f9d; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.manual-quote-file span { font-size: 11px; }
.manual-quote-muted-box { padding: 16px; border: 1px dashed #d5dce5; border-radius: 8px; color: #8b96a3; background: #f8fafc; text-align: center; font-size: 11px; }

.manual-quote-detail-columns { padding: 14px 20px 18px; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr); gap: 12px; align-items: start; }
.manual-quote-history, .manual-quote-publish { min-width: 0; padding: 14px; border: 1px solid var(--mq-border); border-radius: 9px; }
.manual-quote-publish { position: sticky; top: 10px; background: #fffdf3; border-color: #eed67a; }
.manual-quote-version-list { display: grid; gap: 9px; }
.manual-quote-version { overflow: hidden; border: 1px solid #dae2eb; border-radius: 8px; background: #fff; }
.manual-quote-version.is-accepted { border-color: #65bda3; box-shadow: inset 3px 0 #39a782; }
.manual-quote-version > header { padding: 10px 11px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #edf0f4; background: #f8fafc; }
.manual-quote-version > header div { display: flex; align-items: center; gap: 7px; }
.manual-quote-version > header b { color: var(--mq-navy); font-size: 13px; }
.manual-quote-number { padding: 3px 7px; border: 1px solid #e2c14a; border-radius: 999px; color: #735500; background: #fff7cc; font-size: 9px; font-style: normal; font-weight: 900; letter-spacing: .02em; }
.manual-quote-version > header i { padding: 3px 6px; border-radius: 999px; color: #117154; background: #e5f7ef; font-size: 8px; font-style: normal; font-weight: 900; }
.manual-quote-version > header span { color: #8793a1; font-size: 11px; }
.manual-quote-version-prices { padding: 10px 11px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(120px, 1.25fr); gap: 6px; }
.manual-quote-version-prices span, .manual-quote-version-prices > strong { min-width: 0; padding: 8px; display: grid; gap: 3px; border-radius: 6px; color: #81909e; background: #f6f8fa; font-size: 11px; }
.manual-quote-version-prices b { color: var(--mq-navy); font-size: 12px; }
.manual-quote-version-prices > strong { color: #b64022; background: #fff1e9; font-size: 13px; align-content: center; }
.manual-quote-version dl { margin: 0 11px; padding: 8px 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px dashed #e1e6ec; }
.manual-quote-version dl > div { padding: 0 8px; border-right: 1px solid #e7ebef; }
.manual-quote-version dl > div:last-child { border: 0; }
.manual-quote-version dt { color: #8995a2; font-size: 10px; }
.manual-quote-version dd { margin: 4px 0 0; color: var(--mq-navy); font-size: 12px; font-weight: 800; }
.manual-quote-version > p { margin: 8px 11px; padding: 9px; color: #647382; border-radius: 6px; background: #fffbea; font-size: 12px; line-height: 1.6; }
.manual-quote-version > footer { padding: 8px 11px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid #edf0f4; }
.manual-quote-version > footer > span { color: #929da8; font-size: 10px; }
.manual-quote-version > footer div { display: flex; gap: 5px; }
.manual-quote-version > footer button { height: 30px; padding: 0 9px; border: 1px solid #d8e0e9; border-radius: 5px; color: #465565; background: #fff; font-size: 11px; font-weight: 800; }
.manual-quote-version-form { display: grid; gap: 10px; }
.manual-quote-version-form label { gap: 5px; color: #4c5967; font-size: 12px; }
.manual-quote-version-form input, .manual-quote-version-form textarea { border-color: #d8e0e8; background: #fff; }
.manual-quote-version-form > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
#quoteVersionTotal { padding: 12px; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; border: 1px solid #ebc84e; border-radius: 8px; background: #fff; }
#quoteVersionTotal span { color: #667382; font-size: 10px; }
#quoteVersionTotal strong { color: #d54824; font-size: 20px; }
#quoteVersionTotal small { grid-column: 1 / -1; color: #9a7a20; font-size: 8px; }
.manual-quote-publish-note { padding: 10px; display: grid !important; grid-template-columns: 1fr !important; gap: 3px !important; border-left: 3px solid var(--mq-yellow); border-radius: 6px; color: #697686; background: #fff8d8; font-size: 9px; }
.manual-quote-publish-note b { color: var(--mq-navy); font-size: 12px; }
.manual-quote-version-form > .primary { min-height: 42px; color: var(--mq-navy); background: var(--mq-yellow); border-color: #e6bd0c; }
.manual-quote-version-form > .primary:hover { background: #f2c900; }
.manual-quote-readonly { min-height: 160px; padding: 20px; display: grid; place-content: center; gap: 6px; text-align: center; border: 1px dashed #dbc65d; border-radius: 8px; background: #fff; }
.manual-quote-readonly b { color: var(--mq-navy); }
.manual-quote-readonly span { color: #84909d; font-size: 12px; }
.manual-quote-audit { margin: 0 20px 20px; border: 1px solid var(--mq-border); border-radius: 9px; }
.manual-quote-audit summary { padding: 13px 15px; color: var(--mq-navy); font-size: 12px; font-weight: 900; cursor: pointer; }
.manual-quote-audit summary b { margin-left: 4px; color: #a77800; }
.manual-quote-audit-list { margin: 0; padding: 0 15px 15px; list-style: none; }
.manual-quote-audit-list li { position: relative; padding: 0 0 13px 20px; }
.manual-quote-audit-list li::before { content: ""; position: absolute; left: 4px; top: 7px; bottom: -4px; width: 1px; background: #dde3ea; }
.manual-quote-audit-list li:last-child::before { display: none; }
.manual-quote-audit-list li > i { position: absolute; left: 0; top: 4px; width: 9px; height: 9px; border: 2px solid #fff; border-radius: 50%; background: var(--mq-yellow); box-shadow: 0 0 0 1px #d5af0d; }
.manual-quote-audit-list b { color: var(--mq-navy); font-size: 12px; }
.manual-quote-audit-list p { margin: 3px 0; color: #677586; font-size: 12px; }
.manual-quote-audit-list span { color: #929ca7; font-size: 11px; }

@media (max-width: 1380px) {
  .manual-quote-workspace { grid-template-columns: 320px minmax(0, 1fr); }
  .manual-quote-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .manual-quote-detail-columns { grid-template-columns: 1fr; }
  .manual-quote-publish { position: static; }
}

@media (max-width: 1020px) {
  .manual-quote-hero { align-items: flex-start; flex-direction: column; }
  .manual-quote-hero-steps { width: 100%; }
  .manual-quote-toolbar { align-items: flex-start; flex-direction: column; }
  .manual-quote-filters { width: 100%; justify-content: stretch; }
  .manual-quote-filters label { flex: 1; }
  .manual-quote-filters input { width: 100%; }
  .manual-quote-workspace { grid-template-columns: 1fr; }
  .manual-quote-queue-panel { position: static; }
  .manual-quote-queue { min-height: 220px; max-height: 360px; }
}

@media (max-width: 700px) {
  .manual-quote-hero { padding: 20px; }
  .manual-quote-hero h2 { font-size: 22px; }
  .manual-quote-hero-steps { grid-template-columns: repeat(2, 1fr); }
  .manual-quote-filters { display: grid; grid-template-columns: 1fr; }
  .manual-quote-summary-grid { padding: 11px; grid-template-columns: 1fr; }
  .manual-quote-requirements { margin: 11px; }
  .manual-quote-requirements > div:not(.manual-quote-file-list), .manual-quote-file-list { grid-template-columns: 1fr; }
  .manual-quote-detail-columns { padding: 11px; }
  .manual-quote-version-prices { grid-template-columns: repeat(2, 1fr); }
  .manual-quote-version > footer { align-items: flex-start; flex-direction: column; }
  .manual-quote-audit { margin: 0 11px 11px; }
}

/* Unified order entry and fulfillment workspace */
#orders .order-management-workspace {
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-color: #d8e1ea;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 16px 38px rgba(27, 39, 56, .08);
}

#orders .order-management-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 20px 22px;
  border-bottom: 1px solid #e2e7ed;
  background: linear-gradient(105deg, #fff9dd 0%, #fffdf4 33%, #f7f9fc 100%);
}

#orders .order-management-title > span,
#orders .order-entry-panel .panel-head span,
#orders .order-list-section .panel-head span {
  color: #9b6b00;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .11em;
}

#orders .order-management-title h2 {
  margin: 4px 0 3px;
  color: #142135;
  font-size: 23px;
  letter-spacing: -.02em;
}

#orders .order-management-title p {
  margin: 0;
  color: #748092;
  font-size: 12px;
}

#orders .order-entry-tabs {
  flex: 0 0 auto;
  gap: 5px;
  margin: 0;
  padding: 4px;
  border: 1px solid #dae2ea;
  border-radius: 10px;
  background: #eef2f6;
}

#orders .order-entry-tabs .subtab {
  min-width: 132px;
  height: 38px;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #687588;
  background: transparent;
  font-size: 12px;
}

#orders .order-entry-tabs .subtab.active {
  border-color: #edc21d;
  color: #172234;
  background: #fff;
  box-shadow: 0 5px 14px rgba(46, 57, 73, .08), inset 3px 0 #ffd72e;
}

#orders .order-entry-panel {
  padding: 17px 20px 20px;
  border-bottom: 1px solid #e2e7ed;
  background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
}

#orders .order-entry-panel .panel-head,
#orders .order-list-section .panel-head {
  margin-bottom: 13px;
  padding: 0;
}

#orders .order-entry-panel .panel-head h2,
#orders .order-list-section .panel-head h2 {
  margin-top: 3px;
  color: #162235;
  font-size: 19px;
}

#orders .order-entry-panel .panel-head > small {
  color: #8390a0;
  font-size: 11px;
}

#orders .order-entry-panel .grid-form {
  gap: 11px 13px;
}

#orders .order-entry-panel .grid-form label {
  gap: 6px;
  color: #39475a;
  font-size: 11px;
  font-weight: 800;
}

#orders .order-entry-panel .grid-form input {
  height: 42px;
  border-color: #d7e0e9;
  border-radius: 8px;
  background: #fff;
}

#orders .order-entry-panel .grid-form input:focus {
  border-color: #e4b900;
  box-shadow: 0 0 0 3px rgba(255, 215, 46, .15);
}

#orders .order-entry-panel .grid-form .primary {
  min-height: 42px;
  border-radius: 8px;
  box-shadow: 0 8px 17px rgba(237, 80, 43, .16);
}

#orders .order-import-panel textarea {
  min-height: 160px;
  border-color: #d7e0e9;
  border-radius: 9px;
  background: #fbfcfe;
}

#orders .order-import-panel .form-footer {
  margin-top: 11px;
  padding-top: 0;
  border: 0;
}

#orders .order-list-section {
  padding: 18px 20px 20px;
  background: #fff;
}

#orders .order-list-section .order-list-tools {
  padding: 5px;
  border: 1px solid #e0e6ed;
  border-radius: 9px;
  background: #f6f8fa;
}

#orders .order-list-section .order-list-tools select,
#orders .order-list-section .order-list-tools input,
#orders .order-list-section .order-list-tools button {
  height: 34px;
  margin: 0;
  border-radius: 6px;
  background-color: #fff;
}

#orders .order-list-section .admin-scroll-table .table-wrap {
  max-height: clamp(420px, calc(100vh - 520px), 620px);
  overflow: auto;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  background: #fff;
}

#orders .order-list-pagination {
  margin-top: 12px;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  background: #fbfcfe;
}

@media (max-width: 980px) {
  #orders .order-management-header {
    align-items: flex-start;
    flex-direction: column;
  }
  #orders .order-entry-tabs {
    width: 100%;
  }
  #orders .order-entry-tabs .subtab {
    flex: 1;
  }
}

@media (max-width: 700px) {
  #orders .order-management-header,
  #orders .order-entry-panel,
  #orders .order-list-section {
    padding: 15px;
  }
  #orders .order-entry-tabs {
    overflow-x: auto;
  }
  #orders .order-entry-tabs .subtab {
    min-width: 120px;
  }
}

/* Unified product and SKU workspace */
#products .product-workspace-panel {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #dce5ee;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 16px 42px rgba(18, 28, 38, .07);
}
.product-workspace-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 94px;
  padding: 20px 24px;
  border-bottom: 1px solid #e7edf3;
  background: linear-gradient(110deg, #fffef8 0%, #fff 55%, #fff9dc 100%);
}
.product-workspace-head > div:first-child > span {
  color: #9a7300;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: 1.1px;
}
.product-workspace-head h2 {
  margin: 4px 0 0;
  color: #071522;
  font-size: 24px;
  line-height: 1.2;
}
.product-workspace-head p {
  margin: 5px 0 0;
  color: #6f7d89;
  font-size: 13px;
}
.product-workspace-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(132px, 1fr));
  gap: 7px;
  padding: 6px;
  border: 1px solid #dce5ed;
  border-radius: 11px;
  background: #f1f4f7;
}

/* Storefront recommendation manager */
.product-showcase-workspace {
  width: 100%;
  min-width: 0;
  padding: 16px;
  background: #f5f7fa;
}
.product-showcase-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px;
  border: 1px solid #e0e7ee;
  border-radius: 14px;
  background: linear-gradient(115deg, #fff 0%, #fffef5 58%, #fff2ad 100%);
  box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}
.product-frequent-head {
  background: linear-gradient(115deg, #fff 0%, #f8fffd 58%, #cffff0 100%);
}
.product-frequent-head span { color: #087b5b; }
.product-frequent-head .product-showcase-preview {
  color: #063f31;
  border-color: #6acdb0;
  background: #baf3df;
  box-shadow: 0 7px 16px rgba(18, 142, 106, .14);
}
.product-showcase-head span {
  color: #a47400;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: 1.2px;
}
.product-showcase-head h2 { margin: 5px 0 0; color: #071522; font-size: 23px; }
.product-showcase-head p { margin: 7px 0 0; color: #697887; font-size: 13px; }
.product-showcase-preview {
  flex: 0 0 auto;
  padding: 11px 16px;
  color: #111c2b;
  border: 1px solid #e5b900;
  border-radius: 9px;
  background: #ffda35;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 7px 16px rgba(209, 161, 0, .15);
}
.product-showcase-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.product-showcase-summary > div {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 3px 12px;
  min-height: 70px;
  padding: 12px 16px;
  border: 1px solid #dfe7ef;
  border-radius: 12px;
  background: #fff;
}
.product-showcase-summary small { color: #748292; font-size: 12px; font-weight: 800; }
.product-showcase-summary strong { justify-self: end; color: #111c2b; font-size: 19px; }
.product-showcase-summary span { grid-column: 1 / -1; color: #7b8794; font-size: 12px; }
.product-showcase-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 220px auto;
  align-items: end;
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #dce5ed;
  border-radius: 12px;
  background: #fff;
}
.product-showcase-toolbar label { display: grid; gap: 6px; color: #4f5e6c; font-size: 12px; font-weight: 900; }
.product-showcase-toolbar input,
.product-showcase-toolbar select {
  width: 100%;
  min-height: 42px;
  padding: 0 13px;
  color: #152233;
  border: 1px solid #cfdbe6;
  border-radius: 9px;
  background: #f9fbfc;
  font: inherit;
  font-size: 14px;
}
.product-showcase-toolbar > b {
  min-width: 94px;
  padding: 12px 14px;
  color: #182433;
  border-radius: 9px;
  background: #fff3b4;
  text-align: center;
  font-size: 13px;
}
.product-showcase-notice {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 0;
  padding: 12px 15px;
  color: #6e5a13;
  border: 1px solid #f0d36c;
  border-radius: 10px;
  background: #fff9dc;
  font-size: 12px;
}
.product-showcase-notice b { color: #111c2b; }
.product-showcase-layout {
  display: grid;
  grid-template-columns: 218px minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  margin-top: 12px;
}
.product-showcase-categories {
  position: sticky;
  top: 12px;
  overflow: hidden;
  border: 1px solid #d9e3ec;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}
.product-showcase-categories header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 15px;
  border-bottom: 1px solid #e4eaf0;
  background: linear-gradient(135deg, #fffdf1, #fff6c8);
}
.product-showcase-categories header > div { display: grid; gap: 3px; }
.product-showcase-categories header small { color: #a47400; font-size: 8px; font-weight: 1000; letter-spacing: .8px; }
.product-showcase-categories header strong { color: #0b1725; font-size: 16px; }
.product-showcase-categories header > span {
  padding: 5px 8px;
  color: #7c6000;
  border-radius: 999px;
  background: #ffe36b;
  font-size: 11px;
  font-weight: 900;
}
.product-showcase-category-list { display: grid; gap: 4px; padding: 8px; }
.product-showcase-category-list button {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 11px;
  color: #405062;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
}
.product-showcase-category-list button:hover { color: #111c2b; background: #f3f6f8; }
.product-showcase-category-list button.active {
  color: #111c2b;
  border-color: #efc21a;
  background: #ffed92;
  box-shadow: inset 3px 0 #182433;
}
.product-showcase-category-list button b {
  min-width: 28px;
  padding: 4px 6px;
  color: #637183;
  border-radius: 999px;
  background: #eef2f5;
  text-align: center;
  font-size: 11px;
}
.product-showcase-category-list button.active b { color: #111c2b; background: #fff; }
.product-showcase-results { min-width: 0; }
.product-showcase-results .product-showcase-notice { margin: 0 0 10px; }
.product-frequent-results { margin-top: 12px; }
.product-showcase-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  gap: 11px;
}
.product-showcase-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #dbe4ed;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.product-showcase-card:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(15, 23, 42, .08); }
.product-showcase-card.is-featured { border-color: #edbd10; box-shadow: 0 10px 26px rgba(210, 158, 0, .12); }
.product-showcase-card.is-saving::after {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: grid;
  place-items: center;
  content: "正在上传并保存…";
  color: #152233;
  background: rgba(255, 255, 255, .88);
  font-weight: 900;
}
.product-showcase-media {
  position: relative;
  display: grid;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  place-items: center;
  overflow: hidden;
  padding: 0;
  background: #f8fafc;
}
.product-showcase-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 12px 12px 0 0;
}
.product-showcase-media > span { display: grid; gap: 5px; color: #8793a0; text-align: center; }
.product-showcase-media > span b { color: #536170; font-size: 15px; }
.product-showcase-media > span small { font-size: 12px; }
.product-showcase-media em {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  padding: 0 11px;
  color: #fff;
  border-radius: 12px 0 9px 0;
  background: linear-gradient(180deg, #ff5a5f, #ff3f50);
  box-shadow: 0 8px 16px rgba(255, 63, 80, .25);
  font-size: 12px;
  font-style: normal;
  font-weight: 1000;
}
.product-showcase-card-body { padding: 12px; }
.product-showcase-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.product-showcase-title > div { min-width: 0; }
.product-showcase-title strong,
.product-showcase-title small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-showcase-title strong { color: #0a1726; font-size: 14px; }
.product-showcase-title small { margin-top: 4px; color: #708094; font-size: 10px; }
.product-showcase-title i {
  flex: 0 0 auto;
  padding: 5px 8px;
  color: #627080;
  border-radius: 999px;
  background: #edf2f6;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.product-showcase-card.is-featured .product-showcase-title i { color: #765900; background: #fff1a7; }
.product-showcase-card-body > p {
  min-height: 20px;
  margin: 8px 0;
  overflow: hidden;
  color: #667586;
  font-size: 12px;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.product-showcase-card-meta { display: flex; justify-content: space-between; gap: 8px; padding-top: 8px; border-top: 1px dashed #dbe3ea; color: #6d7c8c; font-size: 10px; }
.product-showcase-card-meta small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-showcase-card-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }
.product-showcase-card-actions button {
  display: flex;
  min-width: 0;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  padding: 5px 3px;
  color: #223142;
  border: 1px solid #d4dee7;
  border-radius: 10px;
  background: linear-gradient(180deg, #fff, #f7f9fb);
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 4px 10px rgba(15, 23, 42, .06);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.product-showcase-card-actions button:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 7px 14px rgba(15, 23, 42, .1); }
.product-showcase-card-actions button span { flex: 0 0 auto; font-size: 15px; line-height: 1; }
.product-showcase-card-actions button b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-showcase-card-actions button.primary { color: #171717; border-color: #e5b400; background: linear-gradient(180deg, #ffe45e, #ffd21f); }
.product-showcase-card-actions :is(.showcase-toggle-featured, .frequent-toggle-featured) { color: #5a4300; border-color: #ead27e; background: linear-gradient(180deg, #fffdf2, #fff5c9); }
.product-showcase-card-actions :is(.showcase-toggle-featured, .frequent-toggle-featured).is-active { color: #8a2d22; border-color: #f0b9b1; background: linear-gradient(180deg, #fff8f7, #ffebe8); }
.product-showcase-card-actions button:disabled { cursor: not-allowed; opacity: .4; }
.product-showcase-card-actions .showcase-edit-product { color: #34465a; border-color: #c9d7e4; background: linear-gradient(180deg, #f8fbfe, #edf3f8); }
.product-showcase-order-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 8px;
  color: #7a650f;
  font-size: 11px;
  font-weight: 900;
}
.product-showcase-order-actions span { margin-right: auto; }
.product-showcase-order-actions button {
  width: 30px;
  height: 28px;
  color: #5d4a00;
  border: 1px solid #ead06a;
  border-radius: 8px;
  background: #fff9d9;
  font-weight: 1000;
}
.product-showcase-order-actions button:disabled { cursor: not-allowed; opacity: .35; }
.product-showcase-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
  padding: 15px 18px;
  border: 1px solid #e1e7ee;
  border-radius: 13px;
  background: #f8fafc;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}
.product-showcase-pagination > button {
  min-width: 88px;
  height: 38px;
  padding: 0 14px;
  color: #23344b;
  border: 1px solid #cfd9e5;
  border-radius: 9px;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 3px 8px rgba(15, 23, 42, .04);
}
.product-showcase-pagination > button:hover:not(:disabled) { color: #111c2b; border-color: #e5b900; background: #fff9d8; }
.product-showcase-pagination > button:disabled { cursor: not-allowed; color: #9aa8b7; background: #f4f6f8; opacity: .75; }
.product-showcase-pagination > strong { color: #53627a; font-size: 13px; }
.product-showcase-pagination label { display: flex; align-items: center; gap: 6px; color: #53627a; font-size: 13px; font-weight: 800; }
.product-showcase-pagination input {
  width: 48px;
  height: 36px;
  padding: 0 5px;
  color: #111c2b;
  border: 1px solid #cbd6e2;
  border-radius: 8px;
  background: #fff;
  text-align: center;
  font: inherit;
  font-weight: 900;
}
.product-showcase-pagination.is-empty { display: none; }
.product-showcase-empty { grid-column: 1 / -1; display: grid; min-height: 180px; place-content: center; gap: 7px; color: #778595; border: 1px dashed #cad7e2; border-radius: 12px; background: #fff; text-align: center; }
#productShowcaseImageInput { display: none; }

@media (max-width: 1250px) {
  .product-workspace-head { align-items: stretch; flex-direction: column; }
  .product-workspace-tabs { width: 100%; }
  .product-showcase-layout { grid-template-columns: 190px minmax(0, 1fr); }
}
@media (max-width: 780px) {
  .product-workspace-tabs { grid-template-columns: 1fr; }
  .product-showcase-workspace { padding: 12px; }
  .product-showcase-head { align-items: flex-start; flex-direction: column; padding: 18px; }
  .product-showcase-summary,
  .product-showcase-grid { grid-template-columns: 1fr; }
  .product-showcase-toolbar { grid-template-columns: 1fr; }
  .product-showcase-toolbar > b { justify-self: stretch; }
  .product-showcase-notice { align-items: flex-start; flex-direction: column; }
  .product-showcase-layout { grid-template-columns: 1fr; }
  .product-showcase-categories { position: static; }
  .product-showcase-category-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-showcase-pagination { gap: 8px; padding: 12px; }
  .product-showcase-pagination > button { min-width: 82px; }
  .product-showcase-pagination > strong { width: 100%; text-align: center; }
}
.product-workspace-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 0 16px;
  color: #64717d;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  font-size: 14px;
  font-weight: 900;
}
.product-workspace-tabs button b {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  color: #586572;
  border-radius: 7px;
  background: #fff;
  font-size: 11px;
}
.product-workspace-tabs button em {
  min-width: 27px;
  padding: 4px 7px;
  color: #66727d;
  border-radius: 999px;
  background: #e4eaf0;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.product-workspace-tabs button:hover {
  color: #172027;
  background: rgba(255, 255, 255, .7);
}
.product-workspace-tabs button.active {
  color: #172027;
  border-color: #f0c735;
  background: #fff;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .08);
}
.product-workspace-tabs button.active b {
  color: #172027;
  background: #ffda35;
}
.product-workspace-tabs button.active em {
  color: #172027;
  background: #fff0a5;
}
.product-workspace-body {
  min-width: 0;
  background: #f6f8fa;
}
#products .product-workspace-panel .product-create-panel,
#products .product-workspace-panel .product-list-panel {
  width: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
#products .product-workspace-panel .product-create-panel > .panel-head,
#products .product-workspace-panel .product-list-panel > .panel-head {
  min-height: 82px;
  padding: 20px 24px 17px;
}
#products .product-workspace-panel .product-create-panel .panel-head span,
#products .product-workspace-panel .product-list-panel .panel-head span {
  font-size: 12px;
}
#products .product-workspace-panel .product-create-panel .panel-head h2,
#products .product-workspace-panel .product-list-panel .panel-head h2 {
  font-size: 22px;
}
#products .product-workspace-panel .sku-builder {
  gap: 18px;
  padding: 22px;
}
#products .product-workspace-panel .sku-form-card {
  padding: 20px;
  border-radius: 11px;
}
#products .product-workspace-panel .sku-section-head {
  gap: 12px;
  margin-bottom: 17px;
}
#products .product-workspace-panel .sku-section-head > b {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
  border-radius: 12px;
  font-size: 13px;
}
#products .product-workspace-panel .sku-section-head h3 {
  font-size: 20px;
}
#products .product-workspace-panel .sku-section-head p {
  margin-top: 4px;
  font-size: 14px;
}
#products .product-workspace-panel .sku-create-modes {
  gap: 7px;
  padding: 5px;
  margin-bottom: 17px;
}
#products .product-workspace-panel .sku-create-modes button {
  min-height: 44px;
  font-size: 15px;
}
#products .product-workspace-panel .sku-category-head,
#products .product-workspace-panel .sku-popular-head {
  margin-bottom: 10px;
  font-size: 14px;
}
#products .product-workspace-panel .sku-category-head small,
#products .product-workspace-panel .sku-popular-head small {
  font-size: 12px;
}
#products .product-workspace-panel .sku-template-row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
#products .product-workspace-panel .sku-template-row button,
#products .product-workspace-panel .sku-template-row button:last-child:nth-child(odd) {
  min-height: 52px;
  padding: 9px 10px 9px 13px;
  border-radius: 9px;
  font-size: 14px;
}
#products .product-workspace-panel .sku-template-row button > small {
  min-width: 30px;
  height: 27px;
  font-size: 12px;
}
#products .product-workspace-panel .sku-popular-head {
  margin-top: 18px;
}
#products .product-workspace-panel .sku-popular-templates {
  gap: 8px;
}
#products .product-workspace-panel .sku-popular-templates button {
  min-height: 36px;
  padding: 0 13px;
  font-size: 13px;
}
#products .product-workspace-panel .sku-library-search,
#products .product-workspace-panel .sku-field-grid label,
#products .product-workspace-panel .sku-advanced-grid label,
#products .product-workspace-panel .sku-image-field legend {
  font-size: 14px;
}
#products .product-workspace-panel .sku-library-search input,
#products .product-workspace-panel .sku-field-grid input,
#products .product-workspace-panel .sku-field-grid select,
#products .product-workspace-panel .sku-advanced-grid input,
#products .product-workspace-panel .sku-advanced-grid select,
#products .product-workspace-panel .sku-advanced-grid textarea {
  min-height: 44px;
  font-size: 15px;
}
#products .product-workspace-panel .sku-clone-tip {
  font-size: 13px;
}
#products .product-workspace-panel .sku-clone-results > button {
  grid-template-columns: 58px minmax(0, 1fr) auto;
  min-height: 74px;
  padding: 9px;
}
#products .product-workspace-panel .sku-clone-thumb {
  width: 58px;
  height: 58px;
  font-size: 11px;
}
#products .product-workspace-panel .sku-clone-copy b { font-size: 15px; }
#products .product-workspace-panel .sku-clone-copy small,
#products .product-workspace-panel .sku-clone-copy em { font-size: 12px; }
#products .product-workspace-panel .sku-clone-results > button > strong { font-size: 14px; }
#products .product-workspace-panel .sku-core-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
}
#products .product-workspace-panel .sku-core-layout .sku-field-grid,
#products .product-workspace-panel .sku-field-grid,
#products .product-workspace-panel .sku-advanced-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
#products .product-workspace-panel .sku-business-fields {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#products .product-workspace-panel .sku-input-action button {
  min-width: 100px;
  font-size: 12px;
}
#products .product-workspace-panel .sku-image-field {
  padding: 13px;
}
#products .product-workspace-panel .sku-image-field .sku-image-preview {
  min-height: 220px;
}
#products .product-workspace-panel .sku-image-preview strong { font-size: 14px; }
#products .product-workspace-panel .sku-image-preview small,
#products .product-workspace-panel .sku-image-field > small { font-size: 12px; }
#products .product-workspace-panel .sku-image-actions button { min-height: 36px; font-size: 13px; }
#products .product-workspace-panel .sku-pricing-hint {
  gap: 4px;
  padding: 13px 15px;
}
#products .product-workspace-panel .sku-pricing-hint b { font-size: 14px; }
#products .product-workspace-panel .sku-pricing-hint span { font-size: 13px; }
#products .product-workspace-panel .sku-advanced-fields summary {
  padding: 14px;
  font-size: 14px;
}
#products .product-workspace-panel .sku-advanced-fields summary small,
#products .product-workspace-panel .sku-advanced-fields summary::after { font-size: 12px; }
#products .product-workspace-panel .sku-savebar {
  padding: 14px;
}
#products .product-workspace-panel .sku-savebar > div b { font-size: 14px; }
#products .product-workspace-panel .sku-savebar > div small { font-size: 12px; }
#products .product-workspace-panel .sku-savebar button {
  min-height: 44px;
  font-size: 14px;
}
#products .product-workspace-panel .product-list-panel {
  min-height: 500px;
  height: var(--product-list-height, 650px);
  max-height: var(--product-list-height, 650px);
}
#products .product-workspace-panel .product-list-panel #productTable th {
  font-size: 13px;
}
#products .product-workspace-panel .product-list-panel #productTable td {
  font-size: 14px;
}
#products .product-workspace-panel .product-list-panel #productTable td:first-child b {
  font-size: 14px;
}

@media (max-width: 1100px) {
  .product-workspace-head { align-items: flex-start; flex-direction: column; }
  .product-workspace-tabs { width: 100%; }
  #products .product-workspace-panel .sku-template-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #products .product-workspace-panel .sku-core-layout { grid-template-columns: minmax(0, 1fr) 250px; }
  #products .product-workspace-panel .sku-business-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 780px) {
  .product-workspace-head { padding: 18px; }
  .product-workspace-head h2 { font-size: 21px; }
  .product-workspace-tabs { grid-template-columns: 1fr; }
  .product-workspace-tabs button { min-width: 0; padding: 0 9px; font-size: 13px; }
  #products .product-workspace-panel .sku-builder { padding: 15px; }
  #products .product-workspace-panel .sku-form-card { padding: 16px; }
  #products .product-workspace-panel .sku-template-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #products .product-workspace-panel .sku-core-layout,
  #products .product-workspace-panel .sku-core-layout .sku-field-grid,
  #products .product-workspace-panel .sku-field-grid,
  #products .product-workspace-panel .sku-business-fields,
  #products .product-workspace-panel .sku-advanced-grid { grid-template-columns: 1fr; }
  #products .product-workspace-panel .field-wide { grid-column: auto; }
  #products .product-workspace-panel .sku-image-field { width: min(100%, 380px); justify-self: center; }
  #products .product-workspace-panel #productLibraryWorkspace {
    min-height: 0;
    height: auto;
    max-height: none;
  }
  #products .product-workspace-panel #productLibraryWorkspace #productTable {
    min-height: 440px;
  }
}

/* One compact collection workbench with three switchable tasks. */
#collections .collections-workspace-panel {
  padding: 0;
  overflow: hidden;
  border: 1px solid #dce4ec;
  border-radius: 13px;
  box-shadow: 0 14px 32px rgba(27, 39, 53, .06);
}

#collections .collections-workspace-heading {
  display: flex;
  min-height: 92px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 15px 18px;
  border-bottom: 1px solid #dfe6ed;
  background: linear-gradient(100deg, #fffdf3 0%, #fff 48%, #f7f9fc 100%);
}

#collections .collections-workspace-heading > div:first-child {
  display: grid;
  gap: 2px;
}

#collections .collections-workspace-heading > div:first-child > span,
#collections .collections-tab-panel-head span {
  color: #a47700;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .1em;
}

#collections .collections-workspace-heading h2 {
  margin: 0;
  color: #162235;
  font-size: 20px;
}

#collections .collections-workspace-heading p {
  margin: 0;
  color: #7d8998;
  font-size: 11px;
}

#collections .collections-workspace-tabs {
  display: flex;
  gap: 6px;
  padding: 5px;
  border: 1px solid #dce4ec;
  border-radius: 11px;
  background: #eef2f6;
}

#collections .collections-workspace-tabs button {
  display: inline-flex;
  min-width: 142px;
  height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 13px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: #5b697b;
  background: transparent;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

#collections .collections-workspace-tabs button:hover {
  color: #182437;
  background: rgba(255, 255, 255, .76);
}

#collections .collections-workspace-tabs button.active {
  border-color: #e6bf18;
  color: #172234;
  background: #fff;
  box-shadow: inset 0 -3px 0 #ffd52a, 0 6px 14px rgba(32, 44, 58, .07);
}

#collections .collections-workspace-tabs button b {
  display: grid;
  min-width: 23px;
  height: 23px;
  padding: 0 6px;
  place-items: center;
  border-radius: 8px;
  color: #607084;
  background: #fff;
  font-size: 10px;
}

#collections .collections-workspace-tabs button.active b {
  color: #614a00;
  background: #ffe46b;
}

#collections .collections-tab-panel {
  min-height: clamp(560px, calc(100vh - 355px), 720px);
  padding: 18px;
  background: #f8fafc;
}

#collections .collections-tab-panel.hidden {
  display: none !important;
}

#collections .collections-tab-panel-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
  padding: 0 2px 12px;
  border-bottom: 1px solid #e2e8ef;
}

#collections .collections-tab-panel-head > div {
  display: grid;
  gap: 2px;
}

#collections .collections-tab-panel-head h3 {
  margin: 0;
  color: #172234;
  font-size: 19px;
}

#collections .collections-tab-panel-head small {
  color: #7f8b99;
  font-size: 10px;
  text-align: right;
}

#collections .collections-tab-panel > .admin-scroll-table {
  display: flex;
  min-height: 0;
  flex-direction: column;
}

#collections .collections-tab-panel > .admin-scroll-table .table-wrap {
  max-height: clamp(430px, calc(100vh - 480px), 590px);
  overflow: auto;
  border: 1px solid #dce4ec;
  border-radius: 11px;
  background: #fff;
}

#collections .collections-pagination {
  min-height: 64px;
  margin-top: 14px;
}

.invoice-admin-panel .invoice-review-pagination {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) auto minmax(150px, 1fr);
  min-height: 66px;
  margin-top: 14px;
}

.invoice-admin-panel .invoice-review-pagination .dashboard-order-pages {
  justify-self: center;
}

.invoice-admin-panel .invoice-review-pagination > label {
  justify-self: end;
}

@media (max-width: 780px) {
  .invoice-admin-panel .invoice-review-pagination {
    display: flex;
  }

  .invoice-admin-panel .invoice-review-pagination .dashboard-order-pages {
    order: 3;
  }
}

#collections .collections-tab-panel .panel-note {
  margin: 0 0 12px;
}

@media (max-width: 1050px) {
  #collections .collections-workspace-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  #collections .collections-workspace-tabs {
    width: 100%;
    overflow-x: auto;
  }
  #collections .collections-workspace-tabs button {
    min-width: 138px;
    flex: 1 0 auto;
  }
}

@media (max-width: 650px) {
  #collections .collections-tab-panel {
    min-height: 500px;
    padding: 12px;
  }
  #collections .collections-tab-panel-head {
    align-items: flex-start;
    flex-direction: column;
  }
  #collections .collections-tab-panel-head small {
    text-align: left;
  }
}

@media (max-width: 520px) {
  .product-workspace-head { gap: 16px; padding: 16px 13px; }
  .product-workspace-tabs { gap: 4px; padding: 4px; }
  .product-workspace-tabs button { gap: 5px; min-height: 46px; padding: 0 6px; font-size: 12px; }
  .product-workspace-tabs button b { width: 22px; height: 22px; font-size: 10px; }
  .product-workspace-tabs button em { display: none; }
  #products .product-workspace-panel .product-create-panel > .panel-head,
  #products .product-workspace-panel .product-list-panel > .panel-head { padding: 17px 14px 14px; }
  #products .product-workspace-panel .sku-builder { padding: 11px; }
  #products .product-workspace-panel .sku-section-head h3 { font-size: 17px; }
  #products .product-workspace-panel .sku-section-head p { font-size: 12px; }
  #products .product-workspace-panel .sku-template-row button,
  #products .product-workspace-panel .sku-template-row button:last-child:nth-child(odd) { font-size: 12px; }
  #products .product-workspace-panel .sku-savebar { grid-template-columns: 1fr 1fr; }
  #products .product-workspace-panel .sku-savebar .primary { grid-column: 1 / -1; }
}

/* Customer and supply-chain workspace ------------------------------------ */
#partners .partner-workspace {
  padding: 0;
  overflow: hidden;
  border: 1px solid #dfe6ef;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(28, 39, 55, .07);
}

#partners .partner-workspace-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 24px;
  border-bottom: 1px solid #e4e9f0;
  background:
    radial-gradient(circle at 8% 0, rgba(255, 220, 55, .18), transparent 31%),
    linear-gradient(135deg, #fffdf5 0%, #fff 58%, #f8fafc 100%);
}

#partners .partner-workspace-title {
  min-width: 260px;
}

#partners .partner-workspace-title > span {
  display: block;
  margin-bottom: 4px;
  color: #9a6a00;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .11em;
}

#partners .partner-workspace-title h2 {
  margin: 0;
  color: #111d2e;
  font-size: 25px;
  line-height: 1.25;
}

#partners .partner-workspace-title p {
  margin: 6px 0 0;
  color: #64748b;
  font-size: 14px;
  line-height: 1.6;
}

#partners .partner-workspace-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(145px, 1fr));
  gap: 6px;
  min-width: min(100%, 520px);
  padding: 5px;
  border: 1px solid #dde4ec;
  border-radius: 12px;
  background: #f1f4f8;
}

#partners .partner-workspace-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #536174;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

#partners .partner-workspace-tabs button:hover {
  color: #121d2c;
  background: rgba(255, 255, 255, .72);
}

#partners .partner-workspace-tabs button:focus-visible {
  outline: 3px solid rgba(255, 211, 38, .32);
  outline-offset: 2px;
}

#partners .partner-workspace-tabs button b {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border: 1px solid #dce3eb;
  border-radius: 8px;
  background: #fff;
  color: #8390a1;
  font-size: 11px;
}

#partners .partner-workspace-tabs button.active {
  border-color: #e8c332;
  background: #fff;
  color: #111d2e;
  box-shadow: 0 7px 18px rgba(28, 39, 55, .09);
}

#partners .partner-workspace-tabs button.active b {
  border-color: #ffd524;
  background: #ffd524;
  color: #111d2e;
}

#partners .partner-workspace-body {
  min-height: 480px;
  padding: 22px 24px 26px;
  background: #fff;
}

#partners .partner-workspace-panel,
#partners .partner-workspace-panel.partner-equal-panel,
#partners .partner-workspace-panel.customer-panel,
#partners .partner-workspace-panel.member-tier-panel,
#partners .partner-workspace-panel.supplier-panel {
  display: block;
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
}

#partners .partner-workspace-panel[hidden] {
  display: none !important;
}

#partners .partner-workspace-panel > .panel-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 18px;
  padding: 0 0 15px;
  border-bottom: 1px solid #e5eaf0;
}

#partners .partner-workspace-panel > .panel-head span {
  display: block;
  margin-bottom: 3px;
  color: #a87400;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .09em;
}

#partners .partner-workspace-panel > .panel-head h2 {
  margin: 0;
  color: #111d2e;
  font-size: 21px;
  line-height: 1.3;
}

#partners .partner-workspace-panel .count-badge {
  display: inline-grid;
  min-width: 36px;
  min-height: 32px;
  place-items: center;
  border-radius: 9px;
  background: #fff4bb;
  color: #6c5000;
  font-size: 14px;
}

#partners .partner-workspace-panel .compact-form {
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid #e0e7ef;
  border-radius: 12px;
  background: #f8fafc;
}

#partners .partner-workspace-panel .compact-form input,
#partners .partner-workspace-panel .compact-form select,
#partners .partner-workspace-panel .compact-form button,
#partners .partner-workspace-panel .tier-filter,
#partners .partner-workspace-panel table,
#partners .partner-workspace-panel table th,
#partners .partner-workspace-panel table td,
#partners .partner-workspace-panel table small,
#partners .partner-workspace-panel .table-button,
#partners .partner-workspace-panel .empty-state {
  font-size: 14px;
}

#partners .partner-workspace-panel .compact-form input,
#partners .partner-workspace-panel .compact-form select,
#partners .partner-workspace-panel .compact-form button {
  min-height: 44px;
}

#partners .partner-workspace-panel .compact-form .primary {
  border-radius: 9px;
  font-weight: 800;
}

#partners .member-tier-panel .tier-help {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
  padding: 12px;
  border: 1px solid #e0e7ef;
  border-radius: 11px;
  background: #f8fafc;
}

#partners .member-tier-panel .tier-filter {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid #dbe3ec;
  border-radius: 9px;
  background: #fff;
  color: #334155;
  font-weight: 750;
}

#partners .member-tier-panel .tier-filter.active {
  border-color: #e4bd22;
  background: #fff5b8;
  color: #111d2e;
}

#partners .partner-workspace-panel .admin-scroll-table {
  min-height: 260px;
  height: auto;
  max-height: none;
  overflow: visible;
  border: 1px solid #e0e7ef;
  border-radius: 12px;
  background: #fff;
}

#partners .partner-workspace-panel .admin-scroll-table .table-wrap {
  height: auto;
  min-height: 260px;
  max-height: 520px;
  overflow: auto;
  scrollbar-gutter: stable;
}

#partners .partner-workspace-panel table th {
  padding-top: 13px;
  padding-bottom: 13px;
  color: #657387;
  font-weight: 800;
}

#partners .partner-workspace-panel table td {
  padding-top: 14px;
  padding-bottom: 14px;
  color: #172234;
}

#partners .partner-pagination {
  min-height: 62px;
  justify-content: flex-start;
  margin-top: 14px;
  padding: 10px 14px;
  border-color: #dde5ee;
  background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
  box-shadow: 0 6px 18px rgba(28, 39, 55, .045);
}

#partners .partner-pagination > span {
  flex: 0 0 auto;
  white-space: nowrap;
}

#partners .partner-pagination .dashboard-order-pages {
  flex: 0 1 auto;
}

#partners .partner-pagination > label {
  margin-left: 0;
}

#partners .partner-pagination select {
  min-width: 128px;
  font-weight: 700;
}

@media (max-width: 980px) {
  #partners .partner-workspace-head {
    align-items: flex-start;
    flex-direction: column;
  }
  #partners .partner-workspace-tabs {
    width: 100%;
    min-width: 0;
  }
  #partners .partner-workspace-panel .compact-form {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 620px) {
  #partners .partner-workspace-head,
  #partners .partner-workspace-body {
    padding: 16px;
  }
  #partners .partner-workspace-title h2 { font-size: 22px; }
  #partners .partner-workspace-tabs {
    grid-template-columns: 1fr;
  }
  #partners .partner-workspace-tabs button {
    justify-content: flex-start;
  }
  #partners .partner-workspace-panel .compact-form {
    grid-template-columns: 1fr;
  }
  #partners .partner-pagination {
    align-items: flex-start;
  }
}

/* WeChat-style multi-conversation support workbench */
#support .support-workspace-panel {
  overflow: hidden;
  border: 1px solid #dce4ed;
  border-radius: 14px;
  box-shadow: 0 18px 42px rgba(26, 38, 52, .07);
}

#support .support-workspace-head {
  min-height: 78px;
  align-items: center;
  gap: 20px;
}

#support .support-workspace-head > div:first-child {
  display: grid;
  gap: 3px;
}

#support .support-workspace-head > div:first-child p {
  margin: 0;
  color: #7f8b99;
  font-size: 11px;
}

#support .support-head-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

#support .support-live-badge,
#support .support-current-agent,
#support .support-sync-status {
  display: inline-flex;
  height: 30px;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #dfe7ef;
  border-radius: 999px;
  color: #5e6c7c;
  background: #fff;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

#support .support-live-badge {
  color: #1d7048;
  background: #eaf8f0;
  border-color: #c8ebd7;
}

#support .support-live-badge i {
  width: 7px;
  height: 7px;
  margin-right: 6px;
  border-radius: 50%;
  background: #25b866;
  box-shadow: 0 0 0 3px rgba(37, 184, 102, .13);
}

#support .support-sync-status { color: #7c6812; background: #fff9dc; border-color: #f0dd82; }

#support .support-workspace-panel > .panel-head {
  border-top: 3px solid #ffd62f;
  background: linear-gradient(100deg, #fffdf3 0%, #fff 46%, #fff 100%);
}

#support .support-workspace-panel .support-record-summary {
  gap: 10px;
  padding: 10px 16px;
  background: #f4f7fa;
}

#support .support-workspace-panel .support-record-summary article {
  min-height: 58px;
  padding: 10px 14px 10px 17px;
  box-shadow: none;
}

#support .support-workspace-panel .support-record-summary strong { font-size: 22px; }

#support .support-workbench {
  display: grid;
  grid-template-columns: 310px minmax(520px, 1fr) 286px;
  height: clamp(570px, calc(100vh - 300px), 720px);
  min-height: 570px;
  border-top: 1px solid #dce4ed;
  background: #fff;
}

#support .support-queue {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
  border-right: 1px solid #dce4ed;
  background: #f7f9fb;
}

#support .support-queue-toolbar {
  display: grid;
  gap: 9px;
  padding: 13px 12px 11px;
  border-bottom: 1px solid #dce4ed;
  background: #fff;
}

#support .support-queue-toolbar label {
  position: relative;
  display: block;
}

#support .support-queue-toolbar label > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

#support .support-ticket-search,
#support .support-ticket-filter {
  width: 100%;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #d8e1ea;
  border-radius: 9px;
  color: #182334;
  background: #f7f9fb;
  font-size: 12px;
  outline: none;
}

#support .support-ticket-search:focus,
#support .support-ticket-filter:focus {
  border-color: #e6bd16;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255, 214, 47, .16);
}

#support .support-queue-toolbar > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

#support .support-unread-filter {
  min-width: 74px;
  height: 38px;
  padding: 0 10px;
  border: 1px solid #d8e1ea;
  border-radius: 9px;
  color: #536273;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

#support .support-unread-filter b {
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  margin-left: 3px;
  place-items: center;
  border-radius: 9px;
  color: #fff;
  background: #ef5b3d;
  font-size: 10px;
}

#support .support-unread-filter.active {
  border-color: #e2b900;
  color: #171f2a;
  background: #fff4b6;
}

#support .support-ticket-list {
  min-height: 0;
  height: auto;
  max-height: none;
  padding: 8px;
  overflow: auto;
  border: 0;
  background: transparent;
  scrollbar-gutter: stable;
}

#support .support-ticket-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  width: 100%;
  margin: 0 0 7px;
  padding: 11px 10px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
}

#support .support-ticket-item:hover {
  border-color: #e1e7ee;
  background: #fff;
}

#support .support-ticket-item.active {
  border-color: #f0d776;
  background: #fffbea;
  box-shadow: inset 3px 0 0 #f2ca20;
}

#support .support-ticket-item.has-unread { background: #fff; }
#support .support-ticket-item.has-unread.active { background: #fffbea; }

#support .support-queue-avatar {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 9px;
  color: #182334;
  background: #ffe36d;
  box-shadow: inset 0 0 0 1px rgba(207, 162, 0, .18);
  font-size: 13px;
  font-weight: 900;
}

#support .support-ticket-item > section { min-width: 0; }

#support .support-ticket-item > section > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#support .support-ticket-item > section > div strong {
  overflow: hidden;
  color: #172234;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-ticket-item > section > div span {
  flex: 0 0 auto;
  max-width: none;
  color: #98a2ae;
  font-size: 9px;
}

#support .support-ticket-item > section > p {
  display: block;
  min-height: 0;
  margin: 5px 0 7px;
  overflow: hidden;
  color: #667386;
  font-size: 11px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-ticket-item > section > p i {
  color: #35a45d;
  font-style: normal;
}

#support .support-ticket-item > section > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#support .support-ticket-item > section > footer b {
  padding: 3px 6px;
  border-radius: 5px;
  color: #647387;
  background: #edf2f7;
  font-size: 9px;
}

#support .support-ticket-item > section > footer small {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  color: #8491a1;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-ticket-item.has-unread .support-queue-avatar { position: relative; }
#support .support-ticket-item.has-unread .support-queue-avatar::after {
  content: "";
  position: absolute;
  top: -3px;
  right: -3px;
  width: 9px;
  height: 9px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #f05235;
}

#support .support-queue-pagination {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 10px 12px 12px;
  border-top: 1px solid #e1e7ee;
  color: #8a96a5;
  background: #fff;
  font-size: 10px;
}

#support .support-queue-page-summary {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

#support .support-queue-page-summary span {
  color: #667386;
  font-size: 11px;
}

#support .support-queue-page-summary b {
  margin: 0 2px;
  color: #172234;
  font-size: 13px;
}

#support .support-queue-page-summary small {
  color: #9aa4af;
  white-space: nowrap;
}

#support .support-queue-page-size > span,
#support .support-queue-page-controls label > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

#support .support-queue-page-size select,
#support .support-queue-page-controls select {
  height: 32px;
  padding: 0 27px 0 9px;
  border: 1px solid #d8e1ea;
  border-radius: 7px;
  color: #334155;
  background: #fff;
  font-size: 10px;
  font-weight: 800;
  outline: none;
}

#support .support-queue-page-size select {
  width: 78px;
}

#support .support-queue-page-controls {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  gap: 7px;
  align-items: center;
}

#support .support-queue-page-controls label,
#support .support-queue-page-controls select {
  width: 100%;
}

#support .support-queue-page-controls button {
  display: grid;
  width: 34px;
  height: 32px;
  margin: 0;
  padding: 0;
  place-items: center;
  border: 1px solid #d8e1ea;
  border-radius: 7px;
  color: #273548;
  background: #f7f9fb;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

#support .support-queue-page-controls button:hover:not(:disabled) {
  border-color: #e4ba12;
  background: #fff4b6;
}

#support .support-queue-page-controls button:disabled {
  color: #c8d0d8;
  background: #f6f8fa;
}

#support .support-queue-page-size select:focus,
#support .support-queue-page-controls select:focus {
  border-color: #e6bd16;
  box-shadow: 0 0 0 3px rgba(255, 214, 47, .16);
}

#support .support-queue-empty {
  display: grid;
  min-height: 180px;
  place-content: center;
  gap: 5px;
  color: #7d8998;
  text-align: center;
}

#support .support-queue-empty b { color: #394657; font-size: 13px; }

#support .support-conversation {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  min-height: 0;
  border-right: 1px solid #dce4ed;
  background: #eef1f4;
}

#support .support-thread-tabs {
  display: flex;
  gap: 5px;
  min-width: 0;
  min-height: 44px;
  padding: 7px 9px 0;
  overflow-x: auto;
  border-bottom: 1px solid #dce4ed;
  background: #f5f7f9;
  scrollbar-width: thin;
}

#support .support-thread-capacity {
  position: sticky;
  right: 0;
  display: inline-flex;
  height: 30px;
  margin: 3px 0 0 auto;
  padding: 0 9px;
  flex: 0 0 auto;
  align-items: center;
  border: 1px solid #dce4ed;
  border-radius: 8px;
  color: #7b8795;
  background: rgba(255,255,255,.96);
  font-size: 9px;
  font-weight: 800;
  box-shadow: -8px 0 12px #f5f7f9;
}

#support .support-thread-tab {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  min-width: 112px;
  max-width: 176px;
  height: 37px;
  border: 1px solid #dce4ed;
  border-bottom: 0;
  border-radius: 9px 9px 0 0;
  background: #e9eef2;
}

#support .support-thread-tab.active {
  border-color: #d8c569;
  background: #fff;
  box-shadow: inset 0 3px 0 #ffd62f;
}

#support .support-thread-select {
  display: flex;
  min-width: 0;
  height: 100%;
  flex: 1;
  align-items: center;
  gap: 6px;
  padding: 0 5px 0 8px;
  border: 0;
  color: #4b5869;
  background: transparent;
  cursor: pointer;
}

#support .support-thread-select b {
  position: relative;
  display: grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border-radius: 6px;
  color: #172234;
  background: #ffe36d;
  font-size: 9px;
}

#support .support-thread-tab.has-unread .support-thread-select b::after {
  content: "";
  position: absolute;
  top: -2px;
  right: -2px;
  width: 6px;
  height: 6px;
  border: 1px solid #fff;
  border-radius: 50%;
  background: #ef5b3d;
}

#support .support-thread-select span {
  overflow: hidden;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-thread-close {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: #8692a0;
  background: transparent;
  cursor: pointer;
}

#support .support-thread-close:hover { color: #ef5b3d; background: #fff0ed; }

#support .support-conversation-head {
  min-height: 59px;
  padding: 10px 17px;
  background: #fff;
}

#support .support-conversation-head > div > span {
  color: #8a96a5;
  font-size: 10px;
}

#support .support-conversation-head strong { gap: 7px; font-size: 14px; }

#support .support-conversation-head .status-select {
  width: 126px;
  height: 36px;
  border-radius: 8px;
  font-size: 12px;
}

#support .support-conversation-body {
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 0;
  padding: 20px 22px;
  overflow: auto;
  background:
    linear-gradient(rgba(238, 242, 245, .94), rgba(238, 242, 245, .94)),
    repeating-linear-gradient(45deg, #e5eaee 0, #e5eaee 1px, transparent 1px, transparent 12px);
  scrollbar-gutter: stable;
}

#support .support-conversation-body::before { display: none; }

#support .support-message {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
}

#support .support-message.agent { grid-template-columns: minmax(0, 1fr) 38px; }

#support .support-message > b {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 9px;
  color: #172234;
  background: #ffe36d;
  box-shadow: none;
  font-size: 12px;
}

#support .support-message.agent > b {
  order: 2;
  color: #fff;
  background: #26364a;
  box-shadow: none;
}

#support .support-message-stack {
  display: grid;
  width: fit-content;
  max-width: min(620px, 86%);
  gap: 3px;
}

#support .support-message.agent .support-message-stack {
  justify-self: end;
  justify-items: end;
}

#support .support-message .support-message-author {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0 2px;
  color: #7c8897;
  font-size: 10px;
}

#support .support-message .support-message-author i {
  padding: 1px 5px;
  border-radius: 8px;
  color: #718095;
  background: rgba(255,255,255,.72);
  font-size: 8px;
  font-style: normal;
}

#support .support-message .support-message-bubble {
  position: relative;
  width: fit-content;
  max-width: 100%;
  padding: 10px 12px 8px;
  border: 1px solid #dce3e9;
  border-radius: 4px 11px 11px 11px;
  color: #172234;
  background: #fff;
  box-shadow: 0 5px 14px rgba(26, 38, 52, .05);
}

#support .support-message.agent .support-message-bubble {
  border-color: #7eca5f;
  border-radius: 11px 4px 11px 11px;
  color: #172234;
  background: #95ec69;
  box-shadow: 0 5px 14px rgba(61, 136, 43, .09);
}

#support .support-message-bubble span {
  display: block;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 1.58;
}

#support .support-message-bubble span a {
  color: #0866c6;
  text-decoration: underline;
  text-underline-offset: 2px;
}

#support .support-message-bubble > small {
  display: block;
  margin-top: 4px;
  color: #8a96a5;
  font-size: 9px;
  text-align: right;
}

#support .support-message.agent .support-message-bubble > small { color: #54764b; }

#support .support-compose {
  position: relative;
  z-index: 3;
  display: block;
  padding: 10px 14px 12px;
  border-top: 1px solid #dce4ed;
  background: #fff;
  box-shadow: 0 -5px 16px rgba(26, 38, 52, .035);
}

#support .support-compose-shortcuts {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  overflow-x: auto;
  scrollbar-width: thin;
}

#support .support-compose-shortcuts > span {
  flex: 0 0 auto;
  margin-right: 2px;
  color: #7b8796;
  font-size: 10px;
  font-weight: 900;
}

#support .support-compose-shortcuts button {
  flex: 0 0 auto;
  min-height: 29px;
  padding: 0 10px;
  color: #344255;
  background: #fff;
  border: 1px solid #d8e1ea;
  border-radius: 7px;
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
}

#support .support-compose-shortcuts button:hover {
  color: #172234;
  background: #fff6be;
  border-color: #e8c122;
}

#support .support-compose .support-note {
  width: 100%;
  min-height: 82px;
  max-height: 142px;
  padding: 12px 92px 37px 13px;
  border: 1px solid #cfd9e3;
  border-radius: 9px;
  color: #172234;
  background: #fff;
  font-size: 13px;
  line-height: 1.55;
}

#support .support-compose .support-note:focus {
  border-color: #e5be1b;
  box-shadow: 0 0 0 3px rgba(255, 214, 47, .16);
}

#support .support-compose-tools { left: 12px; bottom: 10px; gap: 6px; }

#support .support-compose-tools > span {
  margin-left: 3px;
  color: #9aa4af;
  font-size: 9px;
}

#support .support-tool-button { width: 25px; height: 25px; }

#support .support-tool-button:hover,
#support .support-tool-button[aria-expanded="true"],
#support .support-tool-button.is-busy {
  color: #634d00;
  background: #fff3aa;
}

#support .support-compose .support-send-button {
  position: absolute;
  right: 10px;
  bottom: 9px;
  display: flex;
  width: auto;
  min-width: 72px;
  height: 34px;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  border: 1px solid #e0b800;
  border-radius: 8px;
  color: #172234;
  background: #ffd62f;
  box-shadow: 0 6px 14px rgba(184, 143, 0, .14);
  font-family: inherit;
  font-size: 12px;
  font-weight: 900;
  text-indent: 0;
}

#support .support-compose .support-send-button i { font-size: 10px; font-style: normal; }
#support .support-compose .support-send-button:hover { color: #172234; background: #ffdf58; box-shadow: 0 8px 18px rgba(184, 143, 0, .18); }

#support .support-reply-state {
  flex: 0 0 auto;
  padding: 3px 6px;
  border-radius: 999px;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

#support .support-reply-state.waiting {
  color: #b83721;
  background: #fff0eb;
  box-shadow: inset 0 0 0 1px #ffd2c6;
}

#support .support-reply-state.replied {
  color: #2c7a54;
  background: #eaf8f1;
  box-shadow: inset 0 0 0 1px #c9ecda;
}

#support .support-tool-panel { bottom: 43px; border-radius: 10px; }

#support .support-chat-empty {
  display: grid;
  place-content: center;
  justify-items: center;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #eef1f4;
  text-align: center;
}

#support .support-chat-empty b { color: #243144; font-size: 15px; }
#support .support-chat-empty span { color: #7f8b99; font-size: 11px; }

#support .support-customer-card {
  min-height: 0;
  padding: 18px 15px;
  overflow: auto;
  background: #f8fafc;
}

#support .support-customer-card > strong { margin-bottom: 15px; font-size: 21px; }

#support .support-customer-card dl div {
  grid-template-columns: 43px minmax(0, 1fr);
  padding: 9px 10px;
  border-radius: 9px;
}

#support .support-side-status {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 10px;
  color: #7b5b00;
  background: #fff3bc;
  font-size: 10px;
}

#support .support-side-status.is-resolved,
#support .support-side-status.is-closed { color: #246849; background: #def4e8; }

#support .support-participants {
  display: grid;
  gap: 8px;
  margin-top: 13px;
  padding: 12px;
  border: 1px solid #e2e8ef;
  border-radius: 10px;
  background: #fff;
}

#support .support-participants > span { color: #7b8795; font-size: 10px; font-weight: 900; }
#support .support-participants > div { display: flex; flex-wrap: wrap; gap: 6px; }
#support .support-participants small { color: #9aa4af; font-size: 10px; }

#support .support-agent-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 7px 4px 4px;
  border-radius: 14px;
  color: #435166;
  background: #f0f4f8;
  font-size: 10px;
  font-weight: 800;
}

#support .support-agent-chip b {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #26364a;
  font-size: 8px;
}

#support .support-customer-card > p {
  display: grid;
  gap: 5px;
  max-height: 150px;
  margin-top: 12px;
  overflow: auto;
}

#support .support-customer-card > p b { color: #26364a; font-size: 10px; }

/* Final customer-service visual polish: desktop WeChat proportions and clearer hierarchy. */
#support .support-workbench {
  grid-template-columns: 324px minmax(580px, 1fr) 284px;
  height: clamp(620px, calc(100vh - 275px), 760px);
  min-height: 620px;
  background: #eef2f5;
}

#support .support-queue-toolbar {
  padding: 14px;
  background: #f8fafc;
}

#support .support-ticket-list { padding: 10px 9px; }

#support .support-ticket-item {
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 11px;
  margin-bottom: 6px;
  padding: 12px 11px;
  border-radius: 12px;
}

#support .support-ticket-item.active {
  border-color: #f0ce45;
  background: linear-gradient(100deg, #fff8d9 0%, #fffdf3 100%);
  box-shadow: inset 4px 0 0 #ffd52a, 0 7px 18px rgba(35, 49, 66, .06);
}

#support .support-queue-avatar {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  font-size: 14px;
}

#support .support-ticket-item > section > div strong { font-size: 14px; }
#support .support-ticket-item > section > p { margin: 6px 0 8px; font-size: 12px; }
#support .support-ticket-item > section > footer b,
#support .support-ticket-item > section > footer small { font-size: 10px; }

#support .support-thread-tabs {
  min-height: 49px;
  padding: 7px 10px 0;
  background: #f7f9fb;
}

#support .support-thread-tab {
  min-width: 142px;
  max-width: 205px;
  height: 42px;
  border-radius: 10px 10px 0 0;
  background: #edf1f5;
}

#support .support-thread-tab.active {
  background: #fff;
  box-shadow: inset 0 3px 0 #ffd42a;
}

#support .support-thread-select span {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 5px;
  font-size: 12px;
}

#support .support-thread-select span small {
  color: #99a4b0;
  font-size: 9px;
  font-weight: 700;
}

#support .support-conversation-head {
  min-height: 68px;
  padding: 11px 18px;
  border-bottom: 1px solid #dfe6ed;
}

#support .support-chat-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

#support .support-chat-avatar {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border-radius: 11px;
  color: #192536;
  background: #ffe16a;
  font-size: 13px;
}

#support .support-chat-title section {
  display: grid;
  min-width: 0;
  gap: 4px;
}

#support .support-chat-title section strong {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #152235;
  font-size: 15px;
}

#support .support-chat-title section > span {
  overflow: hidden;
  color: #84909e;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-conversation-head-main {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  gap: 16px;
}

#support .support-conversation-head-main .support-chat-title {
  min-width: 190px;
}

#support .support-product-thumb {
  position: relative;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  overflow: hidden;
  border: 1px solid #ead57d;
  border-radius: 9px;
  color: #9a7400;
  background: #fff9dc;
}

#support .support-product-thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

#support .support-product-thumb b {
  padding: 3px;
  font-size: 8px;
  text-align: center;
}

#support .support-product-thumb em {
  position: absolute;
  right: 2px;
  bottom: 2px;
  padding: 1px 3px;
  border-radius: 4px;
  color: #6a5000;
  background: rgba(255, 236, 139, .94);
  font-size: 6px;
  font-style: normal;
  font-weight: 900;
}

#support .support-product-thumb.is-queue {
  width: 38px;
  height: 38px;
}

#support .support-product-thumb.is-head {
  width: 43px;
  height: 43px;
  border-radius: 10px;
}

#support .support-product-thumb.is-side {
  width: 58px;
  height: 58px;
  border-radius: 11px;
}

#support .support-ticket-product {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  padding: 7px;
  border: 1px solid #e4e9ef;
  border-radius: 9px;
  background: rgba(255, 255, 255, .88);
}

#support .support-ticket-product > span,
#support .support-chat-product > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

#support .support-ticket-product > span strong,
#support .support-chat-product > span strong {
  overflow: hidden;
  color: #192536;
  font-size: 11px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-ticket-product > span small,
#support .support-chat-product > span small {
  overflow: hidden;
  color: #7d8998;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-chat-product {
  min-width: 0;
  max-width: 310px;
  display: flex;
  flex: 1;
  align-items: center;
  gap: 9px;
  padding-left: 16px;
  border-left: 1px solid #e0e6ed;
}

#support .support-chat-product > span strong {
  font-size: 12px;
}

#support .support-message-date {
  display: flex;
  justify-content: center;
  margin: 0 0 2px;
}

#support .support-message-date span {
  padding: 4px 9px;
  border-radius: 10px;
  color: #8d98a5;
  background: rgba(255,255,255,.72);
  font-size: 9px;
}

#support .support-conversation-body {
  gap: 18px;
  padding: 22px 26px 30px;
  background: #f1f3f5;
}

#support .support-message > b {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  font-size: 13px;
}

#support .support-message {
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
}

#support .support-message.agent { grid-template-columns: minmax(0, 1fr) 42px; }
#support .support-message .support-message-bubble { padding: 11px 13px 8px; }
#support .support-message-bubble span { font-size: 14px; }

#support .support-compose {
  padding: 12px 16px 14px;
  background: #fbfcfd;
}

#support .support-compose .support-note {
  min-height: 96px;
  padding: 14px 100px 39px 14px;
  border-color: #d6dee7;
  border-radius: 12px;
  font-size: 14px;
  box-shadow: inset 0 1px 2px rgba(22, 34, 51, .025);
}

#support .support-compose .support-send-button {
  right: 12px;
  bottom: 11px;
  min-width: 82px;
  height: 36px;
  border-radius: 9px;
  font-size: 13px;
}

#support .support-customer-card {
  padding: 19px 16px;
  border-left: 1px solid #e0e7ee;
  background: #fbfcfd;
}

#support .support-customer-card > strong {
  display: block;
  padding: 0 2px 14px;
  border-bottom: 1px solid #e4eaf0;
}

#support .support-customer-card dl { display: grid; gap: 7px; margin-top: 13px; }
#support .support-customer-card dl div { background: #fff; border: 1px solid #e2e8ef; }

@media (max-width: 1320px) {
  #support .support-workbench { grid-template-columns: 280px minmax(470px, 1fr) 250px; }
}

@media (max-width: 1050px) {
  #support .support-workspace-head { align-items: flex-start; flex-direction: column; }
  #support .support-head-tools { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  #support .support-workbench {
    grid-template-columns: 270px minmax(0, 1fr);
    height: auto;
    min-height: 620px;
  }
  #support .support-customer-card { display: none; }
  #support .support-conversation { border-right: 0; }
}

@media (max-width: 760px) {
  #support .support-workbench {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  #support .support-queue {
    max-height: 330px;
    border-right: 0;
    border-bottom: 1px solid #dce4ed;
  }
  #support .support-conversation { min-height: 580px; }
  #support .support-compose-tools > span { display: none; }
  #support .support-message-stack { max-width: 90%; }
}

/* Unified customer-service workspace: chat and refunds share one compact module. */
#support .support-module-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-bottom: 1px solid #dce4ed;
  background: #f4f7fa;
}

#support .support-module-tabs button {
  display: inline-flex;
  min-width: 172px;
  height: 42px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #637184;
  background: transparent;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}

#support .support-module-tabs button:hover {
  color: #172234;
  background: rgba(255, 255, 255, .72);
}

#support .support-module-tabs button.active {
  border-color: #e8c226;
  color: #172234;
  background: #fff;
  box-shadow: inset 0 -3px 0 #ffd62f, 0 6px 16px rgba(27, 39, 53, .07);
}

#support .support-module-tabs button b {
  display: grid;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  place-items: center;
  border-radius: 999px;
  color: #536273;
  background: #e8edf2;
  font-size: 11px;
}

#support .support-module-tabs button.active b {
  color: #5f4a00;
  background: #ffe267;
}

#support .support-module-tabs {
  gap: 12px;
  padding: 12px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

#support .support-module-tabs button {
  min-width: 250px;
  height: 64px;
  justify-content: flex-start;
  gap: 11px;
  padding: 8px 11px;
  text-align: left;
  background: rgba(255, 255, 255, .72);
  border-color: #dce4ed;
  border-radius: 12px;
}

#support .support-module-tabs button:hover {
  border-color: #c9d4df;
  background: #fff;
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(28, 42, 58, .07);
}

#support .support-module-tabs button.active {
  border-color: #e8bd15;
  background: linear-gradient(110deg, #fff9d8 0%, #fff 62%);
  box-shadow: inset 4px 0 0 #ffd329, 0 9px 20px rgba(37, 48, 63, .08);
}

#support .support-tab-icon {
  display: grid;
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  place-items: center;
  color: #172234;
  background: #ffe16a;
  border: 1px solid #f1c91f;
  border-radius: 11px;
  font-size: 13px;
  font-style: normal;
  font-weight: 950;
}

#support .support-module-tabs button.active .support-tab-icon {
  color: #fff;
  background: #172234;
  border-color: #172234;
}

#support .support-tab-copy {
  display: grid;
  min-width: 0;
  flex: 1;
  gap: 3px;
}

#support .support-tab-copy strong {
  color: #172234;
  font-size: 14px;
  line-height: 1.2;
}

#support .support-tab-copy small {
  overflow: hidden;
  color: #8290a1;
  font-size: 10px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-tab-stats {
  display: grid;
  flex: 0 0 auto;
  justify-items: end;
  gap: 4px;
  font-style: normal;
}

#support .support-module-tabs .support-tab-stats > b {
  display: grid;
  min-width: 27px;
  height: 25px;
  padding: 0 8px;
  place-items: center;
  color: #172234;
  background: #edf2f7;
  border-radius: 999px;
  font-size: 11px;
}

#support .support-module-tabs button.active .support-tab-stats > b {
  color: #5f4a00;
  background: #ffe267;
}

#support .support-tab-stats > small {
  color: #e25032;
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
}

#support .support-module-panel {
  min-width: 0;
  background: #fff;
}

#support .support-module-panel.hidden {
  display: none !important;
}

#support .support-refund-head {
  display: flex;
  min-height: 90px;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid #e2e8ef;
  background: linear-gradient(105deg, #fffdf2 0%, #fff 38%, #fff 100%);
}

#support .support-refund-head > div {
  display: grid;
  gap: 3px;
}

#support .support-refund-head span {
  color: #a77b00;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

#support .support-refund-head h3 {
  margin: 0;
  color: #152235;
  font-size: 20px;
}

#support .support-refund-head p {
  margin: 0;
  color: #7e8998;
  font-size: 11px;
}

#support [data-support-module-panel="refund"] {
  min-height: clamp(570px, calc(100vh - 300px), 720px);
  padding-bottom: 18px;
  background: #f8fafc;
}

#support [data-support-module-panel="refund"] .refund-review-scroll {
  width: auto;
  max-width: none;
  max-height: clamp(450px, calc(100vh - 430px), 590px);
  margin: 16px;
  border: 1px solid #dce4ed;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(26, 38, 52, .04);
}

#support [data-support-module-panel="refund"] .refund-review-scroll .table-wrap {
  border: 0;
  border-radius: 11px;
}

@media (max-width: 760px) {
  #support .support-module-tabs {
    overflow-x: auto;
  }
  #support .support-module-tabs button {
    min-width: 145px;
  }
  #support [data-support-module-panel="refund"] {
    min-height: 520px;
  }
}

/* Customer profile sidebar */
#support .support-customer-card {
  padding: 14px;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 218, 53, .13), transparent 180px),
    #f8fafc;
}

#support .support-customer-profile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid #eadb99;
  border-radius: 14px;
  background: linear-gradient(135deg, #fff9dc 0%, #fff 74%);
  box-shadow: 0 8px 20px rgba(35, 48, 64, .055);
}

#support .support-customer-avatar {
  position: relative;
  display: grid;
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 16px;
  color: #172234;
  background: linear-gradient(145deg, #ffe775, #ffd52a);
  box-shadow: 0 7px 16px rgba(192, 147, 0, .18);
}

#support .support-customer-avatar b {
  font-size: 19px;
  font-weight: 950;
}

#support .support-customer-avatar i {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 13px;
  height: 13px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #2dbc72;
}

#support .support-customer-profile > section {
  display: grid;
  min-width: 0;
  gap: 2px;
}

#support .support-customer-profile > section > span {
  color: #8b7b39;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

#support .support-customer-profile > section > strong {
  overflow: hidden;
  color: #172234;
  font-size: 20px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-customer-profile > section > small {
  color: #8a95a3;
  font-size: 10px;
}

#support .support-customer-badges {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
  padding: 0 2px;
}

#support .support-customer-badges .tier-badge,
#support .support-customer-badges .support-guest-badge,
#support .support-customer-badges .support-side-status {
  display: inline-flex;
  min-height: 25px;
  align-items: center;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
}

#support .support-guest-badge {
  color: #526173;
  background: #edf2f6;
}

#support .support-customer-details {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
}

#support .support-customer-details div {
  position: relative;
  display: grid;
  grid-template-columns: 1fr !important;
  gap: 4px !important;
  min-width: 0;
  padding: 11px 12px 11px 39px !important;
  border: 1px solid #e1e8ef !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 4px 12px rgba(31, 44, 59, .025);
}

#support .support-customer-details div::before {
  position: absolute;
  top: 14px;
  left: 12px;
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border-radius: 6px;
  color: #26364a;
  background: #fff1a8;
  font-size: 10px;
  font-weight: 900;
}

#support .support-customer-details .contact::before { content: "☎"; }
#support .support-customer-details .order::before { content: "单"; }
#support .support-customer-details .topic::before { content: "问"; }

#support .support-customer-details dt {
  color: #8994a2;
  font-size: 9px;
  font-weight: 800;
}

#support .support-customer-details dd {
  min-width: 0;
  overflow: hidden;
  margin: 0;
  color: #26364a;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-linked-product-card {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #e7d47e;
  border-radius: 12px;
  background: linear-gradient(145deg, #fffbea, #fff);
  box-shadow: 0 6px 16px rgba(100, 76, 0, .045);
}

#support .support-linked-product-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#support .support-linked-product-card > header span {
  color: #715500;
  font-size: 10px;
  font-weight: 900;
}

#support .support-linked-product-card > header small {
  padding: 3px 7px;
  border-radius: 999px;
  color: #785a00;
  background: #ffed9b;
  font-size: 8px;
  font-weight: 900;
}

#support .support-linked-product-card > article {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

#support .support-linked-product-card > article > div {
  display: grid;
  min-width: 0;
  gap: 4px;
}

#support .support-linked-product-card > article strong {
  overflow: hidden;
  color: #172234;
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-linked-product-card > article span {
  overflow: hidden;
  color: #6f7d8f;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-linked-product-card > article small {
  width: fit-content;
  padding: 2px 5px;
  border-radius: 5px;
  color: #8a6900;
  background: #fff2b3;
  font-size: 8px;
}

#support .support-linked-product-card.is-empty {
  gap: 4px;
  border-style: dashed;
  border-color: #dfe6ed;
  color: #83909f;
  background: #f8fafc;
}

#support .support-linked-product-card.is-empty b {
  color: #526174;
  font-size: 11px;
}

#support .support-linked-product-card.is-empty span {
  font-size: 9px;
  line-height: 1.5;
}

#support .support-participants,
#support .support-customer-request {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #e1e8ef;
  border-radius: 12px;
  background: rgba(255, 255, 255, .94);
}

#support .support-participants > header,
#support .support-customer-request > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#support .support-participants > header > span,
#support .support-customer-request > header > span {
  color: #26364a;
  font-size: 11px;
  font-weight: 900;
}

#support .support-participants > header > b {
  display: grid;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  place-items: center;
  border-radius: 8px;
  color: #5f4a00;
  background: #ffe678;
  font-size: 10px;
}

#support .support-participants > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

#support .support-customer-request > header > small {
  color: #9aa4af;
  font-size: 9px;
}

#support .support-customer-request p {
  max-height: 116px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  border: 0;
  border-radius: 9px;
  color: #445267;
  background: #f5f7fa;
  font-size: 11px;
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Non-stock custom quote support queue */
#support .support-custom-quote-guide {
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 12px 18px;
  border-bottom: 1px solid #eadb91;
  background: linear-gradient(100deg, #fff9d8 0%, #fffdf3 42%, #fff 100%);
}

#support .support-custom-quote-guide > div {
  display: grid;
  gap: 2px;
}

#support .support-custom-quote-guide > div span {
  color: #a67900;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
}

#support .support-custom-quote-guide > div b {
  color: #192435;
  font-size: 15px;
}

#support .support-custom-quote-guide > div small {
  color: #778392;
  font-size: 10px;
}

#support .support-custom-quote-guide ol {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

#support .support-custom-quote-guide li {
  display: inline-flex;
  height: 34px;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid #eadf9f;
  border-radius: 9px;
  color: #4c5665;
  background: rgba(255, 255, 255, .82);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

#support .support-custom-quote-guide li b {
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  border-radius: 7px;
  color: #5a4500;
  background: #ffe05a;
  font-size: 9px;
}

#support .support-custom-quote-guide + .support-workbench {
  height: clamp(545px, calc(100vh - 350px), 680px);
  min-height: 545px;
}

#support .support-quote-queue-product {
  display: block;
  margin-top: 6px;
  overflow: hidden;
  color: #9a7200;
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-quote-card {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #ead786;
  border-radius: 12px;
  background: linear-gradient(145deg, #fffdf2, #fff);
  box-shadow: 0 7px 18px rgba(125, 94, 0, .055);
}

#support .support-quote-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

#support .support-quote-card > header > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

#support .support-quote-card > header span {
  color: #a17600;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

#support .support-quote-card > header b {
  overflow: hidden;
  color: #1c2737;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-quote-card .manual-quote-status {
  flex: 0 0 auto;
  padding: 4px 7px;
  font-size: 9px;
  font-style: normal;
}

#support .support-quote-product {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 9px;
  border-radius: 10px;
  background: #f4f6f8;
}

#support .support-quote-product > img,
#support .support-quote-product > b {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  object-fit: cover;
  border: 1px solid #e1e6eb;
  border-radius: 9px;
  color: #403200;
  background: #ffe26a;
  font-size: 15px;
}

#support .support-quote-product > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

#support .support-quote-product strong,
#support .support-quote-product span,
#support .support-quote-product small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-quote-product strong { color: #1d2939; font-size: 11px; }
#support .support-quote-product span { color: #657285; font-size: 9px; }
#support .support-quote-product small { color: #8a7580; font-size: 9px; }

#support .support-quote-specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
}

#support .support-quote-specs div {
  display: grid;
  min-width: 0;
  gap: 2px;
  padding: 7px 8px;
  border: 1px solid #e5e9ee;
  border-radius: 8px;
  background: #fff;
}

#support .support-quote-specs dt { color: #929ca8; font-size: 8px; }
#support .support-quote-specs dd {
  overflow: hidden;
  margin: 0;
  color: #2d394a;
  font-size: 10px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-quote-card > p {
  display: grid;
  gap: 3px;
  max-height: 66px;
  margin: 0;
  padding: 8px;
  overflow: auto;
  border-radius: 8px;
  color: #5f6c7d;
  background: #f5f7f9;
  font-size: 9px;
  line-height: 1.5;
}

#support .support-quote-card > p b { color: #313d4e; font-size: 9px; }

#support .support-inline-quote {
  overflow: hidden;
  border: 1px solid #e3c33e;
  border-radius: 10px;
  background: #fff;
}

#support .support-inline-quote > summary {
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 10px;
  color: #2a3442;
  background: #fff8d9;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

#support .support-inline-quote > summary::-webkit-details-marker { display: none; }

#support .support-inline-quote > summary::after {
  content: "⌄";
  color: #8a6c00;
  font-size: 12px;
}

#support .support-inline-quote[open] > summary::after { content: "⌃"; }

#support .support-inline-quote > summary span {
  color: #2a3442;
  font-size: 10px;
  letter-spacing: 0;
}

#support .support-inline-quote > summary b {
  margin-left: auto;
  color: #8c6c00;
  font-size: 9px;
}

#support .support-inline-quote-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 10px;
  border-top: 1px solid #eee2aa;
}

#support .support-inline-quote-form .wide {
  grid-column: 1 / -1;
}

#support .support-inline-quote-form label {
  display: grid;
  min-width: 0;
  gap: 4px;
  color: #687586;
  font-size: 8px;
  font-weight: 800;
}

#support .support-inline-quote-form input,
#support .support-inline-quote-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #dce3ea;
  border-radius: 7px;
  color: #1d2939;
  background: #f8fafc;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  outline: none;
}

#support .support-inline-quote-form input {
  height: 32px;
  padding: 0 8px;
}

#support .support-inline-quote-form textarea {
  min-height: 50px;
  padding: 7px 8px;
  resize: vertical;
  line-height: 1.5;
}

#support .support-inline-quote-form input:focus,
#support .support-inline-quote-form textarea:focus {
  border-color: #d9ae00;
  background: #fff;
  box-shadow: 0 0 0 2px rgba(255, 214, 47, .16);
}

#support .support-inline-quote-total {
  display: flex;
  grid-column: 1 / -1;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 9px;
  border-radius: 8px;
  color: #685000;
  background: #fff5bd;
}

#support .support-inline-quote-total span {
  color: #685000;
  font-size: 9px;
  letter-spacing: 0;
}

#support .support-inline-quote-total b {
  color: #e33b20;
  font-size: 14px;
}

#support .support-inline-quote-form > small {
  color: #8a94a1;
  font-size: 8px;
  line-height: 1.5;
}

#support .support-publish-quote {
  height: 36px;
  border: 1px solid #d6a900;
  border-radius: 8px;
  color: #172234;
  background: #ffdb42;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

#support .support-publish-quote:hover { background: #ffd223; }
#support .support-publish-quote:disabled { cursor: wait; opacity: .65; }

#support .support-open-quote {
  display: flex;
  width: 100%;
  height: 34px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid #d8ae00;
  border-radius: 9px;
  color: #172234;
  background: #ffdd4d;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

#support .support-open-quote:hover { background: #ffd52a; }
#support .support-open-quote span { color: inherit; font-size: 13px; letter-spacing: 0; }

#support .support-quote-forwarded {
  padding: 8px;
  border-radius: 8px;
  color: #75600c;
  background: #fff5c3;
  font-size: 9px;
  font-weight: 800;
  text-align: center;
}

#support .support-custom-empty {
  display: grid;
  min-height: 420px;
  place-content: center;
  justify-items: center;
  gap: 7px;
  padding: 24px;
  color: #7f8995;
  background: linear-gradient(145deg, #fffdf3, #f7f9fb);
  text-align: center;
}

#support .support-custom-empty b { color: #263345; font-size: 17px; }
#support .support-custom-empty span { max-width: 460px; font-size: 11px; line-height: 1.7; }

/* Larger custom-quote workspace: clearer chat, wider pricing panel and stronger actions. */
#support .support-workspace-panel .support-record-summary article {
  min-height: 70px;
  padding: 13px 18px 13px 21px;
  border-radius: 10px;
}

#support .support-workspace-panel .support-record-summary span {
  font-size: 11px;
}

#support .support-workspace-panel .support-record-summary strong {
  font-size: 27px;
  line-height: 1.1;
}

#support .support-custom-quote-guide {
  min-height: 92px;
  padding: 16px 22px;
}

#support .support-custom-quote-guide > div {
  gap: 4px;
}

#support .support-custom-quote-guide > div span {
  font-size: 10px;
}

#support .support-custom-quote-guide > div b {
  font-size: 18px;
}

#support .support-custom-quote-guide > div small {
  font-size: 11px;
  line-height: 1.55;
}

#support .support-custom-quote-guide li {
  height: 40px;
  padding: 0 12px;
  border-radius: 11px;
  font-size: 11px;
}

#support .support-custom-quote-guide li b {
  width: 24px;
  height: 24px;
  font-size: 10px;
}

#support .support-custom-quote-guide + .support-workbench {
  grid-template-columns: minmax(300px, 23%) minmax(540px, 1fr) minmax(360px, 27%);
  height: clamp(700px, calc(100vh - 225px), 880px);
  min-height: 700px;
}

#support .support-custom-quote-guide + .support-workbench .support-queue-toolbar {
  gap: 11px;
  padding: 16px 15px 13px;
}

#support .support-custom-quote-guide + .support-workbench :is(.support-ticket-search, .support-ticket-filter, .support-unread-filter) {
  height: 44px;
  font-size: 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-ticket-item {
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 8px;
  padding: 14px 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-queue-avatar {
  width: 44px;
  height: 44px;
  font-size: 15px;
}

#support .support-custom-quote-guide + .support-workbench .support-ticket-item > section > div strong {
  font-size: 15px;
}

#support .support-custom-quote-guide + .support-workbench .support-ticket-item > section > p {
  font-size: 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-thread-tabs {
  min-height: 54px;
}

#support .support-custom-quote-guide + .support-workbench .support-thread-tab {
  min-width: 152px;
  height: 47px;
}

#support .support-custom-quote-guide + .support-workbench .support-conversation-head {
  min-height: 76px;
  padding: 13px 20px;
}

#support .support-custom-quote-guide + .support-workbench .support-conversation-body {
  gap: 20px;
  padding: 26px 30px 34px;
}

#support .support-custom-quote-guide + .support-workbench .support-message-stack {
  max-width: min(720px, 90%);
}

#support .support-custom-quote-guide + .support-workbench .support-message .support-message-bubble {
  padding: 13px 15px 10px;
  border-radius: 5px 13px 13px 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-message.agent .support-message-bubble {
  border-radius: 13px 5px 13px 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-message-bubble span {
  font-size: 15px;
  line-height: 1.65;
}

#support .support-custom-quote-guide + .support-workbench .support-compose {
  padding: 15px 18px 17px;
}

#support .support-custom-quote-guide + .support-workbench .support-compose .support-note {
  min-height: 112px;
  max-height: 190px;
  padding: 16px 112px 43px 16px;
  font-size: 15px;
}

#support .support-custom-quote-guide + .support-workbench .support-compose .support-send-button {
  right: 15px;
  bottom: 14px;
  min-width: 90px;
  height: 40px;
  font-size: 14px;
}

#support .support-custom-quote-guide + .support-workbench .support-customer-card {
  padding: 18px;
}

#support .support-custom-quote-guide + .support-workbench .support-customer-profile {
  padding: 16px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-card {
  gap: 14px;
  margin-top: 14px;
  padding: 16px;
  border-radius: 14px;
  box-shadow: 0 10px 26px rgba(125, 94, 0, .08);
}

#support .support-custom-quote-guide + .support-workbench .support-quote-card > header span {
  font-size: 10px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-card > header b {
  font-size: 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-product {
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 12px;
  padding: 11px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-product > img,
#support .support-custom-quote-guide + .support-workbench .support-quote-product > b {
  width: 58px;
  height: 58px;
  border-radius: 11px;
  font-size: 18px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-product strong {
  font-size: 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-product span,
#support .support-custom-quote-guide + .support-workbench .support-quote-product small {
  font-size: 10px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-specs {
  gap: 8px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-specs div {
  gap: 4px;
  padding: 10px;
  border-radius: 9px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-specs dt {
  font-size: 9px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-specs dd {
  font-size: 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-quote-card > p {
  max-height: 100px;
  padding: 10px;
  font-size: 11px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote {
  border-radius: 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote > summary {
  min-height: 46px;
  padding: 0 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote > summary span {
  font-size: 13px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote > summary b {
  font-size: 10px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-form {
  gap: 10px;
  padding: 14px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-form label {
  gap: 6px;
  font-size: 10px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-form input {
  height: 42px;
  padding: 0 10px;
  font-size: 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-form textarea {
  min-height: 78px;
  padding: 10px;
  font-size: 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-total {
  min-height: 50px;
  padding: 10px 12px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-total span {
  font-size: 11px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-total b {
  font-size: 20px;
}

#support .support-custom-quote-guide + .support-workbench .support-inline-quote-form > small {
  font-size: 9px;
  line-height: 1.65;
}

#support .support-custom-quote-guide + .support-workbench .support-publish-quote {
  height: 46px;
  border-radius: 10px;
  font-size: 13px;
  box-shadow: 0 7px 16px rgba(184, 143, 0, .14);
}

#support .support-custom-quote-guide + .support-workbench .support-open-quote {
  height: 44px;
  border-radius: 10px;
  font-size: 12px;
}

#support .support-ticket-item.needs-requote {
  border-color: #ff8a4c;
  background: linear-gradient(100deg, #fff3e9 0%, #fffdf7 100%);
  box-shadow: inset 4px 0 0 #ff6b2c, 0 8px 20px rgba(217, 79, 18, .08);
}

#support .support-requote-badge {
  display: inline-flex;
  width: max-content;
  margin-top: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #b8390b;
  background: #ffe0cf;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

#support .support-requote-alert {
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  border: 1px solid #ffb089;
  border-left: 4px solid #ff5a1f;
  border-radius: 10px;
  color: #8f2f0c;
  background: linear-gradient(100deg, #fff0e7, #fffaf4);
}

#support .support-requote-alert b {
  font-size: 12px;
}

#support .support-requote-alert span {
  color: #7e4932;
  font-size: 11px;
  line-height: 1.55;
}

@media (max-width: 1500px) {
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: 280px minmax(440px, 1fr) 350px;
  }
}

@media (max-width: 1180px) {
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: 240px minmax(360px, 1fr) 320px;
  }
}

@media (max-width: 1050px) {
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: 260px minmax(0, 1fr);
    height: auto;
  }

  #support .support-custom-quote-guide + .support-workbench .support-customer-card {
    display: block;
    grid-column: 1 / -1;
    max-height: none;
    border-top: 1px solid #e0e7ee;
  }
}

@media (max-width: 760px) {
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: 1fr;
  }

  #support .support-custom-quote-guide + .support-workbench .support-customer-card {
    grid-column: 1;
  }
}

@media (max-width: 1120px) {
  #support .support-custom-quote-guide {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
  #support .support-custom-quote-guide ol {
    width: 100%;
    overflow-x: auto;
  }
}

/* Shipping and collection are separate operational workspaces. */
.fulfillment-view-head {
  display: flex;
  min-height: 104px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 16px;
  padding: 20px 24px;
  border: 1px solid #e0e6ed;
  border-top: 3px solid #ffd52a;
  border-radius: 13px;
  background: linear-gradient(105deg, #fff9db 0%, #fff 42%, #f8fbfd 100%);
  box-shadow: 0 12px 28px rgba(28, 40, 54, .05);
}

.fulfillment-view-head > div {
  display: grid;
  gap: 3px;
}

.fulfillment-view-head span {
  color: #a27500;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

.fulfillment-view-head h2 {
  margin: 0;
  color: #142135;
  font-size: 24px;
}

.fulfillment-view-head p {
  margin: 0;
  color: #718095;
  font-size: 12px;
}

.fulfillment-view-head > b {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 0 13px;
  border: 1px solid #efd35e;
  border-radius: 999px;
  color: #6b5200;
  background: #fff7cf;
  font-size: 11px;
  white-space: nowrap;
}

.fulfillment-view-head.is-collections {
  background: linear-gradient(105deg, #fffdf1 0%, #fff 42%, #f5f9ff 100%);
}

#shipping .shipping-workspace-panel,
#collections .receivable-panel,
#collections .collections-review-grid > .panel {
  border-color: #dce4ec;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(27, 39, 53, .045);
}

#shipping .shipping-workspace-panel {
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  box-shadow: 0 16px 34px rgba(27, 39, 53, .07);
}

#shipping .shipping-workspace-heading {
  display: flex;
  min-height: 104px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 18px 22px;
  border-bottom: 1px solid #dfe6ed;
  background: linear-gradient(105deg, #fff8d5 0%, #fffdf4 25%, #fff 58%, #f5f8fc 100%);
}

#shipping .shipping-workspace-title {
  display: grid;
  gap: 3px;
}

#shipping .shipping-workspace-title > span,
#shipping .shipping-tab-panel-head span,
#shipping .shipping-record-head span {
  color: #9a6d00;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

#shipping .shipping-workspace-title h2 {
  margin: 0;
  color: #142135;
  font-size: 24px;
}

#shipping .shipping-workspace-title p {
  margin: 0;
  color: #718095;
  font-size: 12px;
}

#shipping .shipping-workspace-tabs {
  display: flex;
  gap: 7px;
  padding: 5px;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  background: #eef2f6;
}

#shipping .shipping-workspace-tabs button {
  display: inline-flex;
  min-width: 178px;
  height: 46px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 15px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #59687a;
  background: transparent;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  transition: .18s ease;
}

#shipping .shipping-workspace-tabs button:hover {
  color: #162235;
  background: rgba(255, 255, 255, .8);
}

#shipping .shipping-workspace-tabs button.active {
  border-color: #e4bd16;
  color: #172234;
  background: #fff;
  box-shadow: inset 0 -3px 0 #ffd52a, 0 7px 16px rgba(28, 40, 54, .08);
}

#shipping .shipping-workspace-tabs button b {
  display: grid;
  min-width: 25px;
  height: 25px;
  padding: 0 6px;
  place-items: center;
  border-radius: 8px;
  color: #617185;
  background: #fff;
  font-size: 10px;
}

#shipping .shipping-workspace-tabs button.active b {
  color: #654d00;
  background: #ffe46b;
}

#shipping .shipping-tab-panel {
  min-height: clamp(560px, calc(100vh - 270px), 720px);
  padding: 20px;
  background: #f8fafc;
}

#shipping .shipping-tab-panel[hidden],
#shipping .shipping-tab-panel.hidden {
  display: none !important;
}

#shipping .shipping-tab-panel-head,
#shipping .shipping-record-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 13px;
  padding: 0 2px 12px;
  border-bottom: 1px solid #e1e7ee;
}

#shipping .shipping-tab-panel-head > div,
#shipping .shipping-record-head > div {
  display: grid;
  gap: 2px;
}

#shipping .shipping-tab-panel-head h3,
#shipping .shipping-record-head h3 {
  margin: 0;
  color: #172234;
  font-size: 19px;
}

#shipping .shipping-tab-panel-head small,
#shipping .shipping-record-head small {
  color: #7b8899;
  font-size: 11px;
  text-align: right;
}

#shipping .shipping-entry-form {
  display: grid;
  grid-template-columns: minmax(260px, 1.8fr) minmax(170px, .9fr) minmax(220px, 1.2fr) minmax(110px, .55fr) minmax(150px, .75fr);
  align-items: end;
  gap: 12px;
  margin-bottom: 22px;
  padding: 16px;
  border: 1px solid #e5d593;
  border-radius: 12px;
  background: linear-gradient(105deg, #fffcef 0%, #fff 52%, #f7faff 100%);
  box-shadow: 0 9px 22px rgba(28, 40, 54, .04);
}

#shipping .shipping-entry-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: #3b495d;
  font-size: 11px;
  font-weight: 800;
}

#shipping .shipping-entry-form input,
#shipping .shipping-entry-form select,
#shipping .shipping-entry-form button {
  width: 100%;
  min-height: 44px;
  margin: 0;
  border-radius: 9px;
}

#shipping .shipping-entry-form button {
  border-color: #dfb600;
  color: #151e2b;
  background: #ffd92f;
  box-shadow: 0 7px 16px rgba(230, 180, 0, .18);
  font-weight: 900;
}

#shipping .shipping-entry-form button:hover:not(:disabled) {
  background: #ffcf16;
  transform: translateY(-1px);
}

#shipping .shipping-record-head {
  margin-top: 2px;
}

#shipping .shipping-record-head > div:first-child small {
  display: block;
  margin-top: 3px;
  text-align: left;
}

#shipping .shipping-record-head > .shipping-record-tools {
  display: flex;
  align-items: end;
  gap: 6px;
  flex-wrap: nowrap;
}

#shipping .shipping-record-head > .shipping-record-tools label {
  display: grid;
  flex: 1 1 190px;
  gap: 5px;
  color: #637187;
  font-size: 10px;
  font-weight: 800;
}

#shipping .shipping-record-tools label > span {
  color: #637187;
  letter-spacing: 0;
}

#shipping .shipping-record-tools input {
  width: min(210px, 25vw);
  min-width: 170px;
  height: 32px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid #d7e0e9;
  border-radius: 8px;
  background: #fff;
}

#shipping .shipping-record-tools input:focus {
  border-color: #e5b800;
  box-shadow: 0 0 0 3px rgba(255, 213, 42, .16);
  outline: 0;
}

#shipping .shipping-record-tools button {
  flex: 0 0 auto;
  min-width: 52px;
  height: 30px;
  margin: 0;
  padding: 0 9px;
  border: 1px solid #d7e0e9;
  border-radius: 8px;
  color: #344154;
  background: #fff;
  font-size: 10px;
  font-weight: 800;
}

#shipping .shipping-record-tools button:hover {
  border-color: #e4bd16;
  background: #fff8d5;
}

#shipping .shipping-record-tools .shipping-search-submit {
  border-color: #172234;
  color: #fff;
  background: #172234;
}

#shipping .shipping-record-tools .shipping-search-submit:hover {
  border-color: #24354d;
  color: #fff;
  background: #24354d;
}

#shipping .shipping-tab-panel > .admin-scroll-table .table-wrap {
  max-height: clamp(340px, calc(100vh - 520px), 500px);
  overflow: auto;
  border: 1px solid #dce4ec;
  border-radius: 11px;
  background: #fff;
}

#shipping [data-shipping-panel="inventory"] > .admin-scroll-table .table-wrap {
  max-height: clamp(470px, calc(100vh - 405px), 620px);
}

#shipping .shipping-tab-panel .empty-state {
  min-height: 260px;
  border: 1px dashed #d7e0e9;
  border-radius: 10px;
  background: linear-gradient(145deg, #fbfcfe, #f4f7fa);
}

#collections .receivable-panel {
  margin-bottom: 16px;
}

#collections .receivable-panel .receivable-scroll .table-wrap {
  max-height: clamp(310px, calc(100vh - 470px), 460px);
  overflow: auto;
}

#collections .collections-review-grid {
  align-items: stretch;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#collections .collections-review-grid > .panel {
  display: flex;
  min-height: 480px;
  flex-direction: column;
}

#collections .collections-review-grid .admin-scroll-table {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
}

#collections .collections-review-grid .admin-scroll-table .table-wrap {
  max-height: 420px;
  flex: 1;
  overflow: auto;
}

@media (max-width: 1180px) {
  #collections .collections-review-grid {
    grid-template-columns: 1fr;
  }
  #shipping .shipping-entry-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #shipping .shipping-entry-form .shipping-order-field,
  #shipping .shipping-entry-form button {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .fulfillment-view-head {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px;
  }
  #shipping .shipping-workspace-heading {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px;
  }
  #shipping .shipping-workspace-tabs {
    width: 100%;
    overflow-x: auto;
  }
  #shipping .shipping-workspace-tabs button {
    min-width: 160px;
    flex: 1 0 auto;
  }
  #shipping .shipping-tab-panel {
    min-height: 500px;
    padding: 12px;
  }
  #shipping .shipping-entry-form {
    grid-template-columns: 1fr;
  }
  #shipping .shipping-entry-form .shipping-order-field,
  #shipping .shipping-entry-form button {
    grid-column: auto;
  }
  #shipping .shipping-tab-panel-head,
  #shipping .shipping-record-head {
    align-items: flex-start;
    flex-direction: column;
  }
  #shipping .shipping-record-head > .shipping-record-tools {
    width: 100%;
    flex-direction: row;
    align-items: end;
  }
  #shipping .shipping-record-head > .shipping-record-tools label {
    flex: 1;
  }
  #shipping .shipping-record-tools input {
    width: 100%;
    min-width: 0;
  }
}

/* Manual quote workbench polish */
#quoteRequests {
  --mq-yellow: #ffd72e;
  --mq-yellow-deep: #e5b900;
  --mq-ink: #142033;
  --mq-muted: #6f7c8d;
  --mq-line: #e1e7ee;
  gap: 12px;
}

#quoteRequests .manual-quote-hero {
  min-height: 108px;
  padding: 22px 26px;
  border-color: #f1d771;
  border-radius: 18px;
  background:
    radial-gradient(circle at 92% 0%, rgba(255, 215, 46, .32), transparent 34%),
    linear-gradient(120deg, #fffdf5 0%, #fff 54%, #fff8d2 100%);
  box-shadow: 0 16px 38px rgba(27, 39, 56, .07);
}

#quoteRequests .manual-quote-hero::before {
  width: 6px;
  border-radius: 18px 0 0 18px;
}

#quoteRequests .manual-quote-hero::after {
  content: "";
  position: absolute;
  right: 31%;
  bottom: -90px;
  width: 220px;
  height: 220px;
  border: 42px solid rgba(255, 215, 46, .09);
  border-radius: 50%;
  pointer-events: none;
}

#quoteRequests .manual-quote-hero > div:first-child {
  max-width: 680px;
}

#quoteRequests .manual-quote-hero h2 {
  margin: 4px 0 5px;
  color: var(--mq-ink);
  font-size: 28px;
  line-height: 1.15;
}

#quoteRequests .manual-quote-hero p {
  color: var(--mq-muted);
  font-size: 13px;
}

#quoteRequests .manual-quote-hero-steps {
  min-width: 440px;
  gap: 8px;
}

#quoteRequests .manual-quote-hero-steps b {
  min-height: 52px;
  padding: 8px 12px;
  border-color: rgba(225, 183, 8, .44);
  border-radius: 12px;
  color: #28374a;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 7px 18px rgba(34, 45, 61, .05);
}

#quoteRequests .manual-quote-hero-steps i {
  border-radius: 9px;
  box-shadow: inset 0 -1px 0 rgba(116, 84, 0, .18);
}

#quoteRequests .manual-quote-toolbar {
  padding: 13px 16px;
  align-items: center;
  border-color: var(--mq-line);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(28, 41, 58, .045);
}

#quoteRequests .manual-quote-toolbar-title {
  min-width: 230px;
}

#quoteRequests .manual-quote-toolbar-title h2 {
  color: var(--mq-ink);
  font-size: 20px;
}

#quoteRequests .manual-quote-toolbar-title .count-badge {
  min-width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #805d00;
  background: #fff3b4;
}

#quoteRequests .manual-quote-filters label > span {
  color: #738094;
  font-weight: 700;
}

#quoteRequests .manual-quote-filters :is(select, input) {
  border-color: #d9e1ea;
  border-radius: 9px;
  background-color: #fff;
}

#quoteRequests .manual-quote-filters :is(select, input):focus {
  border-color: #e1b707;
  box-shadow: 0 0 0 3px rgba(255, 215, 46, .18);
}

#quoteRequests #refreshQuoteRequests {
  padding-inline: 17px;
  border-radius: 9px;
  color: #fff;
  border-color: var(--mq-ink);
  background: var(--mq-ink);
}

#quoteRequests #refreshQuoteRequests:hover {
  transform: translateY(-1px);
  background: #26354a;
}

#quoteRequests .manual-quote-workspace {
  grid-template-columns: minmax(310px, 350px) minmax(0, 1fr);
  gap: 16px;
}

#quoteRequests .manual-quote-queue-panel,
#quoteRequests .manual-quote-detail-panel {
  border-color: var(--mq-line);
  border-radius: 16px;
  box-shadow: 0 14px 34px rgba(28, 40, 57, .065);
}

#quoteRequests .manual-quote-section-head {
  padding: 16px 17px 13px;
  background: linear-gradient(180deg, #fff, #fbfcfe);
}

#quoteRequests .manual-quote-section-head span {
  font-size: 15px;
}

#quoteRequests .manual-quote-section-head strong {
  padding: 5px 8px;
  border-radius: 999px;
  background: #f1f4f7;
  font-size: 10px;
}

#quoteRequests .manual-quote-queue {
  min-height: 460px;
  padding: 10px;
  background: #f5f7fa;
}

#quoteRequests .manual-quote-queue-item {
  margin-bottom: 9px;
  padding: 14px;
  gap: 6px;
  border-color: #dce3eb;
  border-left-width: 4px;
  border-radius: 12px;
}

#quoteRequests .manual-quote-queue-item:hover {
  border-color: #ecc92d;
  box-shadow: 0 10px 24px rgba(22, 34, 50, .08);
}

#quoteRequests .manual-quote-queue-item.active {
  border-color: #e7bd0d;
  background:
    linear-gradient(110deg, #fffdf2, #fff 72%);
  box-shadow: 0 10px 25px rgba(172, 130, 0, .12);
}

#quoteRequests .manual-quote-queue-item > strong {
  margin-top: 2px;
  font-size: 15px;
}

#quoteRequests .manual-quote-queue-product {
  display: grid;
  min-width: 0;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  padding: 5px 0 3px;
  overflow: visible;
  white-space: normal;
}

#quoteRequests .manual-quote-queue-product > span:last-child {
  display: grid;
  min-width: 0;
  gap: 5px;
}

#quoteRequests .manual-quote-queue-product strong,
#quoteRequests .manual-quote-queue-product small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#quoteRequests .manual-quote-queue-product strong {
  color: var(--mq-ink);
  font-size: 14px;
  font-weight: 900;
}

#quoteRequests .manual-quote-queue-product small {
  color: #718095;
  font-size: 11px;
}

#quoteRequests .manual-quote-product-visual {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  background: linear-gradient(145deg, #fff9d7, #f2f5f8);
}

#quoteRequests .manual-quote-product-visual.is-queue {
  width: 58px;
  height: 58px;
}

#quoteRequests .manual-quote-summary-product > .manual-quote-product-visual.is-detail {
  width: 82px;
  height: 82px;
  display: grid;
}

#quoteRequests .manual-quote-summary-product > .manual-quote-product-visual::before {
  display: none;
}

#quoteRequests .manual-quote-product-visual img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

#quoteRequests .manual-quote-product-visual b {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #8b6800;
  font-size: 18px;
  font-weight: 1000;
}

#quoteRequests .manual-quote-queue-bottom {
  margin-top: 5px;
}

#quoteRequests .manual-quote-queue-bottom em {
  padding: 4px 8px;
  border-radius: 999px;
  color: #9c5b00;
  background: #fff5ca;
}

#quoteRequests .manual-quote-pagination {
  padding: 10px 13px;
  background: #fff;
}

#quoteRequests .manual-quote-pagination button {
  min-width: 62px;
  border-radius: 8px;
}

#quoteRequests .manual-quote-detail-head {
  padding: 20px 22px;
  background:
    linear-gradient(100deg, #fffdf2 0%, #fff 62%),
    #fff;
}

#quoteRequests .manual-quote-detail-head h2 {
  margin: 4px 0;
  font-size: 22px;
  letter-spacing: -.02em;
}

#quoteRequests .manual-quote-summary-grid {
  padding: 16px 20px;
  grid-template-columns: minmax(260px, 1.25fr) minmax(155px, .85fr) minmax(210px, 1.1fr) minmax(180px, .9fr);
  gap: 10px;
  background: #f4f7fa;
}

#quoteRequests .manual-quote-summary-grid article {
  position: relative;
  min-height: 116px;
  padding: 15px;
  overflow: hidden;
  border-color: #dce4ec;
  border-radius: 12px;
  box-shadow: 0 5px 15px rgba(28, 41, 58, .035);
}

#quoteRequests .manual-quote-summary-grid article::after {
  content: "";
  position: absolute;
  right: -18px;
  bottom: -21px;
  width: 64px;
  height: 64px;
  border: 13px solid rgba(255, 215, 46, .1);
  border-radius: 50%;
}

#quoteRequests .manual-quote-summary-grid article > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #758294;
}

#quoteRequests .manual-quote-summary-grid article > span::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #f1c500;
  box-shadow: 0 0 0 4px #fff6c5;
}

#quoteRequests .manual-quote-summary-grid h3 {
  margin-top: 9px;
  color: var(--mq-ink);
  font-size: 14px;
}

#quoteRequests .manual-quote-product-card {
  grid-template-columns: 82px minmax(0, 1fr);
}

#quoteRequests .manual-quote-product-card img,
#quoteRequests .manual-quote-product-placeholder {
  width: 82px;
  height: 82px;
  border-radius: 11px;
  box-shadow: 0 5px 13px rgba(24, 35, 52, .1);
}

#quoteRequests .manual-quote-product-card .manual-quote-product-visual img {
  width: 100%;
  height: 100%;
  border-radius: 0;
}

#quoteRequests .manual-quote-summary-result {
  background: linear-gradient(145deg, #fffdf2, #fff);
}

#quoteRequests .manual-quote-requirements {
  margin: 16px 20px 0;
  padding: 17px;
  border-color: #dce4ec;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(27, 39, 56, .04);
}

#quoteRequests .manual-quote-requirements > header {
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e7ebf0;
}

#quoteRequests .manual-quote-requirements > header > div {
  display: grid;
  gap: 3px;
}

#quoteRequests .manual-quote-requirements > header small {
  color: #8a96a4;
  font-size: 11px;
}

#quoteRequests .manual-quote-requirements > header b {
  padding: 5px 9px;
  border-radius: 999px;
  background: #fff4bb;
}

#quoteRequests .manual-quote-requirements dl {
  position: relative;
  min-height: 70px;
  padding: 12px 13px;
  border: 1px solid #e4e9ef;
  border-radius: 10px;
  background: #f7f9fb;
}

#quoteRequests .manual-quote-requirements dl::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 3px;
  border-radius: 3px;
  background: var(--mq-yellow);
}

#quoteRequests .manual-quote-requirements dt {
  padding-left: 5px;
  font-weight: 700;
}

#quoteRequests .manual-quote-requirements dd {
  padding-left: 5px;
  font-size: 14px;
}

#quoteRequests .manual-quote-specification {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
}

#quoteRequests .manual-quote-specification span {
  border-color: #e3e9ef;
  border-radius: 9px;
  background: #fff;
}

#quoteRequests .manual-quote-requirements > p {
  padding: 12px 13px;
  border-radius: 8px;
  color: #4c5b6c;
  background: #fff9df;
}

#quoteRequests .manual-quote-detail-columns {
  padding: 16px 20px 20px;
  gap: 14px;
}

#quoteRequests .manual-quote-history,
#quoteRequests .manual-quote-publish {
  padding: 16px;
  border-radius: 13px;
  box-shadow: 0 6px 20px rgba(27, 39, 56, .04);
}

#quoteRequests .manual-quote-publish {
  border-color: #ebce54;
  background: linear-gradient(160deg, #fffdf3, #fff);
}

#quoteRequests .manual-quote-version-form :is(input, textarea) {
  border-radius: 8px;
}

#quoteRequests .manual-quote-version-form > .primary {
  border-radius: 9px;
  box-shadow: 0 8px 18px rgba(201, 157, 0, .16);
}

@media (max-width: 1480px) {
  #quoteRequests .manual-quote-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  #quoteRequests .manual-quote-hero-steps {
    min-width: 0;
    width: 100%;
  }

  #quoteRequests .manual-quote-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  #quoteRequests .manual-quote-workspace {
    grid-template-columns: 310px minmax(0, 1fr);
  }
}

@media (max-width: 940px) {
  #quoteRequests .manual-quote-workspace {
    grid-template-columns: 1fr;
  }

  #quoteRequests .manual-quote-queue-panel {
    position: static;
  }
}

/* Unified owner-only system management workbench. */
#system .system-control-workbench {
  padding: 0;
  overflow: hidden;
  border-color: #dce3ec;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(24, 38, 58, .08);
}

.system-unified-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 26px 20px;
  border-bottom: 1px solid #e8edf3;
  background:
    radial-gradient(circle at 88% 20%, rgba(255, 214, 38, .22), transparent 23%),
    linear-gradient(105deg, #fff 0%, #fffdf2 100%);
}

.system-unified-head > div {
  min-width: 0;
}

.system-unified-head span {
  color: #a26f00;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
}

.system-unified-head h2 {
  margin: 5px 0 4px;
  color: #111a27;
  font-size: 26px;
}

.system-unified-head p,
#system .system-workspace-panel .panel-head p {
  margin: 0;
  color: #6f7b8c;
  font-size: 12px;
  line-height: 1.65;
}

#system .system-health-band {
  margin: 20px 22px 18px;
  padding: 14px 16px;
  border-color: #e0e6ee;
  border-radius: 12px;
  background: #f8fafc;
}

#system .system-health-band > div {
  min-height: 43px;
  justify-content: center;
}

#system .system-health-band strong {
  color: #172131;
  font-size: 16px;
}

#system .system-health-band button {
  min-height: 40px;
  padding-inline: 18px;
  border-color: #cfd8e5;
  background: #fff;
}

.system-workspace-tabs {
  display: grid;
  grid-template-columns: repeat(6, minmax(145px, 1fr));
  gap: 9px;
  padding: 0 22px 18px;
  border-bottom: 1px solid #e5eaf0;
}

.system-workspace-tabs button {
  position: relative;
  min-width: 0;
  min-height: 76px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dbe2eb;
  border-radius: 12px;
  color: #1f2a3a;
  background: #f8fafc;
  box-shadow: none;
  text-align: left;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.system-workspace-tabs button:hover {
  border-color: #d4b331;
  background: #fffdf3;
  transform: translateY(-1px);
}

.system-workspace-tabs button.active {
  border-color: #e4b800;
  background: linear-gradient(135deg, #fff8d6, #fffdf3);
  box-shadow: inset 0 -3px 0 #ffd51f, 0 8px 20px rgba(157, 116, 0, .08);
}

.system-workspace-tabs button i {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #5e4a00;
  background: #fff;
  box-shadow: inset 0 0 0 1px #e2e7ee;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.system-workspace-tabs button.active i {
  color: #111827;
  background: #ffda30;
  box-shadow: none;
}

.system-workspace-tabs button > span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.system-workspace-tabs button b {
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.system-workspace-tabs button small {
  overflow: hidden;
  color: #8792a2;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.system-workspace-tabs button em {
  min-width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  color: #576273;
  background: #edf1f6;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

.system-workspace-tabs button.active em {
  color: #735500;
  background: #fff;
}

.system-workspace-tabs button em.has-warning {
  color: #a33a21;
  background: #ffebe5;
}

.system-workspace-content {
  padding: 22px;
  background: #f7f9fc;
}

.system-workspace-panel {
  min-width: 0;
  padding: 22px;
  border: 1px solid #e0e6ee;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(25, 40, 65, .045);
}

.system-workspace-panel[hidden] {
  display: none;
}

#system .system-workspace-panel .panel-head {
  min-height: 52px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e8edf3;
}

#system .system-workspace-panel .panel-head h2 {
  margin: 3px 0 4px;
  font-size: 20px;
}

.system-section-tip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid #e0e6ee;
  border-radius: 999px;
  color: #687587;
  background: #f8fafc;
  font-size: 11px;
  white-space: nowrap;
}

.system-action-note {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 2px 0 15px;
  padding: 11px 13px;
  border: 1px solid #f1dc83;
  border-radius: 9px;
  color: #725b11;
  background: #fffbea;
  font-size: 12px;
}

.system-action-note b {
  padding: 3px 7px;
  border-radius: 5px;
  color: #3c310c;
  background: #ffdd3f;
}

#system .system-workspace-panel > .admin-scroll-table {
  overflow: auto;
  border: 1px solid #e1e7ef;
  border-radius: 11px;
  background: #fff;
}

#system .system-workspace-panel > .admin-scroll-table .table-wrap {
  border: 0;
}

#system .system-log-pagination {
  margin-top: 14px;
  border: 1px solid #dfe6ef;
  border-radius: 11px;
  background: #fff;
}

/* Owner-only employee account registration and lifecycle management. */
.staff-access-panel {
  grid-column: 1 / -1;
  overflow: hidden;
  border-color: #e3e8ef;
  background:
    radial-gradient(circle at 96% 0%, rgba(255, 221, 54, .16), transparent 26%),
    #fff;
}

.staff-access-head {
  align-items: flex-start;
  padding-bottom: 16px;
  border-bottom: 1px solid #e9edf3;
}

.staff-access-head h2,
.staff-form-title h3,
.staff-list-head h3 {
  margin: 3px 0 0;
}

.staff-owner-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid #efd04b;
  border-radius: 999px;
  background: #fff7cd;
  color: #7a5900;
  font-size: 12px;
  white-space: nowrap;
}

.staff-security-note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px 16px;
  align-items: center;
  margin: 16px 0;
  padding: 13px 15px;
  border: 1px solid #f0d878;
  border-left: 4px solid #ffd52f;
  border-radius: 12px;
  background: #fffbee;
}

.staff-security-note strong {
  color: #7b5900;
  white-space: nowrap;
}

.staff-security-note span {
  color: #5f6877;
  font-size: 13px;
  line-height: 1.65;
}

.staff-access-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .65fr);
  gap: 16px;
  align-items: stretch;
}

.staff-create-form,
.staff-password-form {
  margin: 0;
  padding: 18px;
  border: 1px solid #dde4ed;
  border-radius: 14px;
  background: #f9fbfd;
  box-shadow: 0 10px 28px rgba(25, 40, 65, .05);
}

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

.staff-password-form {
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.staff-create-form label,
.staff-password-form label {
  display: grid;
  gap: 7px;
  color: #263245;
  font-size: 13px;
  font-weight: 700;
}

.staff-create-form input,
.staff-create-form select,
.staff-password-form input {
  width: 100%;
  min-height: 42px;
  border-color: #d6deea;
  background: #fff;
}

.staff-form-title {
  display: flex;
  grid-column: 1 / -1;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 2px;
}

.staff-form-title span,
.staff-list-head span {
  color: #a47400;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}

.staff-form-title small,
.staff-password-form p {
  color: #788496;
  font-size: 12px;
  line-height: 1.55;
}

.staff-password-form p {
  margin: 0;
}

.staff-create-submit {
  grid-column: 1 / -1;
  min-height: 44px;
}

.owner-access-confirmation {
  grid-column: 1 / -1;
  display: flex !important;
  align-items: flex-start;
  gap: 12px !important;
  padding: 14px 16px;
  border: 1px solid #f0c43c;
  border-radius: 12px;
  background: linear-gradient(100deg, #fff7cf, #fffdf5);
  color: #44350a !important;
}

.owner-access-confirmation[hidden] {
  display: none !important;
}

.owner-access-confirmation input {
  width: 18px;
  min-height: 18px;
  margin-top: 2px;
  accent-color: #f2c400;
}

.owner-access-confirmation span {
  display: grid;
  gap: 4px;
}

.owner-access-confirmation strong {
  font-size: 14px;
}

.owner-access-confirmation small {
  color: #78672d;
  font-weight: 500;
  line-height: 1.55;
}

.staff-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding: 16px 2px 10px;
  border-top: 1px solid #e7ebf1;
}

.staff-account-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.staff-account-cell small,
.staff-access-panel .muted {
  color: #8792a3;
  font-size: 12px;
}

.staff-role-tag {
  background: #edf4ff;
  color: #2d5f9a;
}

.staff-active-tag {
  background: #e9f8ef;
  color: #16824b;
}

.staff-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.staff-row-actions .table-button {
  white-space: nowrap;
}

.staff-protected-tag {
  color: #8a5b00;
  background: #fff6d8;
  border: 1px solid #f2d27a;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .system-workspace-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .staff-access-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .system-unified-head,
  #system .system-workspace-panel .panel-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .system-workspace-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-inline: 14px;
  }

  .system-workspace-content {
    padding: 14px;
  }

  .system-workspace-panel {
    padding: 15px;
  }

  .staff-create-form {
    grid-template-columns: 1fr;
  }

  .staff-form-title,
  .staff-security-note {
    grid-template-columns: 1fr;
  }

  .staff-form-title {
    flex-direction: column;
  }
}

/* Keep the manual quote detail compact when the history column is empty. */
#quoteRequests .manual-quote-detail-columns {
  display: flex;
  flex-direction: column;
}

#quoteRequests .manual-quote-publish {
  order: 1;
  position: static;
  width: 100%;
}

#quoteRequests .manual-quote-history {
  order: 2;
  width: 100%;
}

#quoteRequests .manual-quote-version-form {
  grid-template-columns: minmax(180px, .9fr) minmax(320px, 1.4fr) minmax(180px, .8fr);
  align-items: end;
  gap: 10px 12px;
}

#quoteRequests .manual-quote-version-form > label:first-of-type {
  grid-column: 1;
}

#quoteRequests .manual-quote-version-form > div:first-of-type {
  grid-column: 2;
}

#quoteRequests #quoteVersionTotal {
  grid-column: 3;
  min-height: 67px;
  align-content: center;
}

#quoteRequests .manual-quote-version-form > div:nth-of-type(2) {
  grid-column: 1 / span 2;
}

#quoteRequests .manual-quote-version-form > label:has(textarea) {
  grid-column: 3;
  grid-row: 2 / span 2;
}

#quoteRequests .manual-quote-version-form textarea {
  min-height: 108px;
  resize: vertical;
}

#quoteRequests .manual-quote-publish-note {
  grid-column: 1 / span 2;
  min-height: 46px;
  align-content: center;
}

#quoteRequests .manual-quote-version-form > .primary {
  grid-column: 1 / -1;
  min-height: 44px;
}

#quoteRequests .manual-quote-history .manual-quote-muted-box {
  min-height: 50px;
  padding: 15px;
}

@media (max-width: 1250px) {
  #quoteRequests .manual-quote-version-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #quoteRequests .manual-quote-version-form > label:first-of-type,
  #quoteRequests .manual-quote-version-form > div:first-of-type,
  #quoteRequests #quoteVersionTotal,
  #quoteRequests .manual-quote-version-form > div:nth-of-type(2),
  #quoteRequests .manual-quote-version-form > label:has(textarea),
  #quoteRequests .manual-quote-publish-note {
    grid-column: auto;
    grid-row: auto;
  }

  #quoteRequests .manual-quote-version-form > .primary {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  #quoteRequests .manual-quote-version-form {
    grid-template-columns: 1fr;
  }

  #quoteRequests .manual-quote-version-form > .primary {
    grid-column: auto;
  }
}

/* Match the queue height to the quote detail and keep the queue itself scrollable. */
#quoteRequests .manual-quote-workspace {
  align-items: stretch;
}

#quoteRequests .manual-quote-queue-panel {
  position: relative;
  top: auto;
  height: 100%;
  display: flex;
  flex-direction: column;
}

#quoteRequests .manual-quote-queue {
  height: 0;
  min-height: 0;
  max-height: none;
  flex: 1 1 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #9eacbd transparent;
}

#quoteRequests .manual-quote-queue::-webkit-scrollbar {
  width: 7px;
}

#quoteRequests .manual-quote-queue::-webkit-scrollbar-track {
  background: transparent;
}

#quoteRequests .manual-quote-queue::-webkit-scrollbar-thumb {
  border: 2px solid #f5f7fa;
  border-radius: 999px;
  background: #9eacbd;
}

#quoteRequests .manual-quote-pagination {
  flex: 0 0 auto;
}

@media (max-width: 940px) {
  #quoteRequests .manual-quote-queue-panel {
    height: auto;
  }

  #quoteRequests .manual-quote-queue {
    height: auto;
    min-height: 240px;
    max-height: 420px;
    flex: none;
  }
}

/* Spacious customer-service workbench: larger controls and clearer three-column hierarchy. */
@media (min-width: 1321px) {
  #support .support-workbench {
    grid-template-columns: 380px minmax(680px, 1fr) 330px;
    height: clamp(680px, calc(100vh - 235px), 860px);
    min-height: 680px;
  }
}

#support .support-queue-toolbar {
  gap: 12px;
  padding: 17px 16px 15px;
}

#support .support-ticket-search,
#support .support-ticket-filter,
#support .support-unread-filter {
  height: 44px;
  border-radius: 11px;
  font-size: 13px;
}

#support .support-ticket-search,
#support .support-ticket-filter {
  padding-right: 14px;
  padding-left: 14px;
}

#support .support-unread-filter {
  min-width: 88px;
  padding: 0 13px;
}

#support .support-ticket-list {
  padding: 13px 12px;
}

#support .support-ticket-item {
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 13px;
  margin-bottom: 10px;
  padding: 15px 14px;
  border-color: #e2e8ef;
  border-radius: 15px;
  background: rgba(255, 255, 255, .82);
}

#support .support-ticket-item.active {
  box-shadow: inset 5px 0 0 #ffd52a, 0 10px 24px rgba(35, 49, 66, .075);
}

#support .support-queue-avatar {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  font-size: 16px;
}

#support .support-ticket-item > section > div strong {
  font-size: 15px;
}

#support .support-ticket-item > section > div span {
  font-size: 11px;
}

#support .support-ticket-item > section > p {
  margin: 8px 0 10px;
  font-size: 13px;
  line-height: 1.55;
}

#support .support-ticket-item > section > footer {
  gap: 10px;
}

#support .support-ticket-item > section > footer b,
#support .support-ticket-item > section > footer small,
#support .support-reply-state {
  font-size: 11px;
}

#support .support-ticket-product {
  gap: 11px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 12px;
}

#support .support-product-thumb.is-queue {
  width: 52px;
  height: 52px;
  border-radius: 12px;
}

#support .support-ticket-product > span strong {
  font-size: 13px;
}

#support .support-ticket-product > span small {
  font-size: 11px;
}

#support .support-queue-pagination {
  gap: 11px;
  padding: 13px 15px 15px;
  font-size: 12px;
}

#support .support-queue-page-summary span {
  font-size: 13px;
}

#support .support-queue-page-summary b {
  font-size: 16px;
}

#support .support-queue-page-summary small {
  font-size: 11px;
}

#support .support-queue-page-size select,
#support .support-queue-page-controls select,
#support .support-queue-page-controls button {
  height: 40px;
  border-radius: 9px;
  font-size: 12px;
}

#support .support-queue-page-size select {
  width: 94px;
}

#support .support-queue-page-controls {
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  gap: 9px;
}

#support .support-queue-page-controls button {
  width: 42px;
  font-size: 21px;
}

#support .support-thread-tabs {
  min-height: 58px;
  padding: 9px 13px 0;
}

#support .support-thread-tab {
  min-width: 168px;
  max-width: 236px;
  height: 49px;
}

#support .support-thread-select {
  padding: 0 12px;
}

#support .support-thread-select b {
  width: 29px;
  height: 29px;
  font-size: 11px;
}

#support .support-thread-select span {
  font-size: 13px;
}

#support .support-thread-select span small {
  font-size: 10px;
}

#support .support-conversation-head {
  min-height: 82px;
  padding: 15px 22px;
}

#support .support-chat-avatar {
  width: 48px;
  height: 48px;
  flex-basis: 48px;
  border-radius: 14px;
  font-size: 16px;
}

#support .support-chat-title section strong {
  font-size: 17px;
}

#support .support-chat-title section > span {
  font-size: 12px;
}

#support .support-product-thumb.is-head {
  width: 54px;
  height: 54px;
  border-radius: 13px;
}

#support .support-chat-product > span strong {
  font-size: 14px;
}

#support .support-chat-product > span small {
  font-size: 11px;
}

#support .support-conversation-head .status-select {
  width: 146px;
  height: 42px;
  font-size: 13px;
}

#support .support-conversation-body {
  gap: 21px;
  padding: 28px 30px 36px;
}

#support .support-message {
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 12px;
}

#support .support-message.agent {
  grid-template-columns: minmax(0, 1fr) 48px;
}

#support .support-message > b {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  font-size: 15px;
}

#support .support-message .support-message-author {
  font-size: 11px;
}

#support .support-message .support-message-bubble {
  padding: 14px 16px 10px;
  border-radius: 13px;
}

#support .support-message-bubble span {
  font-size: 15px;
  line-height: 1.65;
}

#support .support-message-bubble > small {
  font-size: 10px;
}

#support .support-compose {
  padding: 16px 20px 19px;
}

#support .support-compose-shortcuts {
  gap: 8px;
  margin-bottom: 11px;
}

#support .support-compose-shortcuts button {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 12px;
}

#support .support-compose .support-note {
  min-height: 118px;
  padding: 17px 122px 44px 17px;
  border-radius: 14px;
  font-size: 15px;
  line-height: 1.6;
}

#support .support-compose .support-send-button {
  right: 15px;
  bottom: 14px;
  min-width: 96px;
  height: 42px;
  border-radius: 10px;
  font-size: 14px;
}

#support .support-customer-card {
  padding: 20px 18px;
}

#support .support-customer-profile {
  gap: 14px;
  padding: 17px;
  border-radius: 16px;
}

#support .support-customer-avatar {
  width: 60px;
  height: 60px;
  flex-basis: 60px;
  border-radius: 18px;
}

#support .support-customer-avatar b {
  font-size: 22px;
}

#support .support-customer-profile > section > strong {
  font-size: 22px;
}

#support .support-customer-profile > section > small {
  font-size: 11px;
}

#support .support-customer-badges .tier-badge,
#support .support-customer-badges .support-guest-badge,
#support .support-customer-badges .support-side-status {
  min-height: 29px;
  padding: 5px 11px;
  font-size: 11px;
}

#support .support-customer-details {
  gap: 10px;
  margin-top: 15px;
}

#support .support-customer-details div {
  padding: 14px 14px 14px 43px !important;
  border-radius: 13px !important;
}

#support .support-customer-details dt {
  font-size: 10px;
}

#support .support-customer-details dd {
  font-size: 13px;
}

#support .support-linked-product-card,
#support .support-participants,
#support .support-customer-request {
  padding: 14px;
  border-radius: 14px;
}

#support .support-product-thumb.is-side {
  width: 68px;
  height: 68px;
  border-radius: 14px;
}

@media (min-width: 1051px) and (max-width: 1320px) {
  #support .support-workbench {
    grid-template-columns: 320px minmax(520px, 1fr) 280px;
    min-height: 660px;
  }
}

/* Natural support layout: the page scrolls once; columns no longer have nested vertical scrollbars. */
#support .support-workbench,
#support .support-custom-quote-guide + .support-workbench {
  height: auto;
  min-height: 680px;
  align-items: start;
  overflow: visible;
}

#support .support-queue {
  grid-template-rows: auto auto auto;
  align-self: start;
  max-height: none;
  overflow: visible;
}

#support .support-ticket-list {
  height: auto;
  max-height: none;
  overflow: visible;
  scrollbar-gutter: auto;
}

#support .support-conversation {
  grid-template-rows: auto auto auto auto;
  align-self: start;
  overflow: visible;
}

#support .support-thread-tabs {
  flex-wrap: wrap;
  overflow: visible;
  padding-bottom: 9px;
}

#support .support-thread-capacity {
  position: static;
}

#support .support-conversation-body {
  min-height: 430px;
  max-height: none;
  overflow: visible;
}

#support .support-customer-card {
  align-self: start;
  max-height: none;
  overflow: visible;
}

#support .support-customer-card > p,
#support .support-customer-request p,
#support .support-quote-card > p {
  max-height: none;
  overflow: visible;
}

@media (max-width: 1050px) {
  #support .support-workbench,
  #support .support-custom-quote-guide + .support-workbench {
    min-height: 0;
  }

  #support .support-conversation-body {
    min-height: 360px;
  }
}

/* Natural customer-service redesign: spacious cards without nested scroll regions. */
#support .support-workspace-panel {
  overflow: visible;
  border-color: #d8e1eb;
  background: #eef3f8;
  box-shadow: 0 18px 44px rgba(26, 38, 52, .075);
}

#support .support-workbench.support-workbench,
#support .support-custom-quote-guide + .support-workbench {
  grid-template-columns: minmax(330px, 360px) minmax(600px, 1fr) minmax(290px, 320px);
  gap: 14px;
  height: auto;
  min-height: 0;
  padding: 14px;
  align-items: start;
  overflow: visible;
  border-top-color: #d8e1eb;
  background:
    radial-gradient(circle at 84% 4%, rgba(255, 220, 67, .12), transparent 23%),
    #eef3f8;
}

#support .support-workbench .support-queue,
#support .support-workbench .support-conversation,
#support .support-workbench .support-customer-card {
  min-width: 0;
  align-self: start;
  overflow: visible;
  border: 1px solid #d8e1eb;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(31, 46, 64, .065);
}

#support .support-workbench .support-queue {
  display: grid;
  grid-template-rows: auto auto auto auto;
}

#support .support-queue-heading {
  display: flex;
  min-height: 74px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 17px;
  border-bottom: 1px solid #e3e9f0;
  border-radius: 17px 17px 0 0;
  background: linear-gradient(110deg, #fffdf4 0%, #fff 62%);
}

#support .support-queue-heading > div {
  display: grid;
  min-width: 0;
  gap: 4px;
}

#support .support-queue-heading b {
  color: #162337;
  font-size: 17px;
  line-height: 1.2;
}

#support .support-queue-heading span {
  overflow: hidden;
  color: #8793a2;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#support .support-queue-heading > strong {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border: 1px solid #efc81d;
  border-radius: 12px;
  color: #483800;
  background: #ffe169;
  font-size: 16px;
}

#support .support-workbench .support-queue-toolbar {
  gap: 10px;
  padding: 13px 14px;
  background: #fff;
}

#support .support-workbench :is(.support-ticket-search, .support-ticket-filter, .support-unread-filter) {
  height: 42px;
  border-radius: 10px;
}

#support .support-workbench .support-ticket-search,
#support .support-workbench .support-ticket-filter {
  background: #f7f9fc;
}

#support .support-workbench .support-ticket-list {
  height: auto;
  max-height: none;
  padding: 12px;
  overflow: visible;
  background: #f7f9fc;
}

#support .support-workbench .support-ticket-item {
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 10px;
  padding: 14px;
  border: 1px solid #dfe6ee;
  border-radius: 14px;
  background: #fff;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

#support .support-workbench .support-ticket-item:hover {
  border-color: #d3b844;
  transform: translateY(-1px);
  box-shadow: 0 9px 22px rgba(31, 46, 64, .075);
}

#support .support-workbench .support-ticket-item.active {
  border-color: #e8be13;
  background: linear-gradient(120deg, #fff8d8 0%, #fffdf5 100%);
  box-shadow: inset 4px 0 0 #ffd528, 0 10px 24px rgba(83, 66, 0, .08);
}

#support .support-workbench .support-queue-avatar {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  font-size: 15px;
}

#support .support-workbench .support-ticket-item > section > div strong {
  font-size: 14px;
}

#support .support-workbench .support-ticket-item > section > p {
  margin: 7px 0 9px;
  font-size: 12px;
  line-height: 1.55;
}

#support .support-workbench .support-ticket-product {
  gap: 10px;
  margin-bottom: 9px;
  padding: 9px;
  border-radius: 11px;
  background: #fbfcfe;
}

#support .support-workbench .support-product-thumb.is-queue {
  width: 48px;
  height: 48px;
}

#support .support-workbench .support-queue-pagination {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 13px 14px 15px;
  border-radius: 0 0 17px 17px;
  background: #fff;
}

#support .support-workbench .support-queue-page-controls {
  grid-template-columns: 40px minmax(0, 1fr) 40px;
  gap: 8px;
}

#support .support-workbench .support-queue-page-controls button,
#support .support-workbench .support-queue-page-controls select,
#support .support-workbench .support-queue-page-size select {
  height: 38px;
}

#support .support-workbench .support-queue-page-controls button {
  width: 40px;
}

#support .support-workbench .support-conversation {
  display: grid;
  grid-template-rows: auto auto auto auto;
  border-right: 1px solid #d8e1eb;
}

#support .support-workbench .support-thread-tabs {
  display: flex;
  min-height: 60px;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px;
  overflow: visible;
  border-radius: 17px 17px 0 0;
  background: #f5f8fb;
}

#support .support-workbench .support-thread-tab {
  min-width: 145px;
  max-width: 215px;
  height: 40px;
  flex: 1 1 160px;
  overflow: hidden;
  border: 1px solid #d9e2eb;
  border-radius: 10px;
  background: #fff;
}

#support .support-workbench .support-thread-tab.active {
  border-color: #e4ba14;
  border-bottom: 1px solid #e4ba14;
  border-radius: 10px;
  background: #fff9dc;
  box-shadow: inset 0 0 0 1px rgba(255, 213, 40, .32), 0 5px 14px rgba(79, 61, 0, .06);
}

#support .support-workbench .support-thread-capacity {
  position: static;
  height: 40px;
  margin: 0 0 0 auto;
  align-self: center;
  box-shadow: none;
}

#support .support-workbench .support-conversation-head {
  min-height: 78px;
  padding: 14px 20px;
  border-bottom: 1px solid #e0e7ef;
}

#support .support-workbench .support-chat-avatar {
  width: 46px;
  height: 46px;
  flex-basis: 46px;
  border-radius: 13px;
}

#support .support-workbench .support-conversation-body {
  min-height: 300px;
  max-height: none;
  gap: 18px;
  padding: 25px 26px 30px;
  overflow: visible;
  background:
    radial-gradient(circle at 50% 0, rgba(255, 255, 255, .72), transparent 36%),
    #f2f5f8;
}

#support .support-workbench .support-message-stack {
  max-width: min(720px, 82%);
}

#support .support-workbench .support-message .support-message-bubble {
  border-radius: 6px 15px 15px 15px;
  box-shadow: 0 7px 18px rgba(31, 46, 64, .07);
}

#support .support-workbench .support-message.agent .support-message-bubble {
  border-color: #e2bd22;
  border-radius: 15px 6px 15px 15px;
  background: #ffdf58;
  box-shadow: 0 7px 18px rgba(155, 119, 0, .1);
}

#support .support-workbench .support-compose {
  padding: 14px 18px 17px;
  border-radius: 0 0 17px 17px;
}

#support .support-workbench .support-compose-shortcuts {
  flex-wrap: wrap;
  overflow: visible;
}

#support .support-workbench .support-compose .support-note {
  min-height: 104px;
  max-height: none;
  resize: vertical;
}

#support .support-workbench .support-customer-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-left: 1px solid #d8e1eb;
  background: #fff;
}

#support .support-workbench .support-customer-profile {
  margin: 0;
  padding: 16px;
  border-radius: 14px;
  background:
    radial-gradient(circle at 92% 8%, rgba(255, 214, 47, .25), transparent 35%),
    linear-gradient(135deg, #fffdf3 0%, #fff 70%);
  box-shadow: none;
}

#support .support-workbench .support-customer-avatar {
  width: 56px;
  height: 56px;
  flex-basis: 56px;
  border-radius: 16px;
}

#support .support-workbench .support-customer-profile > section > strong {
  font-size: 19px;
}

#support .support-workbench .support-customer-badges {
  margin: 0;
}

#support .support-workbench .support-customer-details {
  gap: 8px;
  margin-top: 0;
}

#support .support-workbench .support-customer-details div {
  min-height: 66px;
  padding: 12px 12px 12px 42px !important;
  border-radius: 12px !important;
  background: #f8fafc;
}

#support .support-workbench :is(.support-linked-product-card, .support-participants, .support-customer-request, .support-quote-card) {
  margin-top: 0;
  padding: 13px;
  border-radius: 13px;
  box-shadow: none;
}

#support .support-workbench .support-customer-card > p,
#support .support-workbench .support-customer-request p,
#support .support-workbench .support-quote-card > p {
  max-height: none;
  overflow: visible;
}

@media (min-width: 1181px) {
  #support .support-workbench .support-conversation,
  #support .support-workbench .support-customer-card {
    position: sticky;
    top: 14px;
  }
}

/* Staff account directory pagination. */
#systemStaffPanel #userTable .table-wrap {
  max-height: none;
  overflow-x: auto;
  overflow-y: visible;
}

#systemStaffPanel .staff-account-pagination {
  margin-top: 12px;
}

/* Purchase progress pagination. */
#purchases #purchaseTable .table-wrap {
  max-height: none;
  overflow-x: auto;
  overflow-y: visible;
}

#purchases .purchase-pagination {
  margin-top: 12px;
}

@media (max-width: 1500px) {
  #support .support-workbench.support-workbench,
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: minmax(300px, 330px) minmax(520px, 1fr) minmax(270px, 290px);
  }
}

@media (max-width: 1180px) {
  #support .support-workbench.support-workbench,
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: minmax(285px, 320px) minmax(0, 1fr);
  }

  #support .support-workbench .support-customer-card,
  #support .support-custom-quote-guide + .support-workbench .support-customer-card {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #support .support-workbench.support-workbench,
  #support .support-custom-quote-guide + .support-workbench {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 10px;
  }

  #support .support-workbench .support-customer-card,
  #support .support-custom-quote-guide + .support-workbench .support-customer-card {
    grid-column: 1;
    grid-template-columns: 1fr;
  }

  #support .support-workbench .support-conversation-body {
    min-height: 240px;
    padding: 20px 16px 24px;
  }
}

/* Keep the queue compact: only the conversation cards scroll. */
#support .support-workbench .support-queue {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

#support .support-workbench .support-ticket-list {
  height: clamp(460px, 60vh, 720px);
  max-height: clamp(460px, 60vh, 720px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #9aa8b7 #edf2f6;
}

#support .support-workbench .support-ticket-list::-webkit-scrollbar {
  width: 9px;
}

#support .support-workbench .support-ticket-list::-webkit-scrollbar-track {
  border-radius: 999px;
  background: #edf2f6;
}

#support .support-workbench .support-ticket-list::-webkit-scrollbar-thumb {
  border: 2px solid #edf2f6;
  border-radius: 999px;
  background: #9aa8b7;
}

#support .support-workbench .support-ticket-list::-webkit-scrollbar-thumb:hover {
  background: #758596;
}

@media (max-width: 760px) {
  #support .support-workbench .support-ticket-list {
    height: 420px;
    max-height: 420px;
  }
}

/* Equal-height customer-service columns. */
@media (min-width: 1181px) {
  #support .support-workbench.support-workbench,
  #support .support-custom-quote-guide + .support-workbench {
    height: clamp(680px, calc(100vh - 105px), 820px);
    min-height: 680px;
    align-items: stretch;
  }

  #support .support-workbench .support-queue,
  #support .support-workbench .support-conversation,
  #support .support-workbench .support-customer-card {
    position: static;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    align-self: stretch;
  }

  #support .support-workbench .support-queue {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }

  #support .support-workbench .support-ticket-list {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
  }

  #support .support-workbench .support-conversation {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }

  #support .support-workbench .support-conversation-body {
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #a2aebb #edf2f6;
  }

  #support .support-workbench .support-customer-card {
    align-content: start;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #a2aebb #edf2f6;
  }

  #support .support-workbench :is(.support-conversation-body, .support-customer-card)::-webkit-scrollbar {
    width: 8px;
  }

  #support .support-workbench :is(.support-conversation-body, .support-customer-card)::-webkit-scrollbar-track {
    border-radius: 999px;
    background: #edf2f6;
  }

  #support .support-workbench :is(.support-conversation-body, .support-customer-card)::-webkit-scrollbar-thumb {
    border: 2px solid #edf2f6;
    border-radius: 999px;
    background: #a2aebb;
  }
}

/* Clearer typography and hierarchy for the inline customer-service quote card. */
#support .support-quote-card {
  gap: 12px;
  padding: 14px;
}

#support .support-inline-quote > summary {
  min-height: 42px;
  padding: 0 12px;
  font-size: 12px;
  letter-spacing: .01em;
}

#support .support-inline-quote > summary span {
  font-size: 12px;
  font-weight: 900;
}

#support .support-inline-quote > summary b {
  font-size: 10px;
  font-weight: 800;
}

#support .support-inline-quote-form {
  gap: 10px 8px;
  padding: 12px;
}

#support .support-inline-quote-form label {
  gap: 6px;
  color: #526173;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
}

#support .support-inline-quote-form input,
#support .support-inline-quote-form textarea {
  color: #172234;
  background: #fbfcfd;
  font-size: 12px;
  font-weight: 700;
}

#support .support-inline-quote-form input {
  height: 38px;
  padding: 0 10px;
}

#support .support-inline-quote-form textarea {
  min-height: 72px;
  padding: 10px;
  line-height: 1.6;
}

#support .support-inline-quote-form input::placeholder,
#support .support-inline-quote-form textarea::placeholder {
  color: #9aa5b2;
  font-weight: 500;
}

#support .support-inline-quote-total {
  min-height: 52px;
  padding: 10px 12px;
  border: 1px solid #f2dc76;
  border-radius: 10px;
  background: linear-gradient(135deg, #fff9d8 0%, #fff0a9 100%);
}

#support .support-inline-quote-total span {
  color: #6c5710;
  font-size: 11px;
  font-weight: 800;
}

#support .support-inline-quote-total b {
  color: #ef3e24;
  font-size: 21px;
  font-weight: 950;
  letter-spacing: -.025em;
}

#support .support-inline-quote-form > small {
  padding: 0 2px;
  color: #748092;
  font-size: 10px;
  line-height: 1.65;
}

#support .support-publish-quote,
#support .support-open-quote {
  display: flex;
  min-height: 44px;
  height: 44px;
  border-radius: 10px;
  align-items: center;
  justify-content: center;
  color: #152033;
  background: linear-gradient(180deg, #ffe263 0%, #ffd83d 100%);
  box-shadow: 0 5px 12px rgba(176, 127, 0, .12);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
  line-height: 1;
  text-align: center;
}

#support .support-publish-quote:hover,
#support .support-open-quote:hover {
  background: linear-gradient(180deg, #ffdc43 0%, #ffcf1f 100%);
  box-shadow: 0 7px 16px rgba(176, 127, 0, .17);
  transform: translateY(-1px);
}

#support .support-publish-quote:active,
#support .support-open-quote:active {
  box-shadow: 0 2px 6px rgba(176, 127, 0, .12);
  transform: translateY(0);
}

#support .support-open-quote span {
  font-size: 16px;
}

/* Refund review pagination. */
#support [data-support-module-panel="refund"] .refund-review-scroll {
  max-height: none;
  margin-bottom: 0;
  overflow-x: auto;
  overflow-y: visible;
}

#support [data-support-module-panel="refund"] .refund-review-scroll .table-wrap {
  min-height: 0;
  max-height: none;
  overflow-x: auto;
  overflow-y: visible;
}

#support [data-support-module-panel="refund"] .refund-pagination {
  margin: 12px 16px 0;
}