:root {
  color-scheme: light;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", sans-serif;
  --blue: #238fd3;
  --blue-dark: #126da8;
  --blue-light: #e8f6ff;
  --blue-border: #62b6e9;
  --ink: #1a2c38;
  --muted: #657986;
  --surface: #ffffff;
  --background: #f4f9fc;
  --green: #2d9c55;
  --orange: #e49b2c;
  --danger: #c84545;
  --shadow: 0 14px 42px rgba(28, 89, 126, .13);
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { background: var(--background); color: var(--ink); font-size: 14px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
input, select, textarea {
  width: 100%; border: 1px solid #a9bfcc; border-radius: 4px; background: white;
  color: var(--ink); padding: 8px 10px; outline: none; min-height: 38px;
}
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(35,143,211,.13); }
input:disabled, select:disabled, textarea:disabled { color: #71818a; border-color: #cbd7dc; background: #eef2f4; cursor: not-allowed; opacity: 1; }
label:has(> input:disabled), label:has(> select:disabled), label:has(> textarea:disabled) { color: #7d8c93; }
label { display: grid; gap: 5px; color: #405560; font-weight: 600; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.eyebrow { margin: 0 0 5px; color: var(--blue-dark); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }

.login-page {
  min-height: 100vh; display: grid; place-items: center; padding: 28px;
  background:
    radial-gradient(circle at 12% 15%, rgba(70,173,229,.24), transparent 31%),
    radial-gradient(circle at 89% 80%, rgba(255,186,67,.20), transparent 25%),
    linear-gradient(145deg, #edf8ff, #f8fbfd 56%, #fdf8eb);
}
.login-card {
  width: min(840px, 100%); display: grid; grid-template-columns: 1.15fr .85fr;
  border: 1px solid #cfe2ed; border-radius: 20px; background: rgba(255,255,255,.97);
  box-shadow: 0 30px 90px rgba(20,90,132,.17); overflow: hidden;
}
.login-brand { display: flex; gap: 22px; padding: 52px 42px; background: linear-gradient(145deg, #e5f5ff, #f7fcff); }
.login-brand h1 { margin: 2px 0 14px; font-size: clamp(27px, 4vw, 40px); letter-spacing: -.03em; color: #115f91; }
.login-brand p:last-child { margin: 0; color: var(--muted); line-height: 1.8; font-size: 16px; }
.brand-mark {
  flex: 0 0 68px; width: 68px; height: 68px; display: grid; place-items: center;
  color: white; background: linear-gradient(145deg, #32a4e6, #1678bd); border-radius: 18px;
  font-size: 31px; font-weight: 800; box-shadow: 0 14px 30px rgba(27,127,190,.25);
}
.login-form { padding: 42px 38px 24px; display: grid; gap: 15px; align-content: center; }
.login-form input { height: 44px; }
.login-button { margin-top: 5px; min-height: 46px; font-size: 16px; }
.form-message { min-height: 20px; margin: 0; color: var(--danger); font-weight: 600; }
.login-help { grid-column: 1 / -1; padding: 13px 28px; display: flex; justify-content: space-between; color: #55717f; background: #f4fafc; border-top: 1px solid #dbe9ef; }
.online-dot { display: inline-block; width: 9px; height: 9px; margin-right: 7px; border-radius: 50%; background: #27a75a; box-shadow: 0 0 0 4px rgba(39,167,90,.12); }
.online-dot.offline { background: #c84545; box-shadow: 0 0 0 4px rgba(200,69,69,.12); }
.connectivity-offline, .status-offline { color: #a83939 !important; }

/* Branded store-login experience. Kept CSS-only so the page stays fast and self-contained. */
.login-page {
  position: relative; min-height: 100vh; display: grid; place-items: center; padding: 32px; overflow: hidden;
  background:
    radial-gradient(circle at 8% 10%, rgba(105,210,255,.32), transparent 27%),
    radial-gradient(circle at 92% 18%, rgba(132,232,225,.22), transparent 24%),
    radial-gradient(circle at 78% 92%, rgba(61,150,222,.20), transparent 29%),
    linear-gradient(135deg, #e5f8ff 0%, #f4fcff 42%, #e9f8f8 100%);
}
.login-page::before,
.login-page::after {
  content: ""; position: absolute; left: -8%; right: -8%; bottom: -145px; height: 260px;
  border-radius: 48% 44% 0 0; pointer-events: none;
}
.login-page::before { background: rgba(30,145,211,.10); transform: rotate(-2deg); }
.login-page::after { bottom: -176px; background: rgba(20,113,184,.10); transform: rotate(2.5deg); }
.login-ambient { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.ambient-bubble {
  position: absolute; display: block; border: 1px solid rgba(255,255,255,.82); border-radius: 50%;
  background: radial-gradient(circle at 30% 24%, rgba(255,255,255,.92), rgba(187,234,250,.18) 48%, rgba(64,157,207,.08));
  box-shadow: inset 0 0 18px rgba(255,255,255,.52), 0 18px 50px rgba(33,131,181,.08);
  animation: bubble-float 7s ease-in-out infinite;
}
.bubble-one { width: 94px; height: 94px; left: 6%; top: 18%; }
.bubble-two { width: 48px; height: 48px; left: 16%; bottom: 14%; animation-delay: -2.2s; }
.bubble-three { width: 116px; height: 116px; right: 5%; bottom: 17%; animation-delay: -4.5s; }
.bubble-four { width: 38px; height: 38px; right: 18%; top: 12%; animation-delay: -1.3s; }
@keyframes bubble-float { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-18px) scale(1.035); } }
.login-card {
  position: relative; z-index: 1; width: min(980px, 100%); min-height: 590px; display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
  border: 1px solid rgba(255,255,255,.88); border-radius: 30px; background: rgba(255,255,255,.90);
  box-shadow: 0 38px 100px rgba(19,93,137,.20), 0 7px 24px rgba(26,119,169,.10);
  overflow: hidden; backdrop-filter: blur(18px);
}
.login-card::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: 56%; width: 1px;
  background: linear-gradient(transparent, rgba(41,145,198,.18) 14%, rgba(41,145,198,.18) 86%, transparent);
}
.login-brand {
  position: relative; display: block; min-width: 0; padding: 43px 46px 32px; color: white; overflow: hidden;
  background:
    radial-gradient(circle at 12% 10%, rgba(255,255,255,.22), transparent 26%),
    radial-gradient(circle at 88% 78%, rgba(82,225,226,.24), transparent 28%),
    linear-gradient(145deg, #087bbd 0%, #119ed2 48%, #22bfc5 100%);
}
.login-brand::before {
  content: ""; position: absolute; width: 340px; height: 340px; right: -210px; top: -210px;
  border: 52px solid rgba(255,255,255,.08); border-radius: 50%;
}
.login-brand-heading { position: relative; z-index: 2; display: flex; align-items: center; gap: 17px; }
.login-brand h1 { margin: 1px 0 0; color: white; font-size: clamp(28px, 3.5vw, 40px); letter-spacing: -.04em; text-shadow: 0 3px 18px rgba(0,71,116,.14); }
.login-brand .eyebrow { margin-bottom: 3px; color: rgba(255,255,255,.78); }
.login-brand .login-slogan { position: relative; z-index: 2; margin: 25px 0 0; color: rgba(255,255,255,.91); font-size: 16px; line-height: 1.8; letter-spacing: .04em; }
.brand-mark {
  flex: 0 0 65px; width: 65px; height: 65px; display: grid; place-items: center;
  color: white; border: 1px solid rgba(255,255,255,.38); border-radius: 20px;
  background: linear-gradient(145deg, rgba(255,255,255,.26), rgba(255,255,255,.10));
  box-shadow: 0 14px 30px rgba(0,83,133,.20), inset 0 1px 0 rgba(255,255,255,.35);
}
.brand-mark svg { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.wash-visual { position: relative; z-index: 1; height: 300px; margin-top: 5px; display: grid; place-items: center; }
.wash-halo { position: absolute; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; }
.halo-one { width: 310px; height: 310px; }
.halo-two { width: 242px; height: 242px; border-color: rgba(255,255,255,.23); }
.washer {
  position: relative; width: 205px; height: 228px; padding-top: 53px; border: 1px solid rgba(255,255,255,.62);
  border-radius: 29px; background: linear-gradient(155deg, rgba(255,255,255,.96), rgba(214,246,250,.80));
  box-shadow: 0 32px 55px rgba(0,78,121,.24), inset 0 -5px 16px rgba(32,146,181,.09);
}
.washer-panel { position: absolute; top: 0; left: 0; right: 0; height: 54px; display: flex; align-items: center; gap: 8px; padding: 0 17px; border-bottom: 1px solid rgba(26,133,177,.15); }
.washer-panel span { width: 80px; height: 11px; border-radius: 6px; background: linear-gradient(90deg, #a7dbe8, #d9f3f4); }
.washer-panel i { width: 9px; height: 9px; margin-left: auto; border-radius: 50%; background: #22bbc1; box-shadow: 0 0 0 4px rgba(34,187,193,.11); }
.washer-panel i + i { margin-left: 3px; background: #56a6d4; }
.washer-door { width: 146px; height: 146px; margin: 14px auto 0; padding: 11px; border-radius: 50%; background: linear-gradient(145deg, #e8fbff, #8cccdc); box-shadow: inset 0 0 0 2px rgba(26,113,152,.15), 0 8px 22px rgba(31,114,145,.18); }
.washer-glass { position: relative; width: 100%; height: 100%; overflow: hidden; border: 5px solid rgba(255,255,255,.76); border-radius: 50%; background: radial-gradient(circle at 35% 25%, #bff6f4, #389fc2 58%, #176d9d); }
.washer-glass::before { content: ""; position: absolute; inset: 15px; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; }
.wash-wave { position: absolute; left: -12%; right: -12%; bottom: -7%; height: 59%; border-radius: 42% 54% 0 0; background: linear-gradient(180deg, rgba(117,235,236,.88), rgba(23,137,190,.95)); transform: rotate(-8deg); animation: wash-slosh 4s ease-in-out infinite; }
@keyframes wash-slosh { 0%, 100% { transform: rotate(-8deg) translateY(0); } 50% { transform: rotate(8deg) translateY(-5px); } }
.foam { position: absolute; z-index: 2; display: block; border-radius: 50%; background: rgba(255,255,255,.88); box-shadow: 7px 4px 0 -2px rgba(255,255,255,.67), 12px -2px 0 -4px rgba(255,255,255,.75); }
.foam-one { width: 13px; height: 13px; left: 24px; bottom: 45px; }
.foam-two { width: 10px; height: 10px; right: 30px; bottom: 58px; }
.foam-three { width: 8px; height: 8px; left: 61px; bottom: 35px; }
.clean-sparkle { position: absolute; color: rgba(255,255,255,.92); text-shadow: 0 0 18px rgba(255,255,255,.7); animation: sparkle 2.8s ease-in-out infinite; }
.sparkle-one { left: 12%; top: 27%; font-size: 24px; }
.sparkle-two { right: 11%; top: 18%; font-size: 31px; animation-delay: -.9s; }
.sparkle-three { right: 17%; bottom: 17%; font-size: 18px; animation-delay: -1.8s; }
@keyframes sparkle { 0%, 100% { opacity: .48; transform: scale(.85) rotate(0); } 50% { opacity: 1; transform: scale(1.15) rotate(16deg); } }
.login-values { position: relative; z-index: 2; display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.login-values span { padding: 7px 12px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: rgba(255,255,255,.89); background: rgba(255,255,255,.09); font-size: 12px; }
.login-form { padding: 54px 46px 30px; display: grid; gap: 16px; align-content: center; background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,251,253,.96)); }
.login-form-heading { margin-bottom: 11px; }
.login-form-heading h2 { margin: 2px 0 8px; color: #123f5b; font-size: 28px; letter-spacing: -.03em; }
.login-form-heading > p:last-child { margin: 0; color: #708793; }
.login-form label { gap: 7px; color: #315467; font-size: 13px; }
.login-form input, .login-form select { height: 48px; border-color: #c2d6df; border-radius: 11px; padding: 9px 13px; background-color: rgba(255,255,255,.90); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.login-form input:focus, .login-form select:focus { transform: translateY(-1px); box-shadow: 0 0 0 4px rgba(23,146,202,.12), 0 8px 22px rgba(30,127,172,.08); }
.login-button { margin-top: 7px; min-height: 51px; border-radius: 12px; font-size: 16px; letter-spacing: .04em; box-shadow: 0 13px 28px rgba(24,132,190,.24); transition: transform .18s ease, box-shadow .18s ease; }
.login-button:hover { transform: translateY(-2px); box-shadow: 0 17px 34px rgba(24,132,190,.30); }
.login-help { grid-column: 1 / -1; position: relative; z-index: 2; padding: 14px 28px; display: flex; justify-content: space-between; color: #55717f; background: rgba(245,251,253,.96); border-top: 1px solid #dbe9ef; }
.login-help-brand { color: #2380ae; font-weight: 700; letter-spacing: .05em; }

@media (prefers-reduced-motion: reduce) {
  .ambient-bubble, .wash-wave, .clean-sparkle { animation: none; }
}

.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
.topbar {
  min-height: 94px; display: grid; grid-template-columns: minmax(680px, 1fr) auto auto; align-items: stretch;
  color: white; background: linear-gradient(180deg, #3aa3e3, #258dcf); box-shadow: 0 2px 10px rgba(20,83,122,.18);
}
.topbar-nav { display: flex; min-width: 0; overflow-x: auto; }
.top-tool, .top-action {
  border: 0; color: white; background: transparent; white-space: nowrap;
  transition: background .15s ease, transform .15s ease;
}
.top-tool { min-width: 94px; padding: 12px 12px 10px; display: grid; place-items: center; gap: 4px; }
.top-tool span { font-size: 29px; line-height: 1; font-weight: 400; }
.top-tool:hover, .top-tool.active, .top-action:hover { background: rgba(255,255,255,.16); }
.top-tool:active, .top-action:active { transform: translateY(1px); }
.topbar-store { min-width: 180px; padding: 19px 15px; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; }
.topbar-store strong { font-size: 18px; }
.topbar-store span { margin-top: 4px; color: #e3f4ff; }
.topbar-actions { display: flex; padding-right: 8px; }
.top-action { min-width: 72px; padding: 8px 10px; }

.page-wrap { flex: 1; min-height: 0; padding: 12px; }
.view { display: none; animation: reveal .14s ease; }
.view.active { display: block; }
@keyframes reveal { from { opacity: .35; transform: translateY(3px); } to { opacity: 1; transform: none; } }
.view-title { min-height: 66px; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.view-title h2 { margin: 0; color: #146fa9; font-size: 27px; }
.view-title p:not(.eyebrow) { margin: 5px 0 0; color: var(--muted); }

.panel { border: 1px solid var(--blue-border); background: var(--surface); box-shadow: 0 3px 10px rgba(33,100,139,.05); }
.panel > h3, .panel-heading { margin: 0; min-height: 34px; padding: 7px 10px; color: #146fa9; background: var(--blue-light); font-size: 15px; font-weight: 750; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; }
.panel-heading h3 { margin: 0; font-size: 15px; }
.count-badge { min-width: 25px; padding: 2px 7px; text-align: center; color: white; background: var(--blue); border-radius: 999px; font-size: 12px; }
.button { min-height: 38px; padding: 8px 16px; border: 1px solid #93adbc; border-radius: 4px; color: #244451; background: linear-gradient(#fff, #eef4f7); font-weight: 650; }
.button:hover { filter: brightness(.98); border-color: #5e91ad; }
.button.primary { border-color: #1679b7; color: white; background: linear-gradient(#35a3e4, #1884c7); }
.button.settle { min-height: 46px; border-color: #e39a20; color: #3b2b08; background: linear-gradient(#ffc65b, #f6aa29); font-size: 17px; font-weight: 800; }
.button.wide { width: 100%; }
.recharge-action-button { display: grid; gap: 3px; min-height: 58px; margin-top: 6px; padding: 10px 18px; text-align: left; }
.recharge-action-button strong { font-size: 16px; line-height: 1.35; }
.recharge-action-button small { color: rgba(255,255,255,.86); font-size: 12px; font-weight: 500; line-height: 1.35; }
.recharge-action-secondary { border-color: #9eb6c3; color: #244451; background: linear-gradient(#fff, #eef4f7); }
.recharge-action-secondary small { color: #607985; }
.link-button { border: 0; color: var(--blue-dark); background: transparent; font-weight: 700; }
.inline-form, .toolbar-form { display: flex; align-items: end; gap: 10px; }
.inline-form { padding: 12px; }
.inline-form input { flex: 1; }
.toolbar-form { padding: 14px; background: #f7fbfd; border-bottom: 1px solid #d6e6ee; }
.toolbar-form label { min-width: 160px; }
.toolbar-form .grow { flex: 1; }
.input-action { display: flex; }
.input-action input { border-radius: 4px 0 0 4px; }
.input-action button { border: 1px solid #93adbc; border-left: 0; border-radius: 0 4px 4px 0; background: #edf5f8; min-width: 54px; }

.dashboard-grid { display: grid; grid-template-columns: 295px 335px minmax(420px, 1fr); gap: 10px; min-height: calc(100vh - 139px); }
.dashboard-left { display: grid; grid-template-rows: auto 1fr auto; gap: 10px; min-width: 0; }
.quick-panel .inline-form { align-items: center; }
.notice-panel { padding-bottom: 14px; }
.notice-panel > .check-row, .notice-panel > .notice-field,
.notice-panel > .sms-send-button, .notice-panel > .sms-status { margin-left: 13px; margin-right: 13px; }
.notice-field { margin-top: 10px; gap: 5px; color: #58707c; font-size: 13px; }
.notice-field input, .notice-field textarea { width: 100%; margin: 0; color: #314b59; }
.notice-field textarea[readonly] { background: #f7fafb; }
.sms-send-button { width: calc(100% - 26px); margin-top: 11px; }
.sms-status { min-height: 38px; margin-top: 10px; margin-bottom: 0; padding: 8px 9px; border-radius: 4px; line-height: 1.55; color: #637783; background: #f1f6f8; }
.sms-status.ready { color: #18713e; background: #eaf7ef; }
.sms-status.error { color: #a33939; background: #fff0f0; }
.check-row { display: flex; gap: 22px; padding-top: 12px; }
.check-row label { display: flex; align-items: center; gap: 5px; }
.check-row input { width: auto; min-height: 0; }
.reminder-panel ul { margin: 10px 12px 13px; padding-left: 20px; color: #5e7480; line-height: 1.8; }
.common-panel { padding-bottom: 18px; }
.common-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin: 20px 18px; }
.common-button { min-height: 86px; padding: 8px 3px; display: grid; gap: 5px; place-items: center; border: 1px solid #c8d8df; border-radius: 4px; background: #fff; color: #344b56; }
.common-button span { font-size: 31px; line-height: 1; }
.common-button.green span { color: var(--green); }.common-button.orange span { color: var(--orange); }.common-button.blue span { color: #397ebe; }.common-button.gold span { color: #dba300; }
.member-lookup { display: grid; grid-template-columns: 1fr auto; gap: 7px; margin: 0 18px 18px; align-items: end; }
.member-info { margin: 0 18px; padding: 15px; border-top: 1px solid #d9e5eb; line-height: 1.7; }
.member-info-grid { display: grid; grid-template-columns: 82px 1fr; gap: 7px; }
.member-info-grid span:nth-child(odd) { color: #667b86; }
.empty-state { color: #7a8c94; text-align: center; padding: 30px 15px; }
.dashboard-lists { display: grid; grid-template-rows: 1fr 1fr; gap: 10px; min-width: 0; }
.table-panel { min-height: 0; display: flex; flex-direction: column; }
.table-panel .table-scroll { flex: 1; }

.table-scroll { width: 100%; overflow: auto; }
.table-scroll.tall { max-height: calc(100vh - 255px); min-height: 380px; }
table { width: 100%; border-collapse: collapse; background: white; }
th, td { padding: 9px 9px; border: 1px solid #d5e1e7; text-align: left; white-space: nowrap; }
th { position: sticky; top: 0; z-index: 1; color: #3d5663; background: #eef5f8; font-weight: 700; }
tbody tr:hover { background: #f1f9fd; }
tbody tr.selected { background: #dff1fc; outline: 1px solid #58aee2; }
.empty-row td { height: 95px; color: #7a8d97; text-align: center; }
.row-button { padding: 5px 9px; border: 1px solid #8db7cf; border-radius: 3px; color: #156eaa; background: #edf8fe; }
.danger-row { color: #b33434; }

.service-tabs { display: flex; gap: 5px; margin-bottom: 10px; padding: 7px; overflow-x: auto; border: 1px solid var(--blue-border); background: var(--blue-light); }
.service-tabs button { min-width: 76px; padding: 9px 13px; border: 1px solid transparent; border-radius: 3px; color: #25617f; background: transparent; white-space: nowrap; }
.service-tabs button.active { border-color: #4aa7df; color: white; background: var(--blue); }
.receive-layout { display: grid; grid-template-columns: 360px minmax(440px, 1fr) 280px; gap: 12px; }
.receive-entry, .customer-card { min-width: 0; padding-bottom: 15px; }
.receive-entry > label, .receive-entry > .form-grid, .receive-entry > button, .receive-entry > .evidence-capture, .customer-card > label, .customer-card > div:not(.order-total) { margin-left: 14px; margin-right: 14px; }
.receive-entry > label, .customer-card > label { margin-top: 13px; }
.form-grid { display: grid; gap: 13px 14px; }
.form-grid.two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin-top: 14px; }
.form-grid.two > label { min-width: 0; align-content: start; }
.form-grid.two > .form-field-wide { grid-column: 1 / -1; }
.receive-entry input { min-width: 0; min-height: 42px; }
.field-hint { display: block; min-height: 16px; color: #6b7f89; font-size: 11px; font-weight: 500; line-height: 1.4; }
.color-input-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 88px; gap: 8px; }
.color-input-wrap input { min-width: 0; }
.receive-entry .color-picker-trigger { width: 88px; min-width: 0; margin: 0; padding: 6px 8px; color: #146fa9; border-color: #78b7d9; background: #eef9ff; white-space: nowrap; }
.brand-input-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 88px; gap: 8px; }
.brand-input-wrap input { min-width: 0; }
.receive-entry .brand-picker-trigger { width: 88px; min-width: 0; margin: 0; padding: 6px 8px; color: #6f4c15; border-color: #cfb36c; background: #fff9e9; white-space: nowrap; }
.condition-input-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 88px; gap: 8px; }
.condition-input-wrap input { min-width: 0; cursor: pointer; background: #fff; }
.receive-entry .condition-picker-trigger { width: 88px; min-width: 0; margin: 0; padding: 6px 8px; color: #7a4d13; border-color: #d8ad55; background: #fff9e9; white-space: nowrap; }
.receive-entry > .button { width: calc(100% - 28px); margin-top: 14px; }
.receive-entry .evidence-capture { margin-top: 15px; padding: 12px; border: 1px dashed #77b9df; border-radius: 6px; background: #f3faff; }
.receive-entry .evidence-capture .button { width: calc(50% - 4px); margin: 0; padding-left: 6px; padding-right: 6px; }
.receive-entry .evidence-capture .camera-button { color: white; border-color: #1679b7; background: linear-gradient(#35a3e4, #1884c7); }
.additional-service-picker { margin: 12px; padding: 10px; border: 1px solid #b9d9e9; border-radius: 5px; background: #f6fbfe; }
.additional-service-picker > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 8px 0; }
.additional-service-picker label { display: flex; align-items: center; gap: 6px; padding: 6px; border: 1px solid #d7e8f1; border-radius: 4px; background: white; }
.additional-service-picker input { width: auto; }
.evidence-capture p { margin: 8px 0 0; color: #426575; font-size: 12px; line-height: 1.45; }
.pending-evidence-preview { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }
.pending-evidence-preview:empty { display: none; }
.pending-evidence-preview figure { position: relative; aspect-ratio: 1; margin: 0; border-radius: 4px; overflow: hidden; background: #dcecf4; }
.pending-evidence-preview img { width: 100%; height: 100%; object-fit: cover; }
.pending-evidence-preview button { position: absolute; top: 3px; right: 3px; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; color: white; background: rgba(155,34,34,.9); font-size: 18px; line-height: 24px; }
.receive-draft { min-width: 0; }
.receive-draft .table-scroll { max-height: 570px; }
.item-details { margin-top: 3px; color: #637986; font-size: 11px; white-space: normal; }
.ticket-display-number { color: #075f99; font-size: 16px; letter-spacing: 1px; white-space: nowrap; }
.ticket-full-number { color: #637986; font-size: 11px; white-space: nowrap; }
.selected-member { margin-top: 10px; padding: 10px; border: 1px solid #e5c867; border-radius: 4px; color: #71623e; background: #fffbed; line-height: 1.6; }
.order-total { margin: 16px 12px 10px; padding-top: 11px; display: flex; justify-content: space-between; align-items: end; border-top: 1px solid #e1d7af; color: #427151; }
.order-total strong { color: var(--green); font-size: 27px; }
.price-adjustment-panel { margin: 12px; padding: 11px; border: 1px solid #dfc36c; border-radius: 5px; background: #fffbee; }
.price-adjustment-panel .calculated-total { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; color: #5c6e77; }
.price-adjustment-panel .calculated-total strong { color: #263d49; font-size: 18px; }
.price-adjustment-panel label { margin: 8px 0 0; }
.price-adjustment-input { display: grid; grid-template-columns: auto 1fr auto; align-items: stretch; margin-top: 4px; }
.price-adjustment-input span { display: grid; place-items: center; min-width: 32px; border: 1px solid #9fb4bf; border-right: 0; border-radius: 4px 0 0 4px; background: #edf5f8; font-weight: 800; }
.price-adjustment-input input { margin: 0; border-radius: 0; font-size: 18px; font-weight: 800; }
.price-adjustment-input button { min-width: 54px; border: 1px solid #9fb4bf; border-left: 0; border-radius: 0 4px 4px 0; background: #edf5f8; color: #176a98; font-weight: 800; }
.price-adjustment-difference { margin-top: 8px; color: #5e7079; font-size: 13px; }
.price-adjustment-difference.adjusted { color: #b34735; font-weight: 800; }
.customer-card > .button { width: calc(100% - 24px); margin-left: 12px; }
.selection-bar { min-height: 68px; padding: 10px 15px; display: flex; justify-content: space-between; align-items: center; gap: 15px; border-top: 1px solid #e4c563; background: #fffced; }
.pickup-quick-bar { position: sticky; top: 0; z-index: 5; min-height: 66px; padding: 9px 14px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid #86c9ec; background: linear-gradient(90deg,#eaf8ff,#f7fcff); box-shadow: 0 3px 9px rgba(31,111,155,.14); }
.pickup-quick-bar[hidden] { display: none; }
.pickup-quick-summary { min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: baseline; gap: 2px 10px; }
.pickup-quick-summary > span { color: #477184; font-size: 12px; font-weight: 750; }
.pickup-quick-summary > strong { overflow: hidden; color: #075f99; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.pickup-quick-summary > small { grid-column: 1 / -1; overflow: hidden; color: #536f7d; text-overflow: ellipsis; white-space: nowrap; }
.pickup-quick-actions,.pickup-row-actions { display: flex; align-items: center; gap: 7px; }
.pickup-debt-summary { margin: 12px 0; padding: 14px; border: 1px solid #b9d9e9; border-radius: 12px; background: linear-gradient(135deg,#f8fcff,#fff); box-shadow: 0 3px 12px rgba(35,105,135,.08); }
.pickup-debt-summary[hidden] { display: none; }
.pickup-debt-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.pickup-debt-heading h3 { margin: 2px 0 4px; color: #075f99; font-size: 18px; }
.pickup-debt-heading p:not(.eyebrow) { margin: 0; color: #607b88; font-size: 12px; }
.pickup-debt-total { align-self: center; color: #075f99; font-size: 24px; white-space: nowrap; }
.pickup-debt-total.history-danger { color: #b23b3b; }
.pickup-debt-cards { display: grid; grid-template-columns: repeat(4,minmax(130px,1fr)); gap: 8px; margin: 12px 0; }
.pickup-debt-cards article { padding: 9px 11px; border: 1px solid #d8e7ed; border-radius: 8px; background: #fff; }
.pickup-debt-cards article.history-danger { border-color: #e6a5a5; background: #fff5f5; }
.pickup-debt-cards span { display: block; color: #6b818a; font-size: 12px; }
.pickup-debt-cards strong { display: block; margin-top: 3px; color: #174f66; font-size: 17px; }
.pickup-debt-cards .history-danger strong { color: #b23b3b; }
.pickup-debt-empty { padding: 12px; color: #607b88; font-size: 13px; }
@media (max-width: 900px) { .pickup-debt-heading { flex-direction: column; gap: 8px; }.pickup-debt-total { align-self: flex-start; }.pickup-debt-cards { grid-template-columns: repeat(2,minmax(130px,1fr)); } }
.pickup-photo-button,.pickup-row-photo,.pickup-item-photo { color: white; border-color: #1684c5; background: linear-gradient(#32a6e6,#1688ca); font-weight: 800; }
.pickup-photo-button:disabled { color: #718793; border-color: #bacbd4; background: #eef3f5; cursor: default; }
.pickup-no-photo { color: #81939c; font-size: 12px; }
#pickupOrdersBody tr[data-order-id] { cursor: pointer; }
#pickupOrdersBody tr[data-order-id]:focus-within { outline: 2px solid #3ca5df; outline-offset: -2px; }
.pickup-order-detail-modal { width: min(1480px, calc(100% - 24px)); max-height: calc(100vh - 20px); }
.pickup-detail-picker { flex: 0 0 auto; margin: 0 18px 12px; border: 1px solid #79bddd; border-radius: 6px; overflow: hidden; background: #f8fcfe; box-shadow: 0 4px 14px rgba(31,111,155,.1); }
.pickup-detail-picker .workflow-picker-heading { padding: 10px 13px; background: #e9f7fd; }
.pickup-detail-picker > .member-choice-help { margin: 0; padding: 8px 13px; border-top: 1px solid #c6e2ef; border-bottom: 1px solid #c6e2ef; }
.pickup-detail-picker .table-scroll { max-height: 235px; }
.pickup-detail-picker th,.pickup-detail-picker td { white-space: nowrap; }
.pickup-quantity-stepper { display: grid; grid-template-columns: 32px 56px 32px; align-items: stretch; }
.pickup-quantity-stepper button { border: 1px solid #8ebed5; color: #126d9e; background: #edf8fd; font-size: 17px; font-weight: 800; cursor: pointer; }
.pickup-quantity-stepper button:first-child { border-radius: 4px 0 0 4px; }
.pickup-quantity-stepper button:last-child { border-radius: 0 4px 4px 0; }
.pickup-quantity-stepper input { width: 56px; min-width: 0; padding: 5px 3px; border-width: 1px 0; border-radius: 0; text-align: center; font-weight: 800; }
.pickup-quantity-stepper input:disabled,.pickup-quantity-stepper input:disabled + button { opacity: .45; cursor: default; }
.pickup-detail-action-bar { min-height: 54px; padding: 7px 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid #bedce9; background: #fffbed; }
.pickup-detail-action-bar .payment-total-hint { flex: 1; margin: 0; }
.pickup-detail-action-bar .button { min-width: 170px; }
.pickup-order-detail { min-width: 0; min-height: 0; flex: 1 1 auto; margin: 0 18px 18px; overflow: auto; overscroll-behavior: contain; }
.pickup-order-detail .history-detail-section .table-scroll { max-height: none; overflow-x: auto; overflow-y: visible; }
.member-list-scroll { max-height: 300px; min-height: 170px; }
.member-history-panel { border-top: 1px solid #9fc8de; background: #f8fcfe; }
.member-history-tabs { display: flex; gap: 5px; padding: 10px 14px 0; border-bottom: 1px solid #9fc8de; background: #eaf6fc; }
.member-history-tabs button { min-width: 150px; padding: 10px 18px; border: 1px solid #9fc8de; border-bottom: 0; border-radius: 5px 5px 0 0; color: #286a8d; background: #f5fbfe; font-weight: 750; }
.member-history-tabs button.active { color: white; border-color: #238fd3; background: #238fd3; }
.member-history-pane { display: none; padding-bottom: 14px; }.member-history-pane.active { display: block; }
.member-history-heading { padding: 14px 16px 8px; display: flex; justify-content: space-between; align-items: end; gap: 15px; }
.member-history-heading h3 { margin: 2px 0 0; color: #176f9f; font-size: 20px; }.member-history-heading > p { margin: 0; color: #647b87; font-size: 12px; }
.member-history-filter { padding: 10px 16px 14px; display: flex; align-items: end; gap: 10px; border-bottom: 1px solid #d5e6ee; }
.member-history-filter label { display: grid; gap: 5px; min-width: 132px; color: #425f6e; font-size: 12px; font-weight: 700; }.member-history-filter .grow { flex: 1; min-width: 230px; }
.member-history-summary { padding: 12px 16px; display: grid; grid-template-columns: repeat(6, minmax(120px, 1fr)); gap: 8px; }
.member-history-summary article { min-height: 68px; padding: 10px 12px; border: 1px solid #bfd5e0; background: white; }.member-history-summary span { display: block; color: #667d88; font-size: 12px; }.member-history-summary strong { display: block; margin-top: 5px; color: #183846; font-size: 18px; }
.member-history-summary .history-warning { border-color: #e6bd73; background: #fff9eb; }.member-history-summary .history-danger { border-color: #df9898; background: #fff3f3; }
.member-history-split { display: grid; grid-template-rows: minmax(205px, auto) minmax(220px, auto); gap: 12px; padding: 0 16px; }
.member-history-list, .member-order-detail { min-width: 0; border: 1px solid #bfd5e0; background: white; }
.member-history-list .table-scroll { max-height: 310px; }.member-history-list tbody tr { cursor: pointer; }
.history-pagination { min-height: 46px; padding: 7px 10px; display: flex; justify-content: center; align-items: center; gap: 13px; border-top: 1px solid #d8e6ed; background: #f6fafc; }.history-pagination span { min-width: 180px; text-align: center; color: #526d7a; }
.history-pagination .button { padding: 6px 14px; }.history-pagination .button:disabled { cursor: not-allowed; opacity: .45; }
.member-order-detail { overflow: hidden; }.member-order-detail > .empty-state { min-height: 200px; display: grid; place-items: center; }
.history-detail-heading { padding: 12px 14px; display: flex; justify-content: space-between; gap: 15px; color: #1d6489; background: #edf8fd; border-bottom: 1px solid #bfd5e0; }.history-detail-heading h4 { margin: 0 0 4px; font-size: 18px; }.history-detail-heading p { margin: 0; color: #5b7480; font-size: 12px; }.history-detail-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.history-detail-grid { padding: 11px 14px; display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: 8px; border-bottom: 1px solid #dce8ed; }.history-detail-grid div { padding: 8px 10px; border: 1px solid #d6e3e9; background: #fbfdfe; }.history-detail-grid span { display: block; color: #6b7e88; font-size: 11px; }.history-detail-grid strong { display: block; margin-top: 3px; color: #243e4b; }
.history-detail-section h5 { margin: 0; padding: 9px 13px; color: #287aa5; background: #f3f9fc; border-bottom: 1px solid #d8e6ed; }.history-detail-section .table-scroll { max-height: 240px; }
.history-status { display: inline-block; padding: 3px 7px; border-radius: 10px; color: #216a8f; background: #e8f5fb; font-size: 11px; font-weight: 750; }.history-status.cancelled { color: #9b3e3e; background: #fdecec; }.history-source { color: #9a641d; font-weight: 700; }
.reconciliation-issue-button { margin: 12px 0; padding: 9px 13px; border: 1px solid #d7a33d; border-radius: 5px; color: #9d2e1d; background: #fff4df; font-weight: 800; cursor: pointer; }
.reconciliation-issue-button:disabled { border-color: #cbd8de; color: #5f7885; background: #f4f8fa; cursor: default; }
.reconciliation-issue-link { padding: 3px 6px; border: 1px solid #e0a49a; border-radius: 4px; color: #b33434; background: #fff4f1; font-weight: 700; cursor: pointer; }
.reconciliation-issue-link:hover,.reconciliation-issue-link:focus-visible { color: #8e211f; border-color: #b33434; background: #ffe9e5; outline: 2px solid rgba(179,52,52,.18); outline-offset: 1px; }
.modal.reconciliation-issues-modal { width: min(1280px, calc(100% - 24px)); }
#reconciliationIssueRows tr[data-reconciliation-order-id] { cursor: pointer; }
#reconciliationIssueRows tr[data-reconciliation-order-id]:hover,#reconciliationIssueRows tr[data-reconciliation-order-id]:focus-visible { background: #eaf7ff; outline: 2px solid rgba(33,143,201,.28); outline-offset: -2px; }
.reconciliation-order-link { padding: 5px 8px; border: 1px solid #76b6d8; border-radius: 4px; color: #126b9d; background: #eef8fd; font: inherit; font-weight: 750; white-space: nowrap; cursor: pointer; }
.reconciliation-order-link small { display: block; margin-top: 2px; color: #507686; font-size: 10px; font-weight: 650; }
.reconciliation-order-link:hover,.reconciliation-order-link:focus-visible { color: #0b5680; border-color: #218fc9; background: #dff3fd; outline: 2px solid rgba(33,143,201,.2); outline-offset: 1px; }
.ledger-scroll { max-height: 520px; margin: 0 16px; border: 1px solid #bfd5e0; }.change-positive { color: #168148; font-weight: 750; }.change-negative { color: #b44738; font-weight: 750; }

.report-grid { display: grid; grid-template-columns: repeat(4, minmax(170px, 1fr)); gap: 12px; }
.report-card { min-height: 126px; padding: 18px; border: 1px solid #a9c3d2; background: white; }
.report-card.blue { border-color: #58b1e5; background: #eaf7ff; }.report-card.green { border-color: #83c778; background: #f0fbec; }.report-card.gold { border-color: #e2b746; background: #fff9e9; }.report-card.red { border-color: #dd8e8e; background: #fff1f1; }
.report-card span { color: #445965; }
.report-card strong { display: block; margin-top: 8px; font-size: 29px; color: #0d1820; }
.report-card[data-report-metric] { position: relative; cursor: pointer; transition: transform .14s ease, box-shadow .14s ease; }
.report-card[data-report-metric]::after { content: "查看明细 ›"; position: absolute; right: 14px; bottom: 10px; color: #247cac; font-size: 12px; font-weight: 700; }
.report-card[data-report-metric]:hover, .report-card[data-report-metric]:focus-visible { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(31,108,150,.14); outline: 2px solid #48aadd; outline-offset: -2px; }
.finance-report-panel { margin-top: 14px; }
.panel-actions { display: flex; gap: 8px; }
.daily-closing-panel { margin-top: 14px; }
.daily-closing-panel .panel-actions { align-items: end; flex-wrap: wrap; }
.daily-closing-panel .panel-actions label { display: grid; gap: 4px; color: #496673; font-size: 12px; font-weight: 700; }
.daily-closing-panel .panel-actions input { min-height: 36px; }
.daily-closing-sheet { margin: 0 16px 18px; border: 1px solid #8fa9b6; background: #fffef8; box-shadow: 0 4px 14px rgba(42,73,88,.08); }
.daily-closing-title { display: flex; justify-content: space-between; align-items: end; gap: 18px; padding: 14px 18px 11px; border-bottom: 2px solid #6c7f88; }
.daily-closing-title strong { color: #1c4052; font-size: 20px; }.daily-closing-title span { color: #5e7078; }
.daily-closing-columns { display: grid; grid-template-columns: 1fr 1fr; }
.daily-closing-card { min-height: 440px; padding: 18px 22px; }.daily-closing-card + .daily-closing-card { border-left: 1px solid #8fa9b6; }
.daily-closing-card h4 { margin: 0 0 16px; color: #183b4c; text-align: center; font-size: 20px; }.daily-closing-card h5 { margin: 17px 0 7px; padding-top: 10px; border-top: 1px dashed #a2adb2; color: #31586b; font-size: 15px; }
.daily-closing-card dl { margin: 0; }.daily-closing-card dl div,.daily-closing-payments div { display: flex; justify-content: space-between; gap: 15px; padding: 5px 0; }.daily-closing-card dt { color: #485d67; }.daily-closing-card dd { margin: 0; color: #192e38; font-weight: 750; }
.daily-closing-total { display: flex; justify-content: space-between; margin-top: 18px; padding-top: 11px; border-top: 2px solid #506873; color: #15394b; font-size: 18px; }.daily-closing-total strong { font-size: 20px; }
.daily-closing-integrity { margin-top: 22px; }.daily-closing-ok { color: #177245; font-weight: 800; }.daily-closing-warning { color: #b42318; font-weight: 800; }
.daily-closing-issue-link { padding: 7px 10px; border: 1px solid #df9b8e; border-radius: 5px; background: #fff4f1; cursor: pointer; }
.daily-closing-issue-link:hover,.daily-closing-issue-link:focus-visible { color: #8e211f; border-color: #b33434; background: #ffe9e5; outline: 2px solid rgba(179,52,52,.18); outline-offset: 2px; }
.finance-filter { padding: 15px 16px 8px; display: grid; grid-template-columns: repeat(4, minmax(135px, .75fr)) minmax(220px, 1.4fr) auto; gap: 10px; align-items: end; }
.finance-filter label { display: grid; gap: 5px; color: #425f6e; font-size: 13px; font-weight: 700; }
.quick-range { padding: 0 16px 13px; display: flex; gap: 7px; border-bottom: 1px solid #d7e7ee; }
.quick-range button, .payment-summary-button { border: 1px solid #a9cbdc; border-radius: 5px; color: #216f9b; background: #f4fbff; cursor: pointer; }
.quick-range button { padding: 7px 13px; }
.quick-range button:hover, .payment-summary-button:hover { border-color: #2c9bd5; background: #eaf7fe; }
.finance-summary-grid { padding: 15px 16px; display: grid; grid-template-columns: repeat(6, minmax(125px, 1fr)); gap: 10px; }
.finance-summary-card { min-height: 84px; padding: 13px; border: 1px solid #b9d1dc; background: #fbfdfe; }
.finance-summary-card span { display: block; color: #5a727e; font-size: 13px; }.finance-summary-card strong { display: block; margin-top: 7px; color: #132a36; font-size: 21px; }
.finance-summary-card.receipt { border-color: #7bc887; background: #f1fbf2; }.finance-summary-card.warning { border-color: #e3bd6d; background: #fff9eb; }
.finance-columns { padding: 0 16px 16px; display: grid; grid-template-columns: minmax(280px, .8fr) minmax(520px, 1.5fr); gap: 14px; }
.finance-columns > section { min-width: 0; border: 1px solid #d2e3ea; background: #fff; }.finance-columns h4 { margin: 0; padding: 11px 13px; color: #267ba9; background: #edf8fd; }
.payment-summary-list { padding: 10px; display: grid; gap: 7px; }
.payment-summary-button { padding: 9px 11px; display: flex; justify-content: space-between; align-items: center; text-align: left; }
.payment-summary-button.active { color: white; border-color: #218fc9; background: #218fc9; }
.subheading { border-top: 1px solid #d7e7ee; }
.modal.report-detail-modal { width: min(1180px, calc(100% - 24px)); }
.modal.report-detail-modal[open],.modal.reconciliation-issues-modal[open] { display: flex; flex-direction: column; overflow: hidden; }
.modal.report-detail-modal > .modal-heading,.modal.reconciliation-issues-modal > .modal-heading,.modal.report-detail-modal > .member-choice-help,.modal.reconciliation-issues-modal > .member-choice-help { flex: 0 0 auto; }
.report-detail-scroll { width: auto; min-width: 0; min-height: 0; max-height: none; flex: 1 1 auto; margin: 0 18px 18px; overflow: auto; overscroll-behavior: contain; }
.modal.receive-drafts-modal { width: min(1320px, calc(100% - 24px)); height: min(880px, calc(100dvh - 32px)); max-height: calc(100dvh - 32px); padding: 0; color: #223e50; }
.draft-list-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 16px; }
.draft-list-heading h2 { margin: 4px 0 8px; font-size: 24px; }
.draft-list-heading p { margin: 0; color: #617888; font-size: 13px; }
.draft-list-tools { flex: 0 0 auto; display: flex; align-items: flex-end; gap: 16px; padding: 0 24px 16px; border-bottom: 1px solid #d7e5ee; }
.draft-list-tools label { display: grid; gap: 6px; flex: 1; max-width: 430px; font-size: 13px; font-weight: 700; }
.draft-list-tools input { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1px solid #afc5d4; border-radius: 6px; }
.draft-list-tools > span { flex: 1; font-size: 13px; color: #617888; padding-bottom: 10px; }
.draft-browser { display: grid; grid-template-columns: 340px minmax(0, 1fr); flex: 1; min-height: 0; }
#receiveDraftList { padding: 14px; overflow: auto; background: #f2f6fa; border-right: 1px solid #d7e5ee; overscroll-behavior: contain; }
.draft-select-card { display: block; width: 100%; padding: 16px; margin-bottom: 10px; text-align: left; border: 1px solid #d2dfe8; border-radius: 8px; background: white; color: #223e50; cursor: pointer; }
.draft-select-card:hover { border-color: #278ac2; background: #f7fcff; }
.draft-select-card.selected { border: 2px solid #167eB5; padding: 15px; background: #edf8ff; box-shadow: 0 2px 8px #12699b14; }
.draft-select-card:focus-visible { outline: 3px solid #62b6e7; outline-offset: 2px; }
.draft-card-top,.draft-card-bottom { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.draft-card-top strong { font-size: 18px; overflow-wrap: anywhere; }
.draft-card-top > span { font-size: 12px; padding: 3px 7px; background: #e9f2f7; border-radius: 4px; white-space: nowrap; }
.draft-card-phone { display: block; font-size: 18px; font-weight: 700; letter-spacing: .5px; margin: 10px 0; overflow-wrap: anywhere; }
.draft-card-meta { display: block; margin: 6px 0; font-size: 12px; color: #607889; }
.draft-card-bottom { border-top: 1px solid #e4edf3; margin-top: 12px; padding-top: 12px; font-size: 12px; }
.draft-card-bottom b { color: #167eB5; white-space: nowrap; }
#receiveDraftPreview { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: white; }
.draft-preview-empty { padding: 40px 24px; color: #647c8b; text-align: center; line-height: 1.8; margin: auto 0; }
.draft-preview-empty strong { font-size: 20px; color: #345267; }
.draft-preview-header { flex: 0 0 auto; padding: 12px 24px; border-bottom: 1px solid #e2ebf1; background: #f9fcfe; }
.draft-preview-header > span,.draft-preview-header p { font-size: 12px; color: #5e7686; }
.draft-preview-header > span { display: block; }
.draft-preview-header p { margin: 4px 0; }
.draft-preview-header h3 { display: inline-block; margin: 8px 18px 8px 0; font-size: 24px; }
.draft-preview-header small { font-size: 12px; padding: 4px 8px; color: #126b9b; background: #e1f1fa; vertical-align: middle; }
.draft-preview-phone { font-size: 23px; letter-spacing: 1px; }
.draft-preview-content { flex: 1; overflow: auto; min-height: 0; padding: 16px 24px; overscroll-behavior: contain; }
.draft-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; margin: 0 0 14px; }
.draft-facts dt { color: #718594; font-size: 12px; margin-bottom: 4px; }
.draft-facts dd { margin: 0; font-size: 14px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.draft-summary { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 14px; background: #eef7fd; border-radius: 6px; font-size: 14px; }
.draft-summary b { font-size: 18px; color: #1379b0; }
.draft-preview-content h4 { margin: 18px 0 12px; font-size: 15px; }
.draft-garment { border: 1px solid #dae5ed; border-radius: 7px; padding: 14px; margin-bottom: 12px; }
.draft-garment-heading { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.draft-garment-heading > span,.draft-muted { color: #69808f; font-size: 12px; }
.draft-photo-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.draft-photo-strip img { width: 140px; height: 116px; object-fit: contain; border: 1px solid #d5e3ec; border-radius: 5px; background: #f4f7fa; }
.draft-pending { padding: 14px; background: #fff9ed; border: 1px solid #ecd39e; border-radius: 7px; }
.draft-pending h4 { margin-top: 0; color: #805617; }
.draft-pending > p { font-size: 13px; }
.draft-preview-actions { flex: 0 0 auto; padding: 12px 24px 16px; border-top: 1px solid #d7e5ee; background: #f9fcfe; }
.draft-preview-actions p { font-size: 13px; margin: 0 0 10px; overflow-wrap: anywhere; }
.draft-preview-actions > div { display: flex; justify-content: space-between; gap: 12px; }
@media (max-width: 760px) {
  .draft-browser { grid-template-columns: 1fr; overflow: auto; display: block; }
  #receiveDraftList { max-height: 220px; border-right: 0; border-bottom: 1px solid #d7e5ee; }
  #receiveDraftPreview { min-height: 260px; }
  .draft-preview-content { overflow: visible; }
  .draft-list-tools { flex-wrap: wrap; gap: 8px; }
  .draft-list-tools label { flex-basis: 100%; max-width: none; }
  .draft-list-heading,.draft-preview-header,.draft-preview-content,.draft-preview-actions { padding-left: 16px; padding-right: 16px; }
  .draft-facts { grid-template-columns: 1fr; }
  .draft-list-heading h2 { font-size: 20px; }
}
.reconciliation-order-issue { flex: 0 0 auto; margin: 12px 18px; padding: 11px 13px; border: 1px solid #e0ba68; border-radius: 5px; color: #704e12; background: #fff8e8; }
.reconciliation-order-issue strong { color: #9d2e1d; }.reconciliation-order-issue span { margin-left: 14px; }
.reconciliation-order-detail { min-width: 0; min-height: 0; flex: 1 1 auto; margin: 0 18px 18px; overflow: auto; overscroll-behavior: contain; }
.reconciliation-order-detail .history-detail-section .table-scroll { max-height: none; overflow-x: auto; overflow-y: visible; }
.source-legacy { color: #9a641d; font-weight: 750; }.cashier-unverified { color: #8b641f; }
.settings-tabs { display: flex; margin-bottom: 8px; border-bottom: 1px solid var(--blue-border); }
.settings-tabs button { padding: 10px 20px; border: 1px solid #a9c6d5; border-bottom: 0; background: #eef6f9; }
.settings-tabs button.active { color: white; background: var(--blue); }
.settings-pane { display: none; }.settings-pane.active { display: block; }

.release-badge { padding: 8px 12px; border: 1px solid #d7ae43; border-radius: 999px; color: #775309; background: #fff8dc; font-weight: 800; white-space: nowrap; }
.operations-grid { display: grid; grid-template-columns: repeat(2, minmax(360px, 1fr)); gap: 14px; }
.operation-domain { overflow: hidden; border: 1px solid #9ec9df; border-radius: 7px; background: #fff; box-shadow: 0 5px 16px rgba(32,104,143,.08); }
.operation-domain-heading { min-height: 78px; padding: 14px 17px; display: flex; align-items: center; gap: 14px; color: #176f9f; background: linear-gradient(135deg,#e8f7ff,#f7fcff); border-bottom: 1px solid #c9e2ee; }
.operation-domain-heading > span { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #238fd3; font-size: 25px; font-weight: 800; }
.operation-domain-heading h3 { margin: 0; font-size: 20px; }.operation-domain-heading p { margin: 4px 0 0; color: #617986; }
.operation-links { padding: 12px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.operation-links button { min-height: 52px; padding: 9px 11px; text-align: left; border: 1px solid #bad4e1; border-radius: 5px; color: #24576f; background: #f9fcfe; font-weight: 700; }
.operation-links button:hover,.operation-links button:focus-visible { border-color: #238fd3; color: #126da8; background: #eaf7fe; outline: 2px solid rgba(35,143,211,.13); }
.acceptance-note { margin-top: 14px; }.acceptance-note p { margin: 0; padding: 14px 16px; color: #526b78; line-height: 1.75; }
.feature-jumpbar { position: sticky; top: 0; z-index: 8; margin: 0 0 10px; padding: 8px; display: flex; gap: 7px; overflow-x: auto; border: 1px solid #9fcce3; background: rgba(235,248,254,.96); box-shadow: 0 3px 10px rgba(38,103,138,.08); }
.feature-jumpbar button { min-height: 36px; padding: 7px 14px; border: 1px solid #9dc6da; border-radius: 4px; color: #216a91; background: #fff; font-weight: 750; white-space: nowrap; }
.feature-jumpbar button:hover,.feature-jumpbar button:focus-visible { border-color: #238fd3; background: #e6f5fd; outline: 0; }
.feature-context-hint { margin: 0; padding: 9px 14px; border-top: 1px solid #c7dfeb; color: #4c6b7a; background: #eff9fe; line-height: 1.6; }
.section-anchor { display: block; position: relative; top: -8px; }
.feature-target-flash { animation: feature-target-flash 1.6s ease-out; }
@keyframes feature-target-flash {
  0%, 35% { box-shadow: 0 0 0 4px rgba(24, 151, 213, .34); }
  100% { box-shadow: 0 0 0 0 rgba(24, 151, 213, 0); }
}
.lifecycle-form { grid-template-columns: repeat(2,minmax(0,1fr)); }.lifecycle-form .wide { grid-column: 1 / -1; }
.lifecycle-checks { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 10px; border: 1px solid #c9dfe9; background: #f7fbfd; }
.lifecycle-checks label { display: flex; align-items: center; gap: 7px; }.lifecycle-checks input { width: auto; min-height: 0; }
.points-pane { display: none; }.points-pane.active { display: block; }.points-pane .table-scroll { max-height: 430px; margin: 16px 20px 22px; border: 1px solid #bfd5e0; }
.danger-text { color: var(--danger); font-weight: 800; }

.statusbar { min-height: 30px; padding: 5px 10px; display: flex; align-items: center; gap: 12px; color: #284957; background: #dff2fc; border-top: 1px solid #85c7ed; }
.statusbar .separator { height: 17px; width: 1px; background: #9ec3d5; }
.status-online { color: #16813c; }
.clock { margin-left: auto; }

.toast { position: fixed; z-index: 1000; top: 16px; left: 50%; transform: translate(-50%, -16px); max-width: min(520px, calc(100% - 30px)); padding: 11px 18px; border-radius: 6px; color: white; background: #265f7f; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }.toast.error { background: #b63d3d; }.toast.warning { background: #a76718; }.toast.success { background: #21844c; }
.system-alert-dialog { width: min(520px, calc(100% - 28px)); padding: 0; overflow: hidden; border: 0; border-radius: 12px; color: #243e4b; background: #fff; box-shadow: 0 32px 110px rgba(27,39,48,.46); }
.system-alert-dialog::backdrop { background: rgba(18,35,44,.58); backdrop-filter: blur(3px); }
.system-alert-heading { padding: 22px 24px 14px; display: flex; align-items: center; gap: 14px; border-bottom: 1px solid #efd1d1; background: #fff4f4; }
.system-alert-heading h2 { margin: 0; color: #9e2e2e; font-size: 22px; }.system-alert-heading .eyebrow { color: #b64a4a; }
.system-alert-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #b63d3d; font-size: 24px; font-weight: 900; box-shadow: 0 0 0 7px rgba(182,61,61,.12); }
.system-alert-dialog.warning .system-alert-heading { border-bottom-color: #ead5a5; background: #fff9eb; }.system-alert-dialog.warning .system-alert-heading h2 { color: #845810; }.system-alert-dialog.warning .system-alert-heading .eyebrow { color: #9a6a1b; }.system-alert-dialog.warning .system-alert-icon { background: #a76718; box-shadow: 0 0 0 7px rgba(167,103,24,.13); }
.system-alert-message { margin: 0; padding: 21px 24px 10px; color: #334e5a; font-size: 16px; font-weight: 700; line-height: 1.75; white-space: pre-wrap; }
.system-alert-actions { padding: 10px 24px 24px; display: flex; justify-content: flex-end; }.system-alert-actions .button { min-width: 110px; }
.field-invalid { border: 2px solid #c63737 !important; background: #fff7f7 !important; box-shadow: 0 0 0 4px rgba(198,55,55,.14) !important; }
label:has(.field-invalid) { color: #a72d2d; }.field-error-message { color: #b12f2f; font-weight: 800; line-height: 1.55; }
html:has(dialog.modal[open]),body:has(dialog.modal[open]) { overflow: hidden; }
.modal { width: min(660px, calc(100% - 26px)); max-height: calc(100vh - 30px); padding: 0; border: 0; border-radius: 10px; box-shadow: 0 30px 100px rgba(12,48,69,.34); color: var(--ink); }
.modal::backdrop { background: rgba(21,48,63,.45); backdrop-filter: blur(2px); }
.modal-close { position: absolute; top: 10px; right: 12px; width: 34px; height: 34px; border: 0; border-radius: 50%; color: #52707f; background: #edf5f8; font-size: 23px; }
.modal-heading { padding: 22px 24px 15px; border-bottom: 1px solid #d8e7ee; background: #f4fafc; }
.modal-heading h2 { margin: 0; color: #146fa9; }
.modal-form { display: grid; gap: 12px; padding: 20px 24px 24px; }
.member-edit-layout { display: flex; align-items: flex-start; gap: 20px; }
.member-photo-editor { display: flex; align-items: center; gap: 14px; padding: 12px; border: 1px dashed #86b9d3; background: #f4fbff; border-radius: 5px; }
.member-photo-editor.vertical { width: 170px; flex: 0 0 170px; flex-direction: column; text-align: center; }
.member-photo-placeholder { width: 112px; height: 132px; display: grid; place-items: center; overflow: hidden; border: 1px solid #a7bdca; border-radius: 4px; background: linear-gradient(#edf6fb,#dcebf3); color: #668397; font-weight: 700; }
.member-photo-placeholder img { width: 100%; height: 100%; object-fit: cover; }
.member-profile-card { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 14px; align-items: start; }
.member-profile-card .member-photo-placeholder { width: 88px; height: 104px; }
.member-profile-flags { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 6px; }
.member-profile-flags span { padding: 2px 8px; border-radius: 10px; background: #e5f3fb; color: #146f9d; font-size: 12px; }
.member-profile-flags .danger { background: #ffe2e2; color: #a52323; }
.read-only-equity-strip { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 11px 14px; border: 1px solid #e2c56e; background: #fff9e7; }
.read-only-equity-strip small { width: 100%; color: #715d26; }
.checkbox-field { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px; }
.modal > .inline-form, .modal > .selected-member { margin: 15px 24px 0; padding: 0; }
.recharge-success-modal { width: min(720px, calc(100% - 26px)); }
.recharge-success-heading { border-bottom-color: #9bd2a8; background: #effaf2; }
.recharge-success-heading h2 { color: #19733b; }
.recharge-success-receipt { margin: 18px 24px 0; padding: 16px; border: 2px solid #66b97b; border-radius: 8px; background: #f5fcf7; }
.recharge-success-banner { margin: 0 0 14px; padding: 11px 13px; border-radius: 6px; color: #165f32; background: #dff4e5; font-size: 16px; font-weight: 800; }
.recharge-success-banner.replayed { color: #78540c; background: #fff1c9; }
.recharge-receipt-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.recharge-receipt-grid div { padding: 9px 11px; border: 1px solid #cfe6d5; border-radius: 5px; background: white; }
.recharge-receipt-grid span { display: block; color: #667b6c; font-size: 12px; }
.recharge-receipt-grid strong { display: block; margin-top: 3px; color: #183f25; font-size: 16px; }
.color-picker-modal { width: min(1040px, calc(100% - 26px)); }
.color-picker-help { margin: 14px 24px 4px; color: #526f7e; line-height: 1.6; }
.color-picker-groups { max-height: calc(100vh - 230px); padding: 8px 24px 16px; overflow: auto; }
.color-picker-group + .color-picker-group { margin-top: 16px; }
.color-picker-group h3 { margin: 0 0 8px; color: #176f9e; font-size: 15px; }
.color-option-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 7px; }
.color-option { position: relative; min-height: 66px; padding: 5px; display: grid; grid-template-rows: 34px auto; gap: 3px; align-items: center; border: 1px solid #bfd2dc; border-radius: 5px; color: #294753; background: #fff; font-size: 12px; cursor: pointer; }
.color-option:hover, .color-option:focus-visible { border-color: #238fd3; box-shadow: 0 0 0 2px rgba(35,143,211,.14); outline: 0; }
.color-option.selected { border: 2px solid #1688cb; background: #eaf7fe; }
.color-option.selected::after { content: "✓"; position: absolute; top: 3px; right: 4px; width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #1688cb; font-weight: 800; }
.color-option-swatch { height: 34px; border: 1px solid rgba(29,53,65,.24); border-radius: 3px; background: var(--color-swatch, #fff); }
.color-option-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.color-picker-actions { padding: 12px 24px 18px; display: flex; justify-content: flex-end; gap: 9px; border-top: 1px solid #d8e7ee; background: #f8fbfc; }
.color-picker-actions form { margin: 0; }
.brand-picker-modal { width: min(1120px, calc(100% - 26px)); }
.brand-picker-toolbar { margin: 14px 24px 0; display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: end; gap: 16px; }
.brand-picker-toolbar span { padding-bottom: 8px; color: #607783; white-space: nowrap; }
.brand-picker-grid { max-height: calc(100vh - 290px); padding: 12px 24px 18px; display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 9px; overflow: auto; }
.brand-option { min-height: 92px; padding: 8px 6px; display: grid; grid-template-rows: 54px auto; gap: 5px; align-items: center; border: 1px solid #c9d6dc; border-radius: 5px; color: #334c57; background: #fff; cursor: pointer; }
.brand-option:hover, .brand-option:focus-visible { border-color: #cf9a27; box-shadow: 0 0 0 2px rgba(207,154,39,.18); outline: 0; }
.brand-option strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.garment-condition-picker-modal { width: min(1040px, calc(100% - 26px)); }
.condition-picker-toolbar { margin: 14px 24px 0; display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: end; gap: 16px; }
.condition-picker-toolbar span { padding-bottom: 8px; color: #607783; white-space: nowrap; }
.garment-condition-grid { max-height: calc(100vh - 290px); min-height: 220px; padding: 12px 24px 18px; display: grid; grid-template-columns: repeat(6, minmax(110px, 1fr)); align-content: start; gap: 7px; overflow: auto; }
.garment-condition-option { position: relative; min-height: 58px; padding: 10px 8px; display: grid; place-items: center; border: 1px solid #b8ccd7; border-radius: 4px; color: #294956; background: #fff; cursor: pointer; }
.garment-condition-option small { position: absolute; top: 3px; right: 5px; color: #8799a2; font-size: 10px; }
.garment-condition-option strong { font-size: 15px; }
.garment-condition-option:hover,.garment-condition-option:focus-visible { border-color: #238fd3; background: #eef9ff; outline: 2px solid rgba(35,143,211,.14); }
.garment-condition-option.selected { color: #fff; border-color: #198bc9; background: #198bc9; }
.garment-condition-option.selected small { color: #dff5ff; }
.brand-logo-card { width: 100%; min-width: 90px; min-height: 48px; padding: 4px 7px; display: grid; grid-template-columns: minmax(28px,auto) 1fr; place-items: center; gap: 6px; overflow: hidden; border: 1px solid hsl(var(--brand-hue,210) 25% 78%); border-radius: 5px; color: hsl(var(--brand-hue,210) 48% 24%); background: linear-gradient(145deg,#fff,hsl(var(--brand-hue,210) 45% 96%)); }
.brand-logo-symbol { min-width: 30px; min-height: 30px; padding: 3px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: hsl(var(--brand-hue,210) 47% 32%); font-family: Arial Black,Arial,sans-serif; font-size: 12px; font-weight: 900; line-height: 1; letter-spacing: -.04em; }
.brand-logo-wordmark { max-width: 100%; overflow: hidden; font-family: Georgia,"Times New Roman",serif; font-size: 12px; font-weight: 800; line-height: 1.05; letter-spacing: .01em; text-align: center; text-overflow: ellipsis; }
.brand-logo-modern .brand-logo-wordmark,.brand-logo-minimal .brand-logo-wordmark { font-family: Arial,"Microsoft YaHei",sans-serif; letter-spacing: .05em; }
.brand-logo-sport .brand-logo-symbol { border-radius: 4px; transform: skew(-8deg); }
.brand-logo-heritage .brand-logo-symbol { border: 2px double rgba(255,255,255,.75); font-family: Georgia,"Times New Roman",serif; }
td .brand-logo-card { max-width: 150px; min-height: 38px; }
td .brand-logo-wordmark { font-size: 11px; }
.brand-pricing-form { margin-bottom: 10px; border: 1px solid #e3c765; background: #fffbed; }
.brand-pricing-form > strong { align-self: center; color: #735315; }
.brand-pricing-form > small { max-width: 420px; align-self: center; color: #765f2d; }
.block-hint { display: block; margin-top: 3px; color: #8b6a25; font-size: 11px; }
.payment-order { margin: 18px 24px 0; padding: 15px; border: 1px solid #e3c765; background: #fffbed; font-size: 16px; line-height: 1.7; }
.payment-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.payment-choice-box { display: grid; gap: 9px; }
.payment-choice-box label { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 8px; padding: 12px; border: 1px solid #bfd5e0; border-radius: 6px; background: #f8fcfe; }
.payment-choice-box input { width: auto; min-height: 0; }
.payment-choice-box span { color: #607783; font-size: 13px; }
.member-plan-choice { grid-column: 1 / -1; margin: 0; padding: 11px 12px 12px; border: 1px solid #bfd5e0; border-radius: 8px; background: #f8fcfe; }
.member-plan-choice legend { padding: 0 5px; color: #24485b; font-size: 14px; font-weight: 700; }
.member-plan-choice select { width: 100%; }
.payment-editor { display: grid; gap: 10px; padding: 12px; border: 1px solid #bfd5e0; border-radius: 6px; background: #fbfdfe; }
.payment-combination-box { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px; border: 1px solid #aad5b7; border-radius: 6px; background: #f2fbf5; }
.pickup-price-box { display: grid; gap: 10px; padding: 12px; border: 1px solid #aad5b7; border-radius: 6px; background: #f2fbf5; }
.pickup-price-box .form-grid.two { margin-top: 0; }
.pickup-price-box > button { justify-self: start; }
.pickup-price-box > p { margin: 0; }
.payment-member-context { color: #315463; font-size: 13px; line-height: 1.6; }
.payment-member-context strong { color: #166d3b; }
.payment-combination-button { flex: 0 0 auto; border-color: #55a876; color: #166d3b; background: #fff; font-weight: 700; }
.payment-combination-button:disabled { color: #82958a; border-color: #c7d6cc; background: #f4f6f5; cursor: not-allowed; }
.payment-paid-message { color: #166d3b; font-weight: 700; }
.payment-lines { display: grid; gap: 9px; }
.payment-line { display: grid; grid-template-columns: minmax(120px, .8fr) minmax(100px, .55fr) minmax(180px, 1.3fr) auto; align-items: end; gap: 8px; padding: 10px; border: 1px solid #d3e1e8; border-radius: 5px; background: white; }
.payment-line .row-button { margin-bottom: 3px; }
.payment-total-hint { padding: 9px 11px; color: #315463; border-left: 4px solid #2d9bd4; background: #eef8fd; line-height: 1.6; }
.warning-text { color: #a44321; font-weight: 600; }
.pickup-sms-panel { display: grid; gap: 9px; padding: 13px 14px; border: 2px solid #75bde3; border-radius: 7px; background: #f2faff; transition: opacity .15s, border-color .15s, background .15s; }
.pickup-sms-option { display: flex; align-items: flex-start; gap: 10px; margin: 0; color: #174c69; cursor: pointer; }
.pickup-sms-option input[type="checkbox"] { flex: 0 0 22px; width: 22px; height: 22px; min-height: 22px; margin: 1px 0 0; padding: 0; accent-color: #168bd0; }
.pickup-sms-option span { min-width: 0; display: block; }
.pickup-sms-option strong { display: block; font-size: 16px; line-height: 1.35; }
.pickup-sms-option small { display: block; margin-top: 3px; color: #577483; font-size: 12px; font-weight: 500; line-height: 1.45; }
.pickup-sms-preview-label { display: block; color: #496776; font-size: 12px; font-weight: 700; }
#pickupSmsPreview { min-height: 88px; resize: none; color: #213f4f; border-color: #b8d4e2; background: #fff; line-height: 1.65; cursor: default; }
#pickupSmsPreview:focus { border-color: #b8d4e2; box-shadow: none; }
.pickup-sms-panel.not-ready { border-color: #e0ba69; background: #fffaf0; }
.pickup-sms-panel.not-ready .pickup-sms-option small { color: #8a6421; }
.pickup-sms-panel.opted-out { opacity: .62; border-color: #c8d5dc; background: #f5f7f8; }
.pickup-item-picker { margin-top: 12px; overflow: hidden; border: 1px solid #bfd5e0; border-radius: 5px; background: #fbfdfe; }
.pickup-item-picker .member-choice-help { margin: 8px 12px; }
.pickup-item-picker .table-scroll { max-height: 310px; }
.pickup-item-picker .payment-total-hint { margin: 8px 10px 10px; }
.pickup-item-choice, #pickupSelectAll { width: auto; min-height: 0; }
.disabled-row { color: #85949c; background: #f4f6f7; }
.dialog-evidence-action { margin: 10px 24px 0; }
.workflow-item-picker { overflow: hidden; border: 1px solid #bfd5e0; border-radius: 5px; background: #fbfdfe; }
.workflow-picker-heading { min-height: 40px; padding: 8px 10px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: #315463; background: #edf7fc; }
.workflow-picker-heading label { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.workflow-picker-heading input, .workflow-item-check { width: auto; min-height: 0; }
.workflow-item-picker .table-scroll { max-height: 260px; }
.workflow-item-picker th, .workflow-item-picker td { padding: 7px 8px; }
.workflow-terminal { color: #81919a; background: #f5f7f8; }
.member-choice-modal { width: min(760px, calc(100% - 26px)); }
.member-choice-help { margin: 14px 24px 8px; color: #607783; line-height: 1.6; }
.member-choice-scroll { max-height: min(430px, calc(100vh - 190px)); padding: 0 24px 24px; }
.camera-modal { width: min(820px, calc(100% - 24px)); }
.camera-body { padding: 18px 24px 24px; }
.camera-body video { display: block; width: 100%; max-height: 58vh; min-height: 280px; border-radius: 8px; background: #16232a; object-fit: contain; }
.camera-body p { min-height: 22px; margin: 10px 0; color: #536c79; }
.camera-actions { display: flex; gap: 9px; }
.camera-actions .button:first-child { flex: 1; min-height: 46px; font-size: 17px; }
.evidence-modal { width: min(960px, calc(100% - 24px)); }
.evidence-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-height: calc(100vh - 150px); padding: 18px 24px 24px; overflow: auto; }
.evidence-gallery > .empty-state { grid-column: 1 / -1; }
.evidence-gallery figure { margin: 0; border: 1px solid #c8dbe5; border-radius: 7px; overflow: hidden; background: #f6fafc; }
.evidence-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #18252b; }
.evidence-photo-button { display: block; width: 100%; padding: 0; border: 0; background: #18252b; cursor: zoom-in; }
.evidence-photo-button:hover img, .evidence-photo-button:focus-visible img { opacity: .86; outline: 3px solid #50b9ed; outline-offset: -3px; }
.evidence-gallery figcaption { padding: 9px 11px; color: #536c79; font-size: 12px; line-height: 1.6; }
.evidence-gallery figcaption strong { color: #213e4d; font-size: 14px; }
.evidence-error { color: var(--danger); }
.photo-lightbox-modal { position: relative; width: min(96vw, 1280px); max-width: 1280px; max-height: 96vh; padding: 20px; border-radius: 10px; color: #eaf5fa; background: #101a20; }
.photo-lightbox-modal::backdrop { background: rgba(3, 12, 18, .82); backdrop-filter: blur(3px); }
.photo-lightbox-modal .modal-close { z-index: 1; color: #dcecf3; background: rgba(255,255,255,.15); }
.photo-lightbox-figure { margin: 0; display: grid; place-items: center; gap: 12px; }
.photo-lightbox-figure img { display: block; max-width: calc(96vw - 40px); max-height: calc(96vh - 90px); object-fit: contain; }
.photo-lightbox-figure figcaption { color: #bfd4de; font-size: 13px; text-align: center; }

.parity-tool { min-width: 118px; background: rgba(255,255,255,.08); }
.visual-picker-field { display: block; margin-top: 5px; }
.visual-picker-trigger { width: 100%; min-height: 68px; padding: 8px 10px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 9px; text-align: left; color: #1d4e68; border: 2px solid #39a7e0; border-radius: 7px; background: linear-gradient(180deg,#fff,#eef9ff); cursor: pointer; }
.visual-picker-trigger:hover,.visual-picker-trigger:focus-visible { border-color: #067bbb; box-shadow: 0 0 0 3px rgba(28,149,211,.16); outline: 0; }
.visual-picker-trigger .visual-picker-icon { width: 40px; height: 40px; display: grid; overflow: hidden; place-items: center; color: #fff; border-radius: 6px; background: #218dca; font-size: 24px; }
.visual-picker-trigger .visual-picker-icon.has-garment-visual { color: #1d4e68; background: #e8f5fa; box-shadow: inset 0 0 0 1px #b8dce9; }
.visual-picker-trigger strong,.visual-picker-trigger small { display: block; }.visual-picker-trigger strong { font-size: 15px; }.visual-picker-trigger small { margin-top: 3px; color: #63808e; font-weight: 400; }.visual-picker-trigger b { color: #1680ba; }
.receive-quick-options,.option-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.receive-quick-options { margin: 10px 0; padding: 8px; border: 1px solid #c9dce5; background: #f7fbfd; }
.receive-quick-options label,.option-grid label { min-width: 0; display: flex; align-items: center; gap: 5px; font-size: 12px; }
.receive-quick-options input[type="checkbox"],.option-grid input[type="checkbox"] { width: auto; min-height: 0; }.receive-quick-options input[type="number"] { min-width: 40px; min-height: 30px; padding: 4px; }
.receive-output-options { margin: 8px 12px; padding: 8px; border: 1px solid #cbdde5; }.receive-output-options legend { color: #176f9e; font-weight: 700; }.receive-output-options > label { margin: 6px 0 0; }

.receive-item-picker-modal { width: min(1120px,calc(100% - 24px)); height: min(780px,calc(100vh - 24px)); overflow: hidden; }
.receive-item-picker-toolbar { display: flex; justify-content: flex-end; align-items: end; flex-wrap: wrap; gap: 12px; padding: 10px 18px; border-bottom: 1px solid #cbdde5; background: #f7fbfd; }
.catalog-service-tabs { display: flex; flex-wrap: wrap; gap: 1px; }
.catalog-service-tabs button { min-height: 37px; padding: 7px 14px; color: #204d65; border: 1px solid #90c7e2; background: #fff; cursor: pointer; }
.catalog-service-tabs button.active { color: #fff; background: #188dc9; }
.receive-price-mode { display: flex; }.receive-price-mode button { min-height: 37px; padding: 7px 15px; border: 1px solid #90c7e2; background: #fff; }.receive-price-mode button.active { color: #fff; background: #277bb1; }
.receive-item-picker-toolbar label { font-weight: 700; }.receive-item-picker-toolbar input { margin-top: 3px; }
.receive-item-grid { height: calc(100% - 190px); min-height: 330px; padding: 16px 18px; display: grid; grid-template-columns: repeat(auto-fill,minmax(118px,1fr)); grid-auto-rows: 142px; align-content: start; gap: 12px; overflow: auto; background: #fff; }
.receive-item-card { position: relative; padding: 7px; display: grid; grid-template-rows: 78px auto auto; justify-items: center; align-items: center; border: 1px solid #b9d0db; border-radius: 5px; background: #fff; cursor: pointer; }
.receive-item-card:hover,.receive-item-card:focus-visible { border-color: #168dcc; box-shadow: 0 3px 11px rgba(20,101,145,.18); outline: 0; transform: translateY(-1px); }
.receive-item-card .garment-visual { width: 72px; height: 72px; display: grid; place-items: center; overflow: hidden; color: #377189; border-radius: 10px; background: linear-gradient(145deg,#d9f1fb,#eef8fc); font-size: 40px; }
/* Sprite sheets contain separator gutters; overscan inside clipped holders so browser zoom never exposes a seam. */
.garment-sprite { width: 100%; height: 100%; display: block; border-radius: inherit; background-color: #e8f5fa; background-repeat: no-repeat; background-position: var(--sprite-x,0%) var(--sprite-y,0%); transform: scale(1.2); transform-origin: center; }
.garment-sprite-base { background-image: url("assets/garment-catalog-sprite-v1.webp?v=e272d891bec41a6a"); background-size: 660% 550%; }
.garment-sprite-shoes { background-image: url("assets/garment-shoes-sprite-v2.webp?v=e272d891bec41a6a"); background-size: 400% 400%; }
.garment-sprite-shoes-extra { background-image: url("assets/garment-shoes-extra-sprite-v2.webp?v=e272d891bec41a6a"); background-size: 400% 400%; }
.garment-sprite-home { background-image: url("assets/garment-home-sprite-v2.webp?v=e272d891bec41a6a"); background-size: 400% 400%; }
.garment-sprite-special { background-image: url("assets/garment-special-sprite-v2.webp?v=e272d891bec41a6a"); background-size: 400% 400%; }
.garment-asset-image { width: 100%; height: 100%; display: block; border-radius: inherit; object-fit: cover; }
.garment-emoji { display: inline-grid; width: 100%; height: 100%; place-items: center; }
.price-visual-mini { width: 46px; height: 46px; display: inline-grid; overflow: hidden; place-items: center; border: 1px solid #c9dce5; border-radius: 6px; background: #eef7fb; font-size: 27px; }
.price-image-editor { margin-bottom: 12px; padding: 10px; display: flex; align-items: center; gap: 12px; color: #355b6d; border: 1px solid #b9d4e1; border-radius: 7px; background: #f5fbfe; }
.price-image-editor .garment-visual { width: 86px; height: 86px; flex: 0 0 86px; display: grid; overflow: hidden; place-items: center; border-radius: 8px; background: #e8f5fa; font-size: 42px; }
.price-image-editor p { margin: 0; line-height: 1.6; }.price-image-editor small { color: #67808c; }
.price-detail-heading { margin-bottom: 10px; display: flex; align-items: center; gap: 9px; }.price-detail-heading h3 { margin: 0; }
.row-button.danger { color: #a23636; border-color: #dfa9a9; background: #fff4f4; }
.receive-item-card .item-price { color: #a25020; font-size: 12px; }.receive-item-card strong { width: 100%; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.receive-item-card .b-badge { position: absolute; top: 4px; right: 4px; padding: 1px 4px; color: #fff; background: #d88919; border-radius: 3px; font-size: 10px; }
.receive-item-picker-footer { min-height: 42px; padding: 10px 18px; display: flex; justify-content: space-between; color: #55717e; border-top: 1px solid #cbdde5; background: #f7fbfd; }

.member-card-summary { display: grid; grid-template-columns: repeat(auto-fill,minmax(190px,1fr)); gap: 7px; margin-bottom: 9px; }
.member-card-stat { padding: 8px 10px; border: 1px solid #a9cbdc; background: #f3faff; line-height: 1.55; text-align: left; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; }.member-card-stat:hover,.member-card-stat:focus-visible { border-color: #168dcc; background: #eaf7fe; box-shadow: 0 2px 7px rgba(23,111,158,.14); outline: none; }.member-card-stat.active { border-color: #168dcc; background: #dff3fc; box-shadow: inset 0 0 0 1px #168dcc; }.member-card-stat strong { display: block; color: #156e9f; }.member-card-stat small { display: block; color: #617b87; }.member-card-stat-action { display: block; margin-top: 4px; color: #168dcc; font-size: 11px; }
.member-card-filter-hint { margin: 0 0 9px; padding: 7px 10px; color: #55717e; border: 1px dashed #b9d4e1; background: #f8fcfe; font-size: 12px; }.link-button { margin-left: 8px; padding: 0; color: #168dcc; border: 0; background: transparent; cursor: pointer; text-decoration: underline; }
.member-entry-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; padding: 9px 12px; border: 1px solid #bad3df; background: #edf7fc; }
.member-entry-nav > span { margin-right: 6px; color: #446c7d; font-size: 13px; font-weight: 750; }
.member-entry-nav .button { min-height: 36px; }
.member-selection { display: block; padding: 0; background: #fff; border: 1px solid #c7dfeb; }
.member-selection-empty { margin: 0; padding: 15px; color: #607985; background: #f8fcfe; }
.member-selection-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; padding: 11px 15px; color: #155e85; background: #eaf7fd; }
.member-selection-heading span { color: #5f7784; font-size: 12px; }
.member-selection-profile { padding: 14px 15px; }
.member-action-group, .member-account-actions { padding: 11px 15px; border-top: 1px solid #d7e7ee; }
.member-action-group > strong { display: block; margin-bottom: 8px; color: #315f75; font-size: 13px; }
.member-action-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.member-action-buttons .button { min-height: 36px; }
.member-account-actions { background: #f8fbfd; }
.member-account-actions summary { width: fit-content; color: #366e89; font-weight: 700; cursor: pointer; }
.member-account-actions .member-action-buttons { padding-top: 11px; }
.legacy-dense-table { font-size: 12px; }.legacy-dense-table th,.legacy-dense-table td { padding: 6px 7px; white-space: nowrap; }

.catalog-commandbar,.parity-filters { display: flex; align-items: end; gap: 7px; padding: 9px 0; }.catalog-commandbar label,.parity-filters label { margin: 0; }.catalog-commandbar .grow,.parity-filters .grow { flex: 1; }
.catalog-workspace { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 9px; }.catalog-workspace .table-scroll { margin: 0; }.catalog-detail { padding: 12px; overflow: auto; border: 1px solid #bcd4df; background: #f8fcfe; }.catalog-detail h3 { margin: 0 0 8px; color: #176f9e; }.catalog-detail dl { display: grid; grid-template-columns: 88px 1fr; gap: 5px; margin: 0; }.catalog-detail dt { color: #67808c; }.catalog-detail dd { margin: 0; font-weight: 600; }.catalog-detail .discount-matrix { margin-top: 10px; display: grid; grid-template-columns: repeat(2,1fr); gap: 4px; font-size: 12px; }
.parity-counters { display: grid; grid-template-columns: repeat(4,minmax(140px,1fr)); gap: 8px; }.parity-counter { padding: 11px; border: 1px solid #bdd5e1; background: #f6fbfd; }.parity-counter strong { display: block; color: #176f9e; font-size: 22px; }.parity-status { padding: 3px 6px; border-radius: 3px; font-size: 11px; font-weight: 800; }.parity-status.full { color: #086c40; background: #def5e8; }.parity-status.partial { color: #945100; background: #fff0c9; }.parity-status.missing { color: #a42e2e; background: #fbe1e1; }.parity-status.field,.parity-status.external { color: #4e5a83; background: #e7eafd; }

.print-labels { display: none; }

@page { size: 110mm 18mm; margin: 0; }
@media print {
  html, body { width: 110mm !important; min-width: 110mm !important; height: auto !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; background: #fff !important; }
  body > *:not(.print-labels) { display: none !important; }
  body > .print-labels { display: block !important; width: 110mm !important; margin: 0 !important; padding: 0 !important; }
  .garment-label { box-sizing: border-box; width: 110mm; height: 18mm; margin: 0; padding: .35mm 1mm .35mm .6mm; display: grid; grid-template-columns: 7.2mm 37.5mm minmax(0, 1fr); column-gap: 1.6mm; align-items: stretch; overflow: hidden; color: #000; background: #fff; font-family: "SimHei", "Microsoft YaHei", sans-serif; -webkit-print-color-adjust: exact; print-color-adjust: exact; break-inside: avoid; page-break-inside: avoid; break-after: page; page-break-after: always; }
  .garment-label:last-child { break-after: auto; page-break-after: auto; }
  .garment-label-store { display: flex; align-items: center; justify-content: center; writing-mode: vertical-rl; text-orientation: upright; letter-spacing: .2mm; font-size: 3.2mm; line-height: 1; font-weight: 700; white-space: nowrap; }
  .garment-label-barcode { min-width: 0; display: grid; grid-template-rows: 10.5mm 4.5mm; align-content: start; justify-items: stretch; padding-top: .35mm; overflow: hidden; }
  .garment-label-barcode svg { display: block; width: 100%; height: 10.5mm; fill: #000; shape-rendering: crispEdges; }
  .garment-label-barcode strong { overflow: hidden; text-align: center; font-size: 3.8mm; line-height: 4.5mm; font-weight: 700; letter-spacing: .65mm; white-space: nowrap; }
  .garment-label-info { min-width: 0; padding-top: .05mm; overflow: hidden; font-size: 3mm; line-height: 4mm; font-weight: 600; }
  .garment-label-info > div { min-width: 0; height: 4mm; line-height: 4mm; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media (max-width: 1120px) {
  .topbar { grid-template-columns: 1fr auto; }
  .topbar-store { display: none; }
  .topbar-actions { grid-column: 2; }
  .dashboard-grid { grid-template-columns: 260px 310px minmax(390px, 1fr); }
  .receive-layout { grid-template-columns: 340px minmax(390px, 1fr); }
  .customer-card { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; padding: 0 12px 12px; }
  .customer-card h3 { grid-column: 1 / -1; margin: 0 -12px; }
  .customer-card > * { margin-left: 0 !important; margin-right: 0 !important; }
  .customer-card .order-total { align-self: end; }
}

@media (max-width: 860px) {
  .login-page { padding: 20px; align-items: start; overflow: auto; }
  .login-card { grid-template-columns: 1fr; min-height: 0; }
  .login-card::after { display: none; }
  .login-brand { padding: 32px 30px 24px; }
  .wash-visual { height: 238px; }
  .washer { transform: scale(.82); }
  .halo-one { width: 240px; height: 240px; }
  .halo-two { width: 190px; height: 190px; }
  .login-form { padding: 34px 30px 24px; }
  .login-help { grid-column: 1; }
  .topbar { display: flex; min-height: 74px; }.topbar-nav { flex: 1; }.top-tool { min-width: 76px; padding: 8px; font-size: 12px; }.top-tool span { font-size: 24px; }.topbar-actions { padding: 0; }.top-action { min-width: 58px; font-size: 12px; }
  .page-wrap { padding: 8px; overflow-x: hidden; }
  .dashboard-grid { display: flex; flex-direction: column; min-height: auto; }
  .dashboard-left { display: contents; }.quick-panel { order: 1; }.common-panel { order: 2; }.dashboard-lists { order: 3; min-height: 600px; }.notice-panel { order: 4; }.reminder-panel { order: 5; }
  .receive-layout { display: flex; flex-direction: column; }.receive-draft { min-height: 300px; }.customer-card { display: block; }
  .form-grid.two, .payment-row { grid-template-columns: 1fr; }
  .payment-line { grid-template-columns: 1fr 1fr; }.payment-line .payment-reference { grid-column: 1 / -1; }.payment-combination-box { align-items: stretch; flex-direction: column; }
  .report-grid { grid-template-columns: repeat(2, 1fr); }
  .operations-grid { grid-template-columns: 1fr; }
  .finance-filter { grid-template-columns: repeat(3, 1fr); }.finance-columns { grid-template-columns: 1fr; }.finance-summary-grid { grid-template-columns: repeat(3, 1fr); }
  .daily-closing-columns { grid-template-columns: 1fr; }.daily-closing-card + .daily-closing-card { border-left: 0; border-top: 1px solid #8fa9b6; }
  .member-history-filter { flex-wrap: wrap; }.member-history-filter .grow { min-width: 100%; }.member-history-summary { grid-template-columns: repeat(3, 1fr); }.history-detail-grid { grid-template-columns: repeat(2, 1fr); }
  .toolbar-form { flex-wrap: wrap; }.toolbar-form label { min-width: 100%; }
  .member-edit-layout { flex-direction: column; }.member-photo-editor.vertical { width: 100%; flex-basis: auto; flex-direction: row; text-align: left; }
  .view-title { align-items: flex-start; }.view-title h2 { font-size: 23px; }
  .statusbar .status-online, .statusbar .separator { display: none; }
}

@media (max-width: 520px) {
  .login-page { padding: 10px; }
  .login-card { border-radius: 22px; }
  .login-brand { padding: 26px 21px 20px; }
  .login-brand-heading { align-items: flex-start; }
  .brand-mark { flex-basis: 55px; width: 55px; height: 55px; border-radius: 16px; }
  .brand-mark svg { width: 35px; height: 35px; }
  .login-brand h1 { font-size: 27px; }
  .login-brand .login-slogan { margin-top: 18px; font-size: 14px; }
  .wash-visual { height: 207px; margin-top: -3px; }
  .washer { transform: scale(.71); }
  .halo-one { width: 210px; height: 210px; }
  .halo-two { width: 164px; height: 164px; }
  .login-values { margin-top: -6px; }
  .login-form { padding: 29px 21px 19px; }
  .login-form-heading h2 { font-size: 24px; }
  .login-help { display: grid; gap: 8px; padding: 13px 21px; }
  .login-help-brand { font-size: 12px; }
  .topbar { position: sticky; top: 0; z-index: 20; display: block; }.topbar-nav { width: 100%; }.topbar-actions { position: fixed; right: 8px; bottom: 38px; z-index: 30; border-radius: 6px; overflow: hidden; box-shadow: var(--shadow); }.top-action { color: #145e8b; background: white; border-left: 1px solid #d4e2e8; min-height: 43px; }
  .common-actions { grid-template-columns: repeat(2, 1fr); }.member-lookup { grid-template-columns: 1fr; }
  .operation-links,.lifecycle-form,.lifecycle-checks { grid-template-columns: 1fr; }.lifecycle-form .wide { grid-column: auto; }
  .report-grid { grid-template-columns: 1fr; }.report-card { min-height: 100px; }
  .finance-filter, .finance-summary-grid { grid-template-columns: 1fr 1fr; }.panel-actions { width: 100%; }.finance-columns { padding-left: 8px; padding-right: 8px; }.quick-range { flex-wrap: wrap; }
  .daily-closing-sheet { margin-left: 8px; margin-right: 8px; }.daily-closing-title { align-items: flex-start; flex-direction: column; }.daily-closing-card { min-height: 0; padding: 15px; }
  .member-history-tabs button { min-width: 0; flex: 1; padding-left: 8px; padding-right: 8px; }.member-history-heading { display: block; }.member-history-heading > p { margin-top: 6px; }.member-history-summary { grid-template-columns: 1fr 1fr; }.history-detail-grid { grid-template-columns: 1fr; }.ledger-scroll { margin-left: 8px; margin-right: 8px; }
  .selection-bar { align-items: stretch; flex-direction: column; }.selection-bar button { width: 100%; }
  .member-selection { display: block; }.member-action-buttons .button { width: auto; }
  .pickup-quick-bar { top: 74px; align-items: stretch; flex-direction: column; }.pickup-quick-actions { display: grid; grid-template-columns: 1fr 1fr; }.pickup-quick-actions .button { width: 100%; }.pickup-quick-summary { grid-template-columns: 1fr; }.pickup-quick-summary > small { grid-column: auto; white-space: normal; }
  .catalog-workspace { grid-template-columns: 1fr; }.catalog-detail { max-height: 260px; }.receive-item-picker-toolbar { display: grid; grid-template-columns: 1fr; justify-content: stretch; }.receive-item-grid { height: calc(100% - 190px); grid-template-columns: repeat(3,minmax(0,1fr)); }.parity-counters { grid-template-columns: 1fr 1fr; }
  .modal-form { padding: 17px; }.modal-heading { padding-left: 17px; }.modal > .inline-form, .modal > .selected-member, .payment-order { margin-left: 17px; margin-right: 17px; }
  .payment-choice-box label, .payment-line { grid-template-columns: 1fr; }.payment-choice-box input { justify-self: start; }.payment-line .payment-reference { grid-column: auto; }
  .camera-body { padding: 12px; }.camera-body video { min-height: 210px; }.camera-actions { display: grid; }.evidence-gallery { grid-template-columns: 1fr; padding: 12px; }
  .color-picker-help { margin-left: 17px; margin-right: 17px; }.color-picker-groups { padding-left: 17px; padding-right: 17px; }.color-option-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.color-picker-actions { padding-left: 17px; padding-right: 17px; }
  .brand-picker-toolbar,.condition-picker-toolbar { margin-left: 17px; margin-right: 17px; grid-template-columns: 1fr; }.brand-picker-grid { padding-left: 17px; padding-right: 17px; grid-template-columns: repeat(2, minmax(0, 1fr)); }.garment-condition-grid { padding-left: 17px; padding-right: 17px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.draft-breakdown{display:flex;flex-wrap:wrap;gap:8px 18px;padding:10px 12px;border-top:1px solid var(--line);background:#f4faff;color:#426077;font-size:13px}.draft-breakdown span{white-space:nowrap}.draft-breakdown strong{color:#0f476d}