:root {
  --ink: #17363a;
  --muted: #6b7d80;
  --paper: #f5f8f7;
  --white: #ffffff;
  --teal: #153f45;
  --teal-2: #1e6970;
  --brand-primary: #153f45;
  --brand-accent: #ee6c35;
  --sidebar-bg: #153f45;
  --sidebar-text: #ffffff;
  --green: #4cad62;
  --orange: #ee6c35;
  --amber: #f3b54f;
  --line: #dce7e5;
  --danger: #bd3f3f;
  --shadow: 0 18px 45px rgba(21, 63, 69, 0.10);
}

.receiving-batch-input {
  min-height: 220px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 16px;
  line-height: 1.45;
  text-transform: uppercase;
  letter-spacing: .02em;
  caret-color: var(--teal);
  touch-action: manipulation;
  -webkit-user-select: text;
  user-select: text;
}

.receiving-batch-input[readonly] {
  pointer-events: none;
  caret-color: transparent;
}

.receiving-batch-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.receiving-batch-field-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.receiving-keyboard-button,
.receiving-paste-button,
.receiving-scanner-focus-button {
  width: auto;
  flex: 0 0 auto;
}

.receiving-scanner-focus-button {
  border-color: #91c8ae;
  color: #176c46;
  background: #effaf4;
}

.receiving-scanner-diagnostic {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 10px 0;
  padding: 12px 14px;
  border: 1px solid #b8d9cf;
  border-radius: 14px;
  color: #15593d;
  background: #eef9f4;
  outline: none;
}
.receiving-scanner-diagnostic strong,
.receiving-scanner-diagnostic small { display: block; }
.receiving-scanner-diagnostic small { margin-top: 3px; color: var(--muted); line-height: 1.35; }
.receiving-scanner-pulse { width: 12px; height: 12px; flex: 0 0 auto; border-radius: 50%; background: #35a36a; box-shadow: 0 0 0 5px rgba(53,163,106,.14); }
.receiving-scanner-diagnostic[data-tone="listening"] { border-color: #e2bf79; color: #825407; background: #fff8e9; }
.receiving-scanner-diagnostic[data-tone="listening"] .receiving-scanner-pulse { background: #e3a32e; box-shadow: 0 0 0 5px rgba(227,163,46,.15); }
.receiving-scanner-diagnostic[data-tone="success"] { border-color: #91c8ae; color: #176c46; background: #effaf4; }
.receiving-scanner-diagnostic[data-tone="error"] { border-color: #e3a39d; color: #9b302b; background: #fff2f1; }
.receiving-scanner-diagnostic[data-tone="error"] .receiving-scanner-pulse { background: #c94c43; box-shadow: 0 0 0 5px rgba(201,76,67,.13); }

.receiving-internal-keyboard[hidden] { display: none; }
.receiving-internal-keyboard {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #bdd8d4;
  border-radius: 16px;
  background: #eef8f6;
  box-shadow: 0 12px 30px rgba(21,63,69,.09);
}

.receiving-keyboard-title { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.receiving-keyboard-title strong { color: var(--teal); }
.receiving-keyboard-title small { color: var(--muted); text-align: right; }
.receiving-keyboard-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 7px; }
.receiving-keyboard-grid button {
  min-height: 48px;
  border: 1px solid #bfd2cf;
  border-radius: 12px;
  color: var(--ink);
  background: #fff;
  font-size: 18px;
  font-weight: 850;
  touch-action: manipulation;
  box-shadow: 0 2px 7px rgba(21,63,69,.07);
}
.receiving-keyboard-grid button:active { transform: translateY(1px); background: #dcefeb; }
.receiving-keyboard-grid .key-prefix { grid-column: span 2; color: #fff; background: var(--teal-2); border-color: var(--teal-2); }
.receiving-keyboard-grid .key-newline { grid-column: span 3; color: #fff; background: var(--teal); border-color: var(--teal); font-size: 14px; }
.receiving-keyboard-grid .key-clear { grid-column: span 2; color: var(--danger); font-size: 14px; }

.receiving-batch-button {
  border-color: #cf8a28;
  color: #7b4a08;
  background: #fff8ec;
}

.receiving-batch-result {
  grid-column: 1 / -1;
  border: 1px solid var(--line);
  border-left: 5px solid var(--teal);
  border-radius: 16px;
  padding: 15px 17px;
  background: #fff;
}

.receiving-batch-result.accepted { border-left-color: #27a86b; background: #f2fbf6; }
.receiving-batch-result.duplicate { border-left-color: #e09a2b; background: #fff9ed; }
.receiving-batch-result.unknown { border-left-color: #d04c43; background: #fff5f4; }
.receiving-batch-result > strong { display: block; margin-bottom: 9px; color: var(--teal); }
.receiving-batch-result > div { display: grid; gap: 5px; max-height: 190px; overflow: auto; }
.receiving-batch-result span { font-size: 13px; line-height: 1.45; }
.receiving-batch-result em { font-size: 12px; color: var(--muted); }

.notice-settings-heading {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 17px;
  margin-top: 8px;
  border-radius: 17px;
  color: #fff;
  background: linear-gradient(135deg, #163f46, #0c6970);
}

.notice-settings-heading > span { font-size: 28px; }
.notice-settings-heading strong { display: block; font-size: 17px; }
.notice-settings-heading p { margin: 4px 0 0; color: rgba(255,255,255,.78); line-height: 1.45; }

.email-button {
  border-color: #8aa5d6;
  color: #204b91;
  background: #eff5ff;
}

.notice-email-modal {
  padding: 14px;
  background: #eef2f4;
}

.notice-email-preview-frame {
  display: block;
  width: 100%;
  min-height: 620px;
  margin-top: 14px;
  border: 1px solid #ccd8dd;
  border-radius: 16px;
  background: #f4f6f8;
}

@media (max-width: 720px) {
  .receiving-batch-button { width: 100%; }
  .receiving-batch-field-head { align-items: stretch; flex-direction: column; }
  .receiving-batch-field-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .receiving-keyboard-button, .receiving-paste-button, .receiving-scanner-focus-button { width: 100%; min-width: 0; min-height: 46px; padding-inline: 8px; white-space: normal; }
  .receiving-batch-input { min-height: 38dvh; max-height: 52dvh; }
  .receiving-internal-keyboard { position: sticky; bottom: 0; z-index: 2; }
  .receiving-keyboard-title { align-items: flex-start; flex-direction: column; }
  .receiving-keyboard-title small { text-align: left; }
  .receiving-batch-modal-body { overscroll-behavior-y: contain; touch-action: pan-y; padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)) !important; }
  .receiving-batch-modal-foot { align-items: stretch; flex-direction: column; padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
  .receiving-batch-modal-foot > div { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); gap: 9px; }
  .receiving-batch-modal-foot .button { width: 100%; min-height: 50px; }
  .notice-email-modal { padding: 8px; }
  .notice-email-preview-frame { min-height: 66dvh; border-radius: 12px; }
}

* { box-sizing: border-box; }
html { min-height: 100%; width: 100%; background: var(--paper); }
body { margin: 0; min-height: 100vh; min-height: 100dvh; width: 100%; overflow-x: hidden; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.boot-screen { min-height: 100vh; display: grid; place-items: center; align-content: center; gap: 12px; text-align: center; color: var(--ink); }
.boot-screen .brand-mark { color: white; background: var(--teal); }
.boot-screen strong { font-size: 20px; }
.boot-screen > span:last-child { color: var(--muted); font-size: 13px; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 238px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; height: 100dvh; padding: 24px 18px; background: var(--sidebar-bg); color: var(--sidebar-text); display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: color-mix(in srgb,var(--sidebar-text) 35%,transparent) transparent; z-index: 5; }
.sidebar::-webkit-scrollbar { width: 7px; }
.sidebar::-webkit-scrollbar-thumb { border-radius: 99px; background: color-mix(in srgb,var(--sidebar-text) 32%,transparent); }
.brand { display: flex; align-items: center; gap: 12px; padding: 2px 7px 25px; }
.brand-mark { width: 46px; height: 46px; border: 2px solid currentColor; border-radius: 15px; display: grid; place-items: center; font-size: 18px; font-weight: 900; letter-spacing: -1px; position: relative; }
.brand-mark::after { content: ""; position: absolute; width: 8px; height: 29px; background: var(--green); transform: skew(-23deg); box-shadow: 7px 5px 0 rgba(76,173,98,.55); }
.brand-mark span { position: relative; z-index: 1; text-shadow: 0 1px 4px var(--sidebar-bg); }
.brand-mark.has-logo { overflow: hidden; border-color: color-mix(in srgb,var(--sidebar-text) 35%,transparent); background: #fff; }
.brand-mark.has-logo::after { display: none; }
.brand-logo-image { width: 100%; height: 100%; padding: 4px; object-fit: contain; }
.brand-name strong { display: block; font-size: 17px; letter-spacing: .02em; }
.brand-name small { color: var(--sidebar-text); opacity: .78; font-size: 11px; text-transform: uppercase; letter-spacing: .18em; }
.app-version { display: inline-flex; margin-top: 7px; border: 1px solid color-mix(in srgb,var(--sidebar-text) 22%,transparent); border-radius: 99px; padding: 3px 7px; color: var(--sidebar-text); background: color-mix(in srgb,var(--sidebar-text) 8%,transparent); font-size: 9px; font-weight: 850; letter-spacing: .04em; }
.nav { display: grid; flex: 0 0 auto; gap: 7px; }
.nav-button { border: 0; background: transparent; color: var(--sidebar-text); opacity: .84; padding: 12px 13px; border-radius: 12px; text-align: left; display: flex; align-items: center; gap: 11px; font-weight: 700; transition: .18s ease; }
.nav-button:hover { background: color-mix(in srgb,var(--sidebar-text) 10%,transparent); color: var(--sidebar-text); opacity: 1; }
.nav-button.active { background: var(--sidebar-text); color: var(--sidebar-bg); opacity: 1; box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.nav-icon { width: 24px; text-align: center; font-size: 17px; }
.mobile-more { display: none; }
.mobile-more-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.mobile-more-item { min-height: 92px; padding: 16px 12px; border: 1px solid var(--line); border-radius: 15px; background: #f7faf9; color: var(--teal); display: grid; place-items: center; gap: 7px; font: inherit; cursor: pointer; }
.mobile-more-item span { font-size: 24px; }
.mobile-more-item strong { font-size: 14px; }
.mobile-more-item.active { border-color: var(--teal); background: #eaf5f1; box-shadow: inset 0 0 0 1px var(--teal); }
.sidebar-foot { margin-top: auto; padding: 14px 10px 0; border-top: 1px solid color-mix(in srgb,var(--sidebar-text) 18%,transparent); color: var(--sidebar-text); opacity: .76; font-size: 12px; line-height: 1.5; }

.main { min-width: 0; padding: 28px clamp(20px, 3vw, 46px) 52px; }
.branch-bar { margin-bottom: 22px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.9); box-shadow: 0 7px 20px rgba(21,63,69,.05); display: flex; align-items: center; gap: 11px; }
.branch-current { min-width: 190px; margin-right: auto; }
.branch-current span, .branch-select span { display: block; margin-bottom: 2px; color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .07em; }
.branch-current strong { display: block; font-size: 16px; }
.version-pill { flex: 0 0 auto; border: 1px solid #c9e1dd; border-radius: 99px; padding: 5px 8px; color: var(--teal-2); background: #edf7f5; font-size: 10px; font-weight: 900; letter-spacing: .04em; }
.sync-pill { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #c9e1dd; border-radius: 99px; padding: 6px 9px; color: #287a3b; background: #e8f6eb; font-size: 10px; font-weight: 900; }
.sync-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.sync-pill.connecting, .sync-pill.syncing { color: #8b6615; background: #fff5db; border-color: #efdfae; }
.sync-pill.offline, .sync-pill.error { color: #a84b27; background: #fff0e9; border-color: #f1d1c3; }
.branch-select select { min-width: 190px; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; color: var(--ink); background: #fbfdfc; font-weight: 750; }
.topbar { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 28px; }
.eyebrow { margin: 0 0 6px; color: var(--orange); font-weight: 900; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(26px, 3vw, 38px); line-height: 1.08; letter-spacing: -.035em; }
.subhead { margin: 8px 0 0; color: var(--muted); max-width: 760px; line-height: 1.55; }
.top-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.button { border: 1px solid var(--line); border-radius: 11px; min-height: 42px; padding: 0 15px; background: white; color: var(--ink); font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 4px 14px rgba(21,63,69,.05); text-decoration: none; }
.button:hover { transform: translateY(-1px); }
.button.primary { border-color: var(--teal-2); background: var(--teal-2); color: white; }
.button.orange { border-color: var(--orange); background: var(--orange); color: white; }
.button.ghost { box-shadow: none; background: transparent; }
.button.danger { color: var(--danger); border-color: #edcccc; }
.button.small { min-height: 34px; padding: 0 11px; font-size: 12px; }

.period-bar { background: var(--white); border: 1px solid var(--line); border-radius: 16px; padding: 13px 16px; display: flex; align-items: center; gap: 12px; margin-bottom: 18px; box-shadow: 0 7px 20px rgba(21,63,69,.04); }
.period-bar strong { margin-right: auto; }
.period-bar label { font-size: 12px; font-weight: 800; color: var(--muted); }
.period-bar input { border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; color: var(--ink); background: #fbfdfc; }

.grid { display: grid; gap: 16px; }
.metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metric { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 19px; min-height: 128px; position: relative; overflow: hidden; box-shadow: var(--shadow); }
.metric::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--teal-2); }
.metric.orange::before { background: var(--orange); }
.metric.green::before { background: var(--green); }
.metric.amber::before { background: var(--amber); }
.metric.danger::before { background: var(--danger); }
.metric.danger .metric-value { color: var(--danger); }
.metric-label { color: var(--muted); font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.metric-value { margin-top: 12px; font-size: clamp(23px, 2.3vw, 32px); font-weight: 900; letter-spacing: -.04em; }
.metric-note { margin-top: 5px; color: var(--muted); font-size: 12px; }

.two-col { grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); margin-top: 18px; }
.card { background: var(--white); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); overflow: hidden; }
.card-pad { padding: 21px; }
.card-header { padding: 18px 20px; border-bottom: 1px solid var(--line); display: flex; gap: 14px; align-items: center; justify-content: space-between; }
.card-header h2, .card-header h3 { margin: 0; font-size: 17px; }
.card-header p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.section-title { margin: 26px 0 13px; display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.section-title h2 { margin: 0; font-size: 21px; }
.section-title p { margin: 5px 0 0; color: var(--muted); }

.separation-note { border: 1px solid #f0d6b0; background: #fff8ec; border-radius: 16px; padding: 16px 18px; display: flex; gap: 13px; align-items: flex-start; margin-bottom: 18px; }
.separation-note b { display: block; margin-bottom: 3px; }
.separation-note p { margin: 0; color: #77562a; font-size: 13px; line-height: 1.45; }
.notice-icon { width: 31px; height: 31px; flex: 0 0 auto; border-radius: 50%; display: grid; place-items: center; background: var(--amber); color: #50360d; font-weight: 900; }
.cash-discrepancy-alert { width: 100%; margin: 0 0 18px; padding: 16px 18px; display: flex; align-items: center; gap: 14px; border: 1px solid #efc8c6; border-left: 5px solid var(--danger); border-radius: 16px; background: #fff4f3; color: var(--ink); text-align: left; cursor: pointer; box-shadow: 0 10px 28px rgba(132,47,47,.1); }
.cash-discrepancy-alert.surplus { border-color: #efd59e; border-left-color: var(--amber); background: #fff9e9; }
.cash-discrepancy-icon { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--danger); color: white; font-size: 19px; font-weight: 900; }
.cash-discrepancy-alert.surplus .cash-discrepancy-icon { background: var(--amber); color: #50360d; }
.cash-discrepancy-alert div { flex: 1; }
.cash-discrepancy-alert strong { display: block; font-size: 15px; }
.cash-discrepancy-alert p { margin: 4px 0 0; color: #7d4340; font-size: 13px; line-height: 1.4; }
.cash-discrepancy-alert.surplus p { color: #77562a; }
.cash-discrepancy-alert > b { color: var(--danger); font-size: 12px; white-space: nowrap; }
.cash-discrepancy-alert.surplus > b { color: #8a6517; }

.table-wrap { overflow: auto; }
table { border-collapse: collapse; width: 100%; min-width: 820px; }
th { padding: 11px 14px; text-align: left; color: var(--muted); background: #f6f9f8; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 13px 14px; border-bottom: 1px solid #edf2f1; font-size: 13px; vertical-align: middle; }
td small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
tbody tr:hover { background: #fbfdfc; }
.money { text-align: right; font-variant-numeric: tabular-nums; font-weight: 750; white-space: nowrap; }
.management-line { display: block; white-space: nowrap; font-size: 11px; color: var(--muted); }
.management-line + .management-line { margin-top: 3px; }
.green-text { color: #287a3b; }
.profit-money { color: #278445; font-weight: 900; }
.profit-money small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; font-weight: 700; }
.profit-formula { margin-bottom: 18px; padding: 18px 21px; display: grid; grid-template-columns: 1fr auto 1fr auto 1.15fr; align-items: center; gap: 16px; }
.profit-formula > b { color: var(--muted); font-size: 22px; }
.profit-formula span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.profit-formula strong { display: block; font-size: clamp(20px, 2.2vw, 29px); letter-spacing: -.03em; }
.profit-result { border-radius: 14px; padding: 13px 15px; background: #e9f6ec; }
.profit-result span, .profit-result strong { color: #287a3d; }
.profit-metrics { margin-bottom: 18px; }
.profit-reference { margin-top: 24px; }
.expense-month-bar { margin-bottom: 18px; padding: 14px 16px; display: flex; align-items: center; gap: 14px; }
.expense-month-bar > div { margin-right: auto; }
.expense-month-bar span { display: block; margin-bottom: 2px; color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.expense-month-bar strong { display: block; text-transform: capitalize; }
.expense-month-bar input { border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; color: var(--ink); background: #fbfdfc; font-weight: 750; }
.bill-upload-note { margin: 18px 0; border: 1px solid #c8e1dd; border-radius: 16px; padding: 16px 18px; display: flex; gap: 13px; align-items: flex-start; background: #f0f8f7; }
.bill-upload-note b { display: block; margin-bottom: 3px; }
.bill-upload-note p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.row-actions { display: flex; gap: 6px; white-space: nowrap; }
.muted { color: var(--muted); }
.badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 99px; padding: 5px 9px; background: #eaf3f2; color: var(--teal-2); font-size: 11px; font-weight: 850; white-space: nowrap; }
.badge.green { background: #e8f6eb; color: #287a3b; }
.badge.orange { background: #fff0e9; color: #b8491c; }
.badge.amber { background: #fff5db; color: #8b6615; }
.badge.gray { background: #edf1f1; color: #5e7072; }
.empty { text-align: center; padding: 46px 20px; color: var(--muted); }
.empty strong { color: var(--ink); display: block; margin-bottom: 5px; font-size: 16px; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.form-grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.field { display: grid; gap: 6px; }
.field.full { grid-column: 1 / -1; }
.field label { font-size: 12px; font-weight: 850; color: #506467; }
.field input, .field select, .field textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; background: #fbfdfc; padding: 10px 11px; color: var(--ink); outline: none; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--teal-2); box-shadow: 0 0 0 3px rgba(30,105,112,.12); }
.field textarea { min-height: 76px; resize: vertical; }
.form-actions { grid-column: 1/-1; display: flex; justify-content: flex-end; gap: 10px; padding-top: 3px; }
.helper { font-size: 11px; color: var(--muted); line-height: 1.4; }
.input-readonly { min-height: 46px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #f4f8f7; display: grid; gap: 2px; }
.input-readonly strong { font-size: 13px; }
.input-readonly span { color: var(--muted); font-size: 11px; }
.appearance-settings { grid-column: 1/-1; display: grid; gap: 14px; padding: 16px; border: 1px solid #cfe0dd; border-radius: 16px; background: #f7fbfa; }
.appearance-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.appearance-heading h3 { margin: 0 0 4px; }
.appearance-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.appearance-color-grid { display: grid; grid-template-columns: repeat(2,minmax(150px,.55fr)) minmax(230px,1.2fr); gap: 12px; align-items: stretch; }
.appearance-color-field { display: grid; align-content: start; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: #fff; font-weight: 800; }
.appearance-color-field input[type="color"] { width: 100%; height: 58px; padding: 4px; border: 1px solid var(--line); border-radius: 11px; background: #fff; cursor: pointer; }
.appearance-color-field code { color: var(--muted); font-size: 12px; }
.appearance-sidebar-preview { display: grid; align-content: start; gap: 7px; padding: 14px; border-radius: 14px; background: var(--preview-sidebar-bg); color: var(--preview-sidebar-text); box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--preview-sidebar-text) 15%,transparent); transition: background .18s ease,color .18s ease; }
.appearance-preview-brand { display: flex; align-items: center; gap: 9px; padding-bottom: 8px; border-bottom: 1px solid color-mix(in srgb,var(--preview-sidebar-text) 16%,transparent); }
.appearance-preview-brand > span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 9px; font-weight: 900; }
.appearance-preview-link { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 9px; font-size: 12px; font-weight: 800; opacity: .82; }
.appearance-preview-link.active { background: var(--preview-sidebar-text); color: var(--preview-sidebar-bg); opacity: 1; }
.appearance-presets { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.appearance-presets > span { width: 100%; color: var(--muted); font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .04em; }
.appearance-preset { display: flex; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--ink); cursor: pointer; font: inherit; font-size: 11px; }
.appearance-preset i { width: 32px; height: 24px; display: grid; place-items: center; border-radius: 7px; background: var(--preset-bg); color: var(--preset-text); font-style: normal; font-weight: 900; }
.appearance-preset:hover { border-color: var(--teal-2); box-shadow: 0 4px 12px rgba(21,63,69,.08); }

.branding-manager { margin-bottom: 18px; border-top: 4px solid var(--brand-primary); }
.branding-form { display: grid; gap: 18px; margin-top: 18px; }
.branding-preview { display: flex; align-items: center; gap: 16px; padding: 18px; border: 1px solid color-mix(in srgb,var(--brand-primary) 22%,var(--line)); border-radius: 16px; background: linear-gradient(135deg,color-mix(in srgb,var(--brand-primary) 8%,white),white); }
.branding-preview-logo { width: 78px; height: 78px; flex: 0 0 78px; display: grid; place-items: center; overflow: hidden; border-radius: 21px; background: var(--brand-primary); color: #fff; font-size: 27px; font-weight: 950; letter-spacing: -.04em; box-shadow: 0 10px 25px color-mix(in srgb,var(--brand-primary) 22%,transparent); }
.branding-preview-logo.has-logo { background: #fff; border: 1px solid var(--line); }
.branding-preview-logo img { width: 100%; height: 100%; padding: 5px; object-fit: contain; }
.branding-preview > div:last-child { display: grid; gap: 3px; }
.branding-preview strong { color: var(--brand-primary); font-size: 21px; }
.branding-preview small { color: var(--brand-accent); font-weight: 900; text-transform: uppercase; letter-spacing: .07em; }
.branding-preview span { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.branding-fields input[type="color"] { min-height: 52px; padding: 4px; cursor: pointer; }

.upload-zone { border: 2px dashed #a8c8c5; background: #f4faf9; border-radius: 18px; padding: 31px 22px; text-align: center; transition: .18s ease; }
.upload-zone.dragging { border-color: var(--orange); background: #fff8f2; }
.upload-zone h3 { margin: 9px 0 5px; }
.upload-zone p { margin: 0 auto 15px; color: var(--muted); max-width: 530px; line-height: 1.5; }
.upload-symbol { font-size: 30px; }
.processor-list { display: grid; gap: 10px; }
.processor-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
.processor-row:last-child { border-bottom: 0; }
.processor-row strong { display: block; font-size: 13px; }
.processor-row small { color: var(--muted); }
.processor-row span { font-weight: 900; }
.branch-manager { margin-bottom: 18px; }
.access-manager { margin-bottom: 18px; }
.access-list { display: grid; }
.access-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.access-row:last-child { border-bottom: 0; padding-bottom: 0; }
.access-row strong, .access-row small { display: block; }
.access-row small { margin-top: 4px; color: var(--muted); }
.access-help { display: block; margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--line); }
.account-summary { padding-top: 16px; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)) auto; gap: 12px; align-items: end; }
.account-summary > div { min-width: 0; }
.account-summary span, .account-summary strong { display: block; }
.account-summary span { margin-bottom: 4px; color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.account-summary strong { overflow: hidden; text-overflow: ellipsis; }
.check-list { max-height: 260px; overflow: auto; display: grid; gap: 8px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: #f8fbfa; }
.check-row { display: flex; align-items: center; gap: 11px; padding: 10px; border-radius: 9px; background: white; cursor: pointer; }
.check-row input { width: 18px; height: 18px; accent-color: var(--teal-2); }
.check-row span, .check-row strong, .check-row small { display: block; }
.check-row small { margin-top: 2px; color: var(--muted); }
.card-header-inline { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.card-header-inline h2, .settings-section-title h2 { margin: 0; font-size: 19px; }
.card-header-inline p, .settings-section-title p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.branch-count { border-radius: 99px; padding: 7px 10px; background: #eaf3f2; color: var(--teal-2); font-size: 11px; font-weight: 850; white-space: nowrap; }
.branch-list { display: grid; }
.branch-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.branch-row:last-child { border-bottom: 0; padding-bottom: 0; }
.branch-row-main { display: flex; align-items: center; gap: 12px; min-width: 0; }
.branch-row-main strong { display: block; }
.branch-row-main small { display: block; margin-top: 3px; color: var(--muted); }
.branch-avatar { width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 13px; background: var(--teal); color: white; font-size: 13px; font-weight: 900; letter-spacing: .04em; }
.branch-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.button:disabled { opacity: .42; cursor: not-allowed; transform: none; }
.settings-section-title { grid-column: 1 / -1; padding-bottom: 4px; }
.version-card { margin-top: 18px; border: 1px solid var(--line); border-radius: 14px; padding: 13px 14px; background: #f4f9f8; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.version-card span, .version-card strong { display: block; }
.version-card span { margin-bottom: 3px; color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.version-card b { border-radius: 99px; padding: 6px 9px; color: white; background: var(--teal-2); font-size: 11px; white-space: nowrap; }

.checklist-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-bottom: 18px; }
.check-card { min-height: 88px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: white; display: flex; align-items: center; gap: 13px; box-shadow: var(--shadow); }
.check-card > span { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%; display: grid; place-items: center; font-weight: 900; }
.check-card.done > span { color: #287a3b; background: #e8f6eb; }
.check-card.warning > span { color: #8b6615; background: #fff5db; }
.check-card strong, .check-card small { display: block; }
.check-card small { margin-top: 4px; color: var(--muted); }
.monthly-certificate { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; border-top: 4px solid var(--green); }
.monthly-certificate span, .monthly-certificate strong, .monthly-certificate small { display: block; }
.monthly-certificate span { color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.monthly-certificate strong { margin-top: 5px; font-size: 21px; }
.monthly-certificate small { margin-top: 4px; color: var(--muted); }
.report-builder { align-items: start; }
.report-options { display: grid; gap: 9px; margin-top: 18px; }
.report-actions { justify-content: flex-start; margin-top: 18px; }
.report-preview { background: #f8fbfa; }
.report-preview pre { margin: 18px 0 0; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: white; color: var(--ink); white-space: pre-wrap; word-break: break-word; font: 13px/1.65 ui-monospace, SFMono-Regular, Consolas, monospace; }

.principal-audit-metrics { grid-template-columns: repeat(5,minmax(0,1fr)); margin-top: 18px; }
.audit-progress-card { margin-top: 18px; }
.audit-progress-card > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.audit-progress-card p { margin: 9px 0 0; color: var(--muted); font-size: 12px; }
.audit-progress { height: 11px; margin-top: 13px; overflow: hidden; border-radius: 99px; background: #e5edeb; }
.audit-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--teal-2),var(--green)); transition: width .2s ease; }
.audit-occurrences { display: grid; gap: 8px; min-width: 420px; }
.audit-occurrences > div { padding: 8px 10px; border: 1px solid #eaded7; border-radius: 9px; background: rgba(255,255,255,.75); }
.audit-occurrences small { margin-top: 2px; }
.audit-flags { display: flex; flex-wrap: wrap; gap: 5px; }
.principal-audit-table .audit-duplicate-row { background: #fff3ed; }
.principal-audit-table .audit-special-row { background: #fff9e8; }
.principal-audit-table .audit-duplicate-row:hover { background: #ffebe1; }
.principal-audit-table .audit-special-row:hover { background: #fff4d5; }
.notice.warning.audit-errors { margin: 18px 0; padding: 14px 16px; border: 1px solid #efcfcb; border-left: 4px solid var(--danger); border-radius: 13px; background: #fff5f4; color: #7d3434; }
.notice.warning.audit-errors p { margin: 5px 0 0; line-height: 1.5; }

.receiving-empty { min-height: 300px; display: grid; place-items: center; align-content: center; gap: 13px; padding: 42px; text-align: center; }
.receiving-empty > span { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 20px; background: #e8f5f3; color: var(--teal-2); font-size: 32px; font-weight: 900; }
.receiving-empty h2, .receiving-empty p { margin: 0; }
.receiving-empty p { max-width: 680px; color: var(--muted); line-height: 1.55; }
.receiving-counter { display: grid; grid-template-columns: minmax(260px,1fr) minmax(220px,.8fr) auto; align-items: center; gap: 24px; margin-bottom: 18px; padding: 24px 28px; border-left: 6px solid var(--green); background: linear-gradient(135deg,#fff,#f0faf6); }
.receiving-counter div:first-child { min-width: 0; }
.receiving-counter span, .receiving-counter strong, .receiving-counter small { display: block; }
.receiving-counter div:first-child > span { color: var(--muted); font-size: 11px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.receiving-counter strong { margin-top: 5px; color: var(--ink); font-size: clamp(28px,3.2vw,44px); line-height: 1.05; }
.receiving-counter small { margin-top: 7px; color: var(--muted); }
.receiving-counter > b { color: var(--teal); font-size: 24px; }
.receiving-progress { height: 17px; overflow: hidden; border-radius: 99px; background: #dfeae7; box-shadow: inset 0 1px 3px rgba(21,63,69,.12); }
.receiving-progress > span { height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--teal-2),var(--green)); transition: width .18s ease; }
.receiving-metrics { margin-bottom: 18px; }
.receiving-feedback { display: flex; align-items: center; gap: 14px; margin: 18px 0; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: #f6f9f8; }
.receiving-feedback > span { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--teal-2); font-size: 23px; font-weight: 900; }
.receiving-feedback strong { display: block; }
.receiving-feedback p { margin: 4px 0 0; color: var(--muted); line-height: 1.4; }
.receiving-feedback.accepted { border-color: #a8ddbe; background: #effaf4; }
.receiving-feedback.accepted > span { background: var(--green); }
.receiving-feedback.duplicate { border-color: #efcf87; background: #fff8e7; }
.receiving-feedback.duplicate > span { background: var(--amber); color: #3e2e0f; }
.receiving-feedback.unknown { border-color: #efb8b1; background: #fff3f1; }
.receiving-feedback.unknown > span { background: var(--danger); }
.receiving-scanner { padding: 22px; border: 2px solid #9bcfc7; box-shadow: 0 16px 38px rgba(31,105,112,.12); }
.receiving-scanner > label { display: block; margin-bottom: 10px; color: var(--ink); font-size: 17px; font-weight: 900; }
.receiving-scanner > div { display: flex; gap: 10px; }
.receiving-scanner input { flex: 1 1 auto; min-width: 0; min-height: 64px; padding: 0 18px; border: 2px solid #7bb9b1; border-radius: 13px; outline: none; background: #fbfefd; color: var(--teal); font: inherit; font-size: 22px; font-weight: 900; letter-spacing: .045em; text-transform: uppercase; }
.receiving-scanner input:focus { border-color: var(--teal-2); box-shadow: 0 0 0 4px rgba(36,119,124,.12); }
.receiving-scanner input[readonly] { pointer-events: none; caret-color: transparent; }
.receiving-single-diagnostic { margin: 10px 0 12px; }
.receiving-scanner > div .button { min-width: 175px; }
.receiving-scanner > small { display: block; margin-top: 10px; color: var(--muted); line-height: 1.4; }
.receiving-closed { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 15px; padding: 20px 22px; border: 1px solid #a8ddbe; background: #effaf4; }
.receiving-closed > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: white; font-size: 23px; font-weight: 900; }
.receiving-closed strong { display: block; }
.receiving-closed p { margin: 5px 0 0; color: var(--muted); }
.receiving-list-title { align-items: flex-end; }
.receiving-table { min-width: 980px; }
.receiving-history-table { min-width: 820px; }
.receiving-table td small, .receiving-history-table td small { display: block; margin-top: 4px; color: var(--muted); }
.receiving-table .receiving-row-done { background: #f1faf5; }
.receiving-table .receiving-row-done:hover { background: #e8f6ee; }
.receiving-manual-badge { display: table; margin-top: 6px; }
.receiving-manual-panel { margin-bottom: 16px; padding: 18px; border: 1px solid #e5c983; border-left: 5px solid var(--amber); background: linear-gradient(135deg,#fffaf0,#fff); }
.receiving-manual-heading { display: flex; align-items: flex-start; gap: 13px; }
.receiving-manual-heading > span { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; color: #704d09; background: #ffe5a9; font-size: 22px; font-weight: 900; }
.receiving-manual-heading h3 { margin: 0; font-size: 17px; }
.receiving-manual-heading p { margin: 4px 0 0; color: #735c31; font-size: 12px; line-height: 1.45; }
.receiving-manual-options { max-height: 380px; margin-top: 15px; padding: 3px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; overflow-y: auto; overscroll-behavior: contain; }
.receiving-manual-option { min-width: 0; padding: 12px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 11px; border: 1px solid #eadfc7; border-radius: 13px; background: #fff; cursor: pointer; transition: border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.receiving-manual-option:hover { border-color: #d6af59; }
.receiving-manual-option.selected, .receiving-manual-option:has(input:checked) { border-color: #bd8320; background: #fff5d9; box-shadow: inset 0 0 0 1px #bd8320; }
.receiving-manual-option input { width: 20px; height: 20px; margin: 0; accent-color: #bd8320; }
.receiving-manual-option span { min-width: 0; }
.receiving-manual-option strong, .receiving-manual-option small, .receiving-manual-option em { display: block; }
.receiving-manual-option strong { overflow: hidden; color: var(--teal); text-overflow: ellipsis; white-space: nowrap; }
.receiving-manual-option small { margin-top: 3px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.receiving-manual-option em { margin-top: 4px; color: #8a6517; font-size: 10px; font-style: normal; }
.receiving-manual-option b { color: #8a6517; font-size: 10px; text-transform: uppercase; }
.receiving-manual-option input:disabled { cursor: not-allowed; }
.receiving-manual-option:has(input:disabled) { cursor: not-allowed; opacity: .62; }
.receiving-manual-footer { margin-top: 13px; padding-top: 13px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #eadfc7; }
.receiving-manual-footer > span { color: #725819; font-size: 12px; font-weight: 850; }
.receiving-manual-footer .button:disabled { cursor: not-allowed; opacity: .55; transform: none; }
.receiving-manual-confirm-list { max-height: 300px; display: grid; gap: 8px; overflow-y: auto; }
.receiving-manual-confirm-item { padding: 11px 12px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 12px; background: #f8fbfa; }
.receiving-manual-confirm-item > span { flex: 0 0 28px; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); font-weight: 900; }
.receiving-manual-confirm-item strong, .receiving-manual-confirm-item small { display: block; }
.receiving-manual-confirm-item small { margin-top: 3px; color: var(--muted); }
.receiving-manual-confirm-check { border: 1px solid #e5c983; background: #fffaf0; }
.receiving-checkmark, .receiving-pending-dot { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; font-weight: 900; }
.receiving-checkmark { background: #dff4e7; color: #25794b; }
.receiving-pending-dot { background: #fff1cf; color: #9a6b0d; font-size: 21px; }
.receiving-scan-entry { align-items: stretch; }
.receiving-camera-button { color: white; border-color: #ee6c35; background: #ee6c35; }
.receiving-camera-button:hover { border-color: #d95e2c; background: #d95e2c; }
body.receiving-camera-open { overflow: hidden; overscroll-behavior: none; }
.receiving-camera-overlay { position: fixed; inset: 0; z-index: 600; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; overflow: hidden; color: white; background: #0a2226; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.receiving-camera-head { min-height: 86px; padding: max(14px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 14px max(20px,env(safe-area-inset-left)); display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid rgba(255,255,255,.13); background: #11383d; }
.receiving-camera-head div { min-width: 0; }
.receiving-camera-head span, .receiving-camera-head strong, .receiving-camera-head small { display: block; }
.receiving-camera-head span { color: #91d8c3; font-size: 11px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.receiving-camera-head strong { margin-top: 3px; font-size: 21px; }
.receiving-camera-head small { margin-top: 3px; overflow: hidden; color: #b8ccce; text-overflow: ellipsis; white-space: nowrap; }
.receiving-camera-finish { flex: 0 0 auto; color: #17363a; border-color: white; background: white; }
.receiving-camera-layout { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0,1.45fr) minmax(320px,.55fr); }
.receiving-camera-preview { position: relative; min-height: 0; overflow: hidden; background: #02090a; }
.receiving-camera-preview video { width: 100%; height: 100%; display: block; object-fit: cover; background: #02090a; }
.receiving-camera-guide { position: absolute; inset: 50% auto auto 50%; width: min(74%,720px); aspect-ratio: 1.9; translate: -50% -50%; pointer-events: none; }
.receiving-camera-guide i { position: absolute; inset: 0; border: 3px solid rgba(255,255,255,.9); border-radius: 22px; box-shadow: 0 0 0 999px rgba(0,0,0,.3), inset 0 0 28px rgba(29,218,156,.12); }
.receiving-camera-guide i::before { content: ""; position: absolute; left: 7%; right: 7%; top: 50%; height: 2px; background: linear-gradient(90deg,transparent,#62e0a5 18%,#62e0a5 82%,transparent); box-shadow: 0 0 16px #62e0a5; animation: receiving-scan-line 1.8s ease-in-out infinite; }
.receiving-camera-guide span { position: absolute; left: 0; right: 0; top: calc(100% + 17px); text-align: center; color: white; font-size: 14px; font-weight: 800; text-shadow: 0 2px 9px #000; }
@keyframes receiving-scan-line { 0%,100% { translate: 0 -70px; opacity: .45; } 50% { translate: 0 70px; opacity: 1; } }
.receiving-camera-engine { position: absolute; left: 50%; bottom: max(18px,env(safe-area-inset-bottom)); translate: -50% 0; max-width: min(88%,720px); padding: 9px 14px; border-radius: 99px; color: white; background: rgba(9,33,37,.82); font-size: 13px; font-weight: 800; text-align: center; backdrop-filter: blur(10px); }
.receiving-camera-engine.ready { color: #c8f9df; background: rgba(19,93,69,.86); }
.receiving-camera-engine.error { color: #fff0ed; border: 1px solid rgba(255,159,146,.55); border-radius: 14px; background: rgba(130,44,33,.92); }
.receiving-camera-panel { min-height: 0; padding: 22px; overflow-y: auto; color: #17363a; background: #f4f8f7; }
.receiving-camera-count, .receiving-camera-result, .receiving-camera-recent, .receiving-camera-privacy { border: 1px solid #d6e3e1; border-radius: 18px; background: white; box-shadow: 0 10px 28px rgba(0,0,0,.08); }
.receiving-camera-count { padding: 20px; }
.receiving-camera-count > span, .receiving-camera-count > strong, .receiving-camera-count > small { display: block; }
.receiving-camera-count > span { color: #6b7d80; font-size: 11px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.receiving-camera-count > strong { margin: 3px 0; color: #1b8d58; font-size: 56px; line-height: 1; }
.receiving-camera-count > small { color: #647679; line-height: 1.45; }
.receiving-camera-progress { height: 9px; margin-top: 14px; overflow: hidden; border-radius: 99px; background: #deebe8; }
.receiving-camera-progress i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#24777c,#36b96f); transition: width .18s ease; }
.receiving-camera-result { min-height: 92px; margin-top: 14px; padding: 15px; display: flex; align-items: center; gap: 13px; }
.receiving-camera-result > span { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: white; background: #24777c; font-size: 22px; font-weight: 900; }
.receiving-camera-result strong { display: block; }
.receiving-camera-result p { margin: 4px 0 0; color: #647679; font-size: 13px; line-height: 1.35; }
.receiving-camera-result.accepted { border-color: #8fd3ae; background: #edfaf3; }
.receiving-camera-result.accepted > span { background: #2ca968; }
.receiving-camera-result.duplicate { border-color: #e7c46d; background: #fff8e7; }
.receiving-camera-result.duplicate > span { color: #49340d; background: #f4bd46; }
.receiving-camera-result.unknown { border-color: #e9a79e; background: #fff0ee; }
.receiving-camera-result.unknown > span { background: #c54838; }
.receiving-camera-actions { margin: 14px 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.receiving-camera-actions .button { min-width: 0; padding-inline: 10px; }
.receiving-camera-actions .button[hidden] { display: none; }
.receiving-camera-recent { padding: 16px; }
.receiving-camera-recent > strong { display: block; margin-bottom: 9px; }
.receiving-camera-recent > div { color: #6b7d80; font-size: 13px; }
.receiving-camera-recent > div > div { padding: 8px 0; display: flex; align-items: center; gap: 9px; border-top: 1px solid #e5eceb; }
.receiving-camera-recent > div > div:first-child { border-top: 0; }
.receiving-camera-recent div span { flex: 0 0 26px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: #267e4f; background: #dff4e7; font-weight: 900; }
.receiving-camera-recent p, .receiving-camera-recent small { margin: 0; display: block; }
.receiving-camera-recent p { min-width: 0; }
.receiving-camera-recent small { margin-top: 2px; overflow: hidden; color: #728386; text-overflow: ellipsis; white-space: nowrap; }
.receiving-camera-privacy { margin: 14px 0 max(6px,env(safe-area-inset-bottom)); padding: 13px 15px; color: #6b7d80; font-size: 12px; line-height: 1.45; }

.modal-backdrop { position: fixed; inset: 0; background: rgba(7,32,36,.62); display: grid; place-items: center; z-index: 30; padding: 20px; }
.modal { width: min(980px, 100%); max-height: min(88vh, 820px); background: white; border-radius: 20px; box-shadow: 0 30px 80px rgba(0,0,0,.25); display: flex; flex-direction: column; overflow: hidden; }
.modal-head, .modal-foot { flex: 0 0 auto; padding: 18px 21px; display: flex; justify-content: space-between; align-items: center; gap: 14px; border-bottom: 1px solid var(--line); }
.modal-head h2 { margin: 0; font-size: 20px; }
.modal-head p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.modal-body { flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 18px 21px; }
.modal-foot { border-top: 1px solid var(--line); border-bottom: 0; }
.preview-stats { grid-template-columns: repeat(3,1fr); margin-bottom: 15px; }
.pdf-preview-stats { grid-template-columns: repeat(5,minmax(0,1fr)); }
.preview-stat { padding: 13px; background: #f5f9f8; border-radius: 12px; }
.preview-stat span { display:block; color: var(--muted); font-size: 11px; text-transform: uppercase; font-weight: 850; }
.preview-stat b { display:block; margin-top: 4px; font-size: 18px; }
.pdf-special-note { margin-bottom: 15px; }
.pdf-special-table { min-width: 1050px; }
.pdf-special-table tr { transition: background .18s ease; }
.pdf-special-table .pdf-special-row { background: #fff8e9; }
.pdf-special-table td small { display: block; margin-top: 3px; color: var(--muted); }
.pdf-special-toggle { display: inline-flex; align-items: center; gap: 7px; min-width: 128px; font-weight: 800; color: var(--teal); cursor: pointer; }
.pdf-special-toggle input { width: 18px; height: 18px; accent-color: var(--orange); }
.pdf-special-toggle.disabled { color: var(--muted); cursor: not-allowed; opacity: .65; }
.pdf-actual-input { width: 132px; min-width: 0; padding: 9px 10px; text-align: right; font: inherit; font-weight: 850; color: var(--teal); border: 1px solid var(--line); border-radius: 9px; background: white; }
.pdf-actual-input:disabled { color: var(--muted); background: #f1f5f4; opacity: .8; }
.cash-report-table { min-width: 1120px; }
.cash-report-table td:first-child { min-width: 150px; }
.cash-report-table td:nth-child(2) { min-width: 210px; }
.cash-report-table .row-actions { min-width: 185px; }
.cash-report-note { margin: 16px 0 6px; }
.receipt-preview { display: grid; grid-template-columns: minmax(220px,.75fr) minmax(360px,1.25fr); gap: 22px; align-items: start; }
.receipt-photo { display: grid; gap: 8px; }
.receipt-photo img { width: 100%; max-height: 520px; object-fit: contain; border: 1px solid var(--line); border-radius: 14px; background: #f4f7f6; }
.receipt-photo span { color: var(--muted); font-size: 11px; line-height: 1.4; }
.install-guide { display: grid; grid-template-columns: 150px 1fr; gap: 24px; align-items: center; }
.install-guide img { width: 150px; height: 150px; border-radius: 30px; box-shadow: 0 12px 30px rgba(21,63,69,.18); }
.install-steps { margin: 0; padding-left: 22px; display: grid; gap: 10px; line-height: 1.5; }
.ocr-loading { min-height: 260px; display: grid; place-items: center; align-content: center; gap: 12px; text-align: center; }
.ocr-symbol { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; background: #e8f5f3; color: var(--teal-2); font-size: 29px; }
.ocr-progress { width: min(440px,90%); height: 10px; overflow: hidden; border-radius: 99px; background: #e8eeed; }
.ocr-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--teal-2),var(--green)); transition: width .2s ease; }
.ocr-loading small { color: var(--muted); }
.toast { position: fixed; right: 24px; bottom: 24px; max-width: 360px; padding: 13px 16px; background: var(--teal); color: white; border-radius: 12px; box-shadow: var(--shadow); z-index: 50; font-weight: 750; animation: toast-in .25s ease; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }
.loading { opacity: .6; pointer-events: none; }
.right { text-align: right; }
.danger-text { color: var(--danger); }

@media (max-width: 1100px) {
  .metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .two-col { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .app-shell { display: block; min-height: 100vh; min-height: 100dvh; padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
  .sidebar {
    position: fixed !important;
    top: auto !important;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(76px + env(safe-area-inset-bottom, 0px));
    max-height: none;
    padding: 7px 9px calc(7px + env(safe-area-inset-bottom, 0px));
    flex-direction: row;
    overflow: hidden;
    background: color-mix(in srgb,var(--sidebar-bg) 97%,transparent);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    isolation: isolate;
    z-index: 100;
  }
  .brand, .sidebar-foot { display: none; }
  .nav { flex: 1 1 auto; min-width: 0; width: auto; display: flex; gap: 3px; overflow: hidden; }
  .nav::-webkit-scrollbar { display: none; }
  .nav-button { flex: 1 1 0; min-width: 0; padding: 7px 2px; display: grid; place-items: center; gap: 1px; font-size: 8px; text-align: center; border-radius: 9px; }
  .nav-button.mobile-secondary { display: none; }
  .nav-button.active { background: color-mix(in srgb,var(--sidebar-text) 18%,transparent); color: var(--sidebar-text); box-shadow: none; }
  .nav-icon { font-size: 18px; }
  .mobile-more { display: grid; flex: 0 0 64px; margin-left: 5px; border-left: 1px solid color-mix(in srgb,var(--sidebar-text) 18%,transparent); color: var(--sidebar-text); background: color-mix(in srgb,var(--sidebar-text) 8%,transparent); }
  .main { padding: calc(20px + env(safe-area-inset-top, 0px)) 14px calc(45px + env(safe-area-inset-bottom, 0px)); }
  .branch-bar { align-items: stretch; flex-wrap: wrap; }
  .branch-current { width: 100%; }
  .version-pill { order: 3; align-self: center; }
  .branch-select { flex: 1; }
  .branch-select select { width: 100%; min-width: 0; }
  .branch-bar .button { width: auto; }
  .topbar { display: block; }
  .top-actions { justify-content: flex-start; margin-top: 16px; }
  .period-bar { align-items: stretch; flex-wrap: wrap; }
  .period-bar strong { width: 100%; }
  .period-bar label { display: grid; gap: 5px; flex: 1; }
  .metrics { grid-template-columns: 1fr 1fr; gap: 10px; }
  .cash-discrepancy-alert { align-items: flex-start; padding: 14px; }
  .cash-discrepancy-alert p { font-size: 12px; }
  .cash-discrepancy-alert > b { display: none; }
  .metric { padding: 15px; min-height: 112px; }
  .metric-value { font-size: 21px; }
  .form-grid, .form-grid.three { grid-template-columns: 1fr; }
  .appearance-heading { flex-direction: column; }
  .appearance-color-grid { grid-template-columns: 1fr; }
  .appearance-sidebar-preview { min-height: 220px; }
  .appearance-preset { flex: 1 1 calc(50% - 8px); }
  .preview-stats { grid-template-columns: 1fr; }
  .receipt-preview { grid-template-columns: 1fr; }
  .receipt-photo img { max-height: 280px; }
  .install-guide { grid-template-columns: 1fr; text-align: left; }
  .install-guide img { width: 110px; height: 110px; margin: 0 auto; border-radius: 24px; }
  .profit-formula { grid-template-columns: 1fr; gap: 10px; }
  .profit-formula > b { display: none; }
  .expense-month-bar { align-items: stretch; flex-wrap: wrap; }
  .expense-month-bar > div { width: 100%; }
  .expense-month-bar input { flex: 1; min-width: 0; }
  .branch-row { align-items: flex-start; flex-direction: column; }
  .access-row { align-items: flex-start; flex-direction: column; }
  .account-summary { grid-template-columns: 1fr; }
  .checklist-grid, .monthly-certificate { grid-template-columns: 1fr; }
  .branch-row-actions { width: 100%; justify-content: flex-start; }
  .cash-movements-table th:last-child,
  .cash-movements-table td:last-child { position: sticky; right: 0; z-index: 1; background: #fff; box-shadow: -8px 0 14px rgba(21,63,69,.1); }
  .cash-movements-table th:last-child { z-index: 2; background: #f6f9f8; }
  .cash-movements-table tbody tr:hover td:last-child { background: #fbfdfc; }
  .cash-movements-table .row-actions .button { width: auto; }
  .modal-backdrop { z-index: 150; place-items: stretch center; padding: 7px; padding-top: max(7px, env(safe-area-inset-top, 0px)); padding-bottom: max(7px, env(safe-area-inset-bottom, 0px)); }
  .modal { width: 100%; max-height: calc(100dvh - 14px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .modal-body { padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)); }
  .notice-modal-foot { align-items: stretch; }
  .receiving-counter { grid-template-columns: minmax(0,1fr) auto; gap: 15px; padding: 19px; }
  .receiving-manual-panel { padding: 14px; }
  .receiving-manual-options { grid-template-columns: 1fr; max-height: 48dvh; }
  .receiving-manual-option { grid-template-columns: auto minmax(0,1fr); }
  .receiving-manual-option b { grid-column: 2; }
  .receiving-manual-footer { align-items: stretch; flex-direction: column; }
  .receiving-manual-footer .button { width: 100%; }
  .receiving-counter .receiving-progress { grid-column: 1 / -1; grid-row: 2; }
  .receiving-counter strong { font-size: clamp(25px,8vw,34px); }
  .receiving-counter > b { font-size: 20px; }
  .receiving-scanner > div { display: grid; }
  .receiving-scanner input { width: 100%; font-size: 18px; }
  .receiving-scanner > div .button { width: 100%; min-width: 0; }
  .receiving-closed { grid-template-columns: auto minmax(0,1fr); }
  .receiving-closed > .button { grid-column: 1 / -1; width: 100%; }
  .receiving-list-title { align-items: flex-start; flex-direction: column; }
  .receiving-camera-head { min-height: 78px; padding-top: max(10px,env(safe-area-inset-top)); padding-inline: 13px; }
  .receiving-camera-head strong { font-size: 17px; }
  .receiving-camera-head small { max-width: 52vw; font-size: 11px; }
  .receiving-camera-head .button { width: auto; min-height: 42px; padding-inline: 12px; font-size: 12px; }
  .receiving-camera-layout { display: flex; flex-direction: column; }
  .receiving-camera-preview { flex: 1 1 54%; min-height: 285px; }
  .receiving-camera-panel { flex: 0 1 46%; padding: 13px 13px calc(14px + env(safe-area-inset-bottom)); }
  .receiving-camera-guide { width: min(86%,580px); aspect-ratio: 1.65; }
  .receiving-camera-guide i { border-width: 2px; border-radius: 17px; }
  .receiving-camera-guide span { top: calc(100% + 11px); padding-inline: 10px; font-size: 12px; }
  .receiving-camera-engine { bottom: 10px; font-size: 11px; }
  .receiving-camera-count { padding: 14px 16px; }
  .receiving-camera-count > strong { font-size: 43px; }
  .receiving-camera-result { min-height: 76px; padding: 11px 13px; }
  .receiving-camera-result > span { flex-basis: 37px; width: 37px; height: 37px; }
  .receiving-camera-actions { margin: 10px 0; }
  .receiving-camera-recent { padding: 13px; }
  .receiving-camera-privacy { margin-top: 10px; }
}

@media (max-width: 430px) {
  .metrics { grid-template-columns: 1fr; }
  .button { width: 100%; }
  .top-actions { display: grid; }
  .notice-modal-foot { flex-direction: column-reverse; }
  .receiving-camera-head .button { width: auto; }
}
.global-alerts{display:grid;gap:10px;margin:14px 0 20px}.global-alerts:empty{display:none}.global-alert{width:100%;display:flex;align-items:center;gap:13px;padding:14px 16px;border:1px solid #ecd39c;border-radius:16px;background:#fff8e8;color:#17363a;text-align:left;cursor:pointer;box-shadow:0 10px 26px rgba(35,66,70,.08)}.global-alert>span{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:#f5b63f;color:#17363a;font-size:18px;font-weight:900}.global-alert div{display:grid;gap:3px}.global-alert strong{font-size:14px}.global-alert small{color:#6b5a37;line-height:1.35}.global-alert.approval-alert{border-color:#b9d9d3;background:#eef8f6}.global-alert.approval-alert>span{background:#24777c;color:#fff}.global-alert.approval-alert small{color:#517276}.nav-badge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-left:5px;border-radius:999px;background:#f5b63f;color:#17363a;font-size:11px;font-style:normal;font-weight:900}.nav-button.active .nav-badge{background:#fff;color:#1b5960}.pdf-credit-input{display:block;width:150px;min-height:38px;margin-top:7px}.pdf-special-table select[data-pdf-credit-customer]{min-width:220px}.pdf-special-table small[id^="pdf-credit-detail"]{display:block;margin-top:6px}.receivables-table{min-width:960px}.receivables-table .row-actions{min-width:270px;flex-wrap:wrap}.receivable-reminder-status{color:#28736b!important}.receivable-reminder-editor{margin-top:16px}.receivable-reminder-editor textarea{min-height:230px;line-height:1.55;resize:vertical}.receivable-reminder-last{display:grid;gap:3px;margin-top:12px;padding:12px 14px;border:1px solid #cfe1dd;border-radius:12px;background:#f6fbfa}.receivable-reminder-last span,.receivable-reminder-last small{color:#607778}.receivable-reminder-actions{flex-wrap:wrap}.receivable-template-example{grid-column:1/-1;padding:15px;border:1px solid #cfe1dd;border-radius:14px;background:#eef6f4}.receivable-template-example p{margin:8px 0 0;line-height:1.55;white-space:pre-wrap}.approval-table{min-width:1100px}.approval-table td:nth-child(3){min-width:270px}.approval-table td:nth-child(5){min-width:180px}

.receivable-customer-picker{padding:15px;border:1px solid #cfe0dd;border-radius:16px;background:#f7fbfa}
.receivable-customer-picker>input[type="search"]{min-height:48px;padding-left:14px;font-size:16px;background:#fff}
.receivable-customer-results{display:grid;gap:8px;max-height:310px;overflow:auto;padding:3px 2px 2px;overscroll-behavior:contain}
.receivable-customer-result{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 13px;border:1px solid #d7e4e1;border-radius:12px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}
.receivable-customer-result:hover,.receivable-customer-result:focus-visible{border-color:var(--teal-2);background:#edf7f5;outline:none;box-shadow:0 0 0 3px rgba(30,105,112,.1)}
.receivable-customer-result>span{display:grid;gap:3px;min-width:0}
.receivable-customer-result strong{overflow-wrap:anywhere}
.receivable-customer-result small{color:var(--muted);line-height:1.35}
.receivable-customer-result>b{flex:0 0 auto;padding:6px 9px;border-radius:999px;background:#dcefeb;color:#185c61;font-size:11px}
.receivable-customer-selected{display:flex;align-items:center;gap:11px;padding:12px 13px;border:1px solid #a9d1c9;border-radius:12px;background:#eaf7f3}
.receivable-customer-selected>span{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#24777c;color:#fff;font-weight:900}
.receivable-customer-selected>div{display:grid;gap:3px;min-width:0}
.receivable-customer-selected small{color:#527274;overflow-wrap:anywhere}
.receivable-customer-empty{display:grid;gap:4px;padding:15px;border:1px dashed #c6d8d5;border-radius:12px;background:#fff;color:var(--muted)}
.receivable-customer-empty strong{color:var(--ink)}

@media (max-width:760px){.global-alerts{margin:10px 0 16px}.global-alert{padding:12px;border-radius:14px}.global-alert small{font-size:12px}.nav-button .nav-badge{position:absolute;top:7px;right:7px;min-width:17px;height:17px;padding:0 4px;font-size:9px}.nav-button{position:relative}.pdf-special-table select[data-pdf-credit-customer]{min-width:190px}.pdf-credit-input{width:130px}.receivable-customer-picker{padding:12px}.receivable-customer-results{max-height:42vh}.receivable-customer-result{align-items:flex-start;padding:11px}.receivable-customer-result>b{margin-top:2px}}

.global-alert.notice-alert{border-color:#b9d9d3;background:linear-gradient(135deg,#eef8f6,#fff)}
.global-alert.notice-alert>span{background:#1e6970;color:#fff}
.global-alert.notice-alert small{color:#517276}
.badge.danger{background:#ffe8e5;color:#a83e35}
.notice-tabs{display:flex;gap:8px;margin:18px 0 22px;padding:6px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(31,67,70,.06);overflow-x:auto}
.notice-tabs button{min-height:40px;padding:0 16px;border:0;border-radius:11px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:850;white-space:nowrap;cursor:pointer}
.notice-tabs button.active{background:var(--teal);color:#fff;box-shadow:0 7px 18px rgba(21,63,69,.2)}
.notice-tabs em{display:inline-grid;place-items:center;min-width:19px;height:19px;margin-left:5px;padding:0 5px;border-radius:99px;background:var(--amber);color:#3c2b0c;font-size:10px;font-style:normal}
.notice-search{display:flex;align-items:center;gap:8px;min-height:42px;padding:0 11px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--muted)}
.notice-search input{width:min(280px,36vw);border:0;outline:0;background:transparent;font:inherit}
.notice-mode{display:flex;align-items:center;gap:14px;margin:18px 0;padding:16px 18px;border:1px solid #bddbd5;border-radius:17px;background:linear-gradient(135deg,#edf8f5,#fff);box-shadow:0 10px 26px rgba(35,66,70,.06)}
.notice-mode>span{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:#1e6970;color:#fff;font-weight:900}
.notice-mode>div{flex:1;min-width:0}
.notice-mode strong{display:block;margin-bottom:4px}
.notice-mode p{margin:0;color:#557175;font-size:13px;line-height:1.45}
.notice-mode.compact{grid-column:1/-1;margin:0;box-shadow:none}
.notice-overview{align-items:start}
.notice-group-list,.notice-upcoming{display:grid}
.notice-group{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:13px 18px;border-top:1px solid var(--line)}
.notice-group:first-child{border-top:0}
.notice-group>div{min-width:0}
.notice-group strong,.notice-group small,.notice-group span{display:block}
.notice-group small{margin-top:3px;color:var(--muted)}
.notice-group>div>span{margin-top:5px;color:#536d70;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notice-upcoming>div{display:flex;align-items:center;gap:12px;padding:13px 18px;border-top:1px solid var(--line)}
.notice-upcoming>div:first-child{border-top:0}
.notice-upcoming p{display:grid;gap:3px;margin:0}
.notice-upcoming small{color:var(--muted)}
.notice-package-table{min-width:1180px}
.notice-client-table{min-width:1050px}
.notice-history-table{min-width:1180px}
.notice-message-cell{max-width:360px;line-height:1.45;white-space:normal}
.notice-history-table .row-actions{white-space:normal;flex-wrap:wrap;min-width:230px}
.whatsapp-button{border-color:#aed8bd!important;background:#eaf8ef!important;color:#1f7138!important}
.notice-preview-list{display:grid;gap:9px}
.notice-preview-list label{display:flex;align-items:flex-start;gap:11px;padding:13px;border:1px solid var(--line);border-radius:13px;background:#fbfdfc;cursor:pointer}
.notice-preview-list input{margin-top:4px}
.notice-preview-list label>span{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 12px;flex:1;min-width:0}
.notice-preview-list strong{grid-column:1}
.notice-preview-list small{grid-column:1;color:var(--muted);line-height:1.4}
.notice-preview-list em{grid-column:2;grid-row:1/3;font-style:normal}
.notice-message-preview{margin-top:15px;padding:15px;border-radius:14px;background:#eef6f4}
.notice-message-preview p{margin:7px 0 0;line-height:1.55;white-space:pre-wrap}
.import-review-metrics{margin-top:0}

@media (max-width:760px){
  html,body,.app-shell,.main{max-width:100%;overflow-x:hidden;overflow-x:clip}
  body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--sidebar-bg);pointer-events:none;z-index:99}
  .main,.main>*,.topbar,.top-actions,.notice-overview,.notice-overview>*{min-width:0;max-width:100%}
  .notice-tabs{width:100%;max-width:100%;min-width:0;margin:12px 0 17px;padding:4px;border-radius:13px;overscroll-behavior-inline:contain;scrollbar-width:none}
  .notice-tabs::-webkit-scrollbar{display:none}
  .notice-tabs button{flex:0 0 auto;min-height:38px;padding:0 12px;font-size:11px}
  .section-title .row-actions{width:100%;flex-wrap:wrap;white-space:normal}
  .notice-search{width:100%}
  .notice-search input{width:100%}
  .notice-mode{display:grid;grid-template-columns:38px minmax(0,1fr);align-items:flex-start;max-width:100%;padding:14px;overflow:hidden}
  .notice-mode>span{grid-column:1;grid-row:1}
  .notice-mode>div:not(.row-actions){grid-column:2;grid-row:1;min-width:0;overflow-wrap:anywhere}
  .notice-mode>.row-actions{grid-column:1/-1;grid-row:2;width:100%;min-width:0;margin-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;white-space:normal}
  .notice-mode>.row-actions .button{width:100%;min-width:0;padding:8px 10px;white-space:normal;text-align:center;line-height:1.2;font-size:11px}
  .notice-group{grid-template-columns:minmax(0,1fr) auto;padding:12px 14px}
  .notice-group>.button{grid-column:1/-1;width:100%}
  .notice-group small,.notice-group>div>span,.notice-upcoming p,.notice-upcoming small{overflow-wrap:anywhere;white-space:normal}
  .notice-preview-list label>span{display:block}
  .notice-preview-list em{display:block;margin-top:8px}

  .notice-package-table,.notice-client-table,.notice-history-table{display:block;width:100%;min-width:0!important}
  .notice-package-table thead,.notice-client-table thead,.notice-history-table thead{display:none}
  .notice-package-table tbody,.notice-client-table tbody,.notice-history-table tbody{display:grid;width:100%;gap:12px;padding:12px}
  .notice-package-table tr,.notice-client-table tr,.notice-history-table tr{display:block;width:100%;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 7px 18px rgba(21,63,69,.06)}
  .notice-package-table td,.notice-client-table td,.notice-history-table td{display:grid;width:100%;grid-template-columns:minmax(88px,30%) minmax(0,1fr);align-items:start;gap:10px;padding:11px 12px;border-bottom:1px solid #edf2f1;vertical-align:top;overflow-wrap:anywhere}
  .notice-package-table td:last-child,.notice-client-table td:last-child,.notice-history-table td:last-child{border-bottom:0}
  .notice-package-table td::before,.notice-client-table td::before,.notice-history-table td::before{color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
  .notice-package-table td:nth-child(1)::before,.notice-client-table td:nth-child(1)::before{content:"Cliente"}
  .notice-package-table td:nth-child(2)::before{content:"Guía / tracking"}
  .notice-package-table td:nth-child(3)::before{content:"Detalle"}
  .notice-package-table td:nth-child(4)::before{content:"Disponible"}
  .notice-package-table td:nth-child(5)::before{content:"Vence"}
  .notice-package-table td:nth-child(6)::before{content:"Plazo"}
  .notice-package-table td:nth-child(7)::before{content:"Último aviso"}
  .notice-package-table td:nth-child(8)::before{content:"Estado"}
  .notice-package-table td:nth-child(9)::before,.notice-client-table td:nth-child(7)::before,.notice-history-table td:nth-child(6)::before{content:"Acciones"}
  .notice-client-table td:nth-child(2)::before{content:"Código"}
  .notice-client-table td:nth-child(3)::before{content:"WhatsApp"}
  .notice-client-table td:nth-child(4)::before{content:"Otros teléfonos"}
  .notice-client-table td:nth-child(5)::before{content:"Correo"}
  .notice-client-table td:nth-child(6)::before{content:"Actualizado"}
  .notice-history-table td:nth-child(1)::before{content:"Fecha"}
  .notice-history-table td:nth-child(2)::before{content:"Cliente"}
  .notice-history-table td:nth-child(3)::before{content:"Paquetes"}
  .notice-history-table td:nth-child(4)::before{content:"Mensaje"}
  .notice-history-table td:nth-child(5)::before{content:"Estado"}
  .notice-message-cell{max-width:none;min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}
  .notice-package-table .row-actions,.notice-client-table .row-actions,.notice-history-table .row-actions{display:grid;width:100%;min-width:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;white-space:normal}
  .notice-package-table .row-actions .button,.notice-client-table .row-actions .button,.notice-history-table .row-actions .button{width:100%;min-width:0;white-space:normal;line-height:1.15}
}

@media (max-width:430px){
  .notice-mode>.row-actions,.notice-package-table .row-actions,.notice-client-table .row-actions,.notice-history-table .row-actions{grid-template-columns:1fr}
}

@supports (-webkit-touch-callout:none){
  @media (max-width:760px){body::before{background:var(--paper)}}
}

.payment-method-detail{display:grid;justify-items:start;gap:5px;min-width:150px}
.transfer-bank-name{color:var(--teal);font-size:12px;font-weight:850;line-height:1.3}
.transfer-receipt-link{color:#1e6970;font-size:11px;font-weight:850;text-decoration:underline;text-underline-offset:2px}
.pdf-bank-table{min-width:1540px}
.pdf-transfer-fields{display:grid;gap:7px;min-width:235px}
.pdf-transfer-bank{width:100%;min-width:225px}
.pdf-transfer-file{display:grid;gap:4px;color:var(--muted);font-size:11px;font-weight:800}
.pdf-transfer-file input{width:100%;max-width:230px;font-size:11px}
.pdf-transfer-note{border-color:#b8d7e5;background:#f0f8fc}

@media (max-width:760px){
  .payment-method-detail{min-width:130px}
  .pdf-transfer-fields{min-width:200px}
  .pdf-transfer-bank{min-width:195px}
  .pdf-transfer-file input{max-width:200px}
}

.bank-balance-title{align-items:center;margin-top:26px}
.bank-balance-total{display:grid;justify-items:end;gap:2px;padding:11px 15px;border:1px solid #bad9d4;border-radius:14px;background:#eef8f6}
.bank-balance-total span,.bank-balance-card span{color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.bank-balance-total strong{color:var(--teal);font-size:20px}
.bank-balance-total small{color:var(--muted);font-size:11px}
.bank-balance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-bottom:24px}
.bank-balance-card{position:relative;display:grid;gap:11px;min-width:0;padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(21,63,69,.07);overflow:hidden}
.bank-balance-card::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:#1e6970}
.bank-balance-card>div{display:grid;gap:4px}
.bank-balance-card>div strong{overflow-wrap:anywhere}
.bank-balance-card>b{color:var(--teal);font-size:25px;line-height:1}
.bank-balance-card>small{color:var(--muted)}
.bank-balance-card.unidentified{border-color:#efd29a;background:#fffaf0}
.bank-balance-card.unidentified::before{background:var(--amber)}
.bank-balance-card.unidentified>b{color:#8a5a0a}
.bank-balance-card.negative{border-color:#efb7b1;background:#fff6f5}
.bank-balance-card.negative::before{background:#b83b32}
.bank-balance-card.negative>b{color:#a72d26}
.bank-balance-empty{margin-bottom:24px}
.bank-report-breakdown{display:grid;gap:7px;min-width:210px}
.bank-report-breakdown>span{display:grid;grid-template-columns:minmax(110px,1fr) auto;gap:2px 10px;padding:7px 9px;border-radius:10px;background:#eef8f6}
.bank-report-breakdown>span.unidentified{background:#fff4dc}
.bank-report-breakdown b{grid-column:1;overflow-wrap:anywhere;font-size:11px}
.bank-report-breakdown strong{grid-column:2;grid-row:1/3;align-self:center;color:var(--teal);white-space:nowrap}
.bank-report-breakdown small{grid-column:1;color:var(--muted)}
.office-payment-sources{display:grid;gap:5px;min-width:230px}
.office-payment-sources>span{display:grid;grid-template-columns:minmax(130px,1fr) auto;gap:10px;padding:7px 9px;border-radius:10px;background:#eef8f6}
.office-payment-sources>span b{overflow-wrap:anywhere;font-size:11px}
.office-payment-sources>span strong{color:var(--teal);white-space:nowrap}
.office-payment-sources>small{font-weight:800}
.office-payment-sources>small.debited{color:#14715f}
.office-payment-sources>small.external{color:#8a5a0a}
.office-bank-distribution{padding:16px;border:1px solid #cfe0dd;border-radius:16px;background:#f7fbfa}
.office-bank-heading{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:12px}
.office-bank-heading>div{display:grid;gap:4px}
#office-bank-rows{display:grid;gap:10px}
.office-bank-row{display:grid;grid-template-columns:minmax(220px,1.45fr) minmax(150px,.65fr) auto;gap:10px;align-items:end;padding:12px;border:1px solid #dce7e5;border-radius:13px;background:#fff}
.office-bank-row .field{margin:0}
.office-bank-remove{margin-bottom:1px}
.office-debit-toggle{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:13px;border:1px solid #bad9d4;border-radius:13px;background:#eef8f6;cursor:pointer}
.office-debit-toggle input{width:18px;height:18px;margin-top:2px;accent-color:var(--teal)}
.office-debit-toggle span{display:grid;gap:4px}
.office-debit-toggle small{color:var(--muted);font-weight:500}
.office-allocation-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;padding:12px;border-radius:13px;background:#fff4dc;border:1px solid #efd29a}
.office-allocation-preview.balanced{background:#eef8f6;border-color:#bad9d4}
.office-allocation-preview span{display:grid;gap:2px;color:var(--muted);font-size:11px}
.office-allocation-preview b{color:var(--ink);font-size:15px}
.office-allocation-preview small{grid-column:1/-1;color:var(--muted)}
.office-existing-receipt{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:10px;padding:10px;border-radius:12px;background:#eef8f6}
.office-existing-receipt label{display:flex;align-items:center;gap:6px;margin-left:auto;color:#9b3029;font-size:12px;font-weight:800}
.office-existing-receipt input{width:auto}
.cash-report-table{min-width:1420px}

@media (max-width:760px){
  .branding-preview{align-items:flex-start;padding:14px}
  .branding-preview-logo{width:62px;height:62px;flex-basis:62px;border-radius:17px;font-size:22px}
  .branding-preview strong{font-size:18px}
  .branding-form .form-actions{display:grid;grid-template-columns:1fr}
  .branding-form .form-actions .button{width:100%}
  .bank-balance-title{align-items:stretch}
  .bank-balance-total{justify-items:start;width:100%}
  .bank-balance-grid{grid-template-columns:1fr}
  .bank-balance-card{padding:16px}
  .bank-balance-card>b{font-size:23px}
  .office-bank-heading{align-items:stretch;flex-direction:column}
  .office-bank-row{grid-template-columns:1fr}
  .office-bank-remove{width:100%;margin:0}
  .office-allocation-preview{grid-template-columns:1fr}
  .office-allocation-preview small{grid-column:1}
  .office-existing-receipt{align-items:stretch;display:grid}
  .office-existing-receipt label{margin-left:0}
}

.badge.red{background:#ffe8e5;color:#a83e35}
.courier-switcher select{min-width:200px}
.courier-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
.courier-architecture{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(440px,1.25fr);gap:28px;align-items:center;margin-bottom:20px;background:linear-gradient(135deg,#fff 0%,#f2f9f7 100%)}
.courier-architecture h2,.courier-next-step h2{margin:12px 0 7px;color:var(--teal)}
.courier-architecture p,.courier-next-step p{margin:0;color:var(--muted);line-height:1.55}
.courier-architecture-flow{display:flex;align-items:stretch;justify-content:center;gap:9px}
.courier-architecture-flow>span{flex:1;display:grid;place-items:center;align-content:center;min-height:94px;padding:13px;border:1px solid #bad9d4;border-radius:15px;background:#fff;text-align:center;color:var(--muted);font-size:12px;font-weight:750;line-height:1.45}
.courier-architecture-flow b{color:var(--teal)}
.courier-architecture-flow i{align-self:center;color:var(--orange);font-style:normal;font-size:22px;font-weight:900}
.courier-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:16px;margin-bottom:20px}
.courier-card{position:relative;display:grid;gap:16px;min-width:0;padding:20px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 12px 34px rgba(21,63,69,.08);overflow:hidden}
.courier-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--courier-color)}
.courier-card.current{border-color:#9fcfc4;box-shadow:0 16px 38px rgba(21,99,86,.13)}
.courier-card-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;align-items:start}
.courier-card-logo,.courier-form-logo{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:var(--courier-color,#153f45);color:#fff;font-size:18px;font-weight:950;overflow:hidden}
.courier-card-logo.has-logo,.courier-form-logo.has-logo{background:#fff;border:1px solid var(--line)}
.courier-card-logo img,.courier-form-logo img{width:100%;height:100%;object-fit:contain}
.courier-card-title{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.courier-card-title h2{margin:0;color:var(--ink);font-size:20px}
.courier-card-head p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.45}
.courier-card-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.courier-card-facts>div{display:grid;gap:3px;min-width:0;padding:11px;border-radius:12px;background:#f5f8f7}
.courier-card-facts span{color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.courier-card-facts strong{overflow-wrap:anywhere;color:var(--ink);font-size:12px}
.courier-profile{display:grid;gap:7px;padding:12px;border:1px solid #d5e5e2;border-radius:13px;background:#f8fbfa}
.courier-profile>div{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--teal);font-size:12px;font-weight:850}
.courier-profile small{color:var(--muted);line-height:1.45}
.courier-card>.row-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px}
.courier-next-step{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(320px,1fr);gap:28px;align-items:center}
.courier-next-step ol{margin:0;padding-left:22px;color:var(--ink);line-height:1.85;font-weight:700}
.courier-form-logo{--courier-color:#153f45;width:86px;height:86px}

@media (max-width:900px){
  .courier-architecture,.courier-next-step{grid-template-columns:1fr}
  .courier-architecture-flow{flex-wrap:wrap}
  .courier-architecture-flow>span{min-width:150px}
  .courier-architecture-flow i{transform:rotate(90deg)}
}

@media (max-width:760px){
  .courier-metrics{grid-template-columns:1fr}
  .courier-grid{grid-template-columns:1fr}
  .courier-card{padding:17px}
  .courier-card-head{grid-template-columns:auto minmax(0,1fr)}
  .courier-card-head>.badge{grid-column:2;justify-self:start}
  .courier-card-facts{grid-template-columns:1fr}
  .courier-profile>div{align-items:flex-start;flex-direction:column}
  .courier-card>.row-actions{display:grid;grid-template-columns:1fr}
  .courier-card>.row-actions .button{width:100%}
  .courier-architecture-flow{display:grid;grid-template-columns:1fr}
  .courier-architecture-flow i{transform:rotate(90deg);justify-self:center}
}