/* ERP 视觉精修：沿用蓝色品牌与业务组件，集中维护阅读层级和操作密度。 */
:root {
  --bg: #f3f5f8;
  --panel: #fff;
  --line: #dce3ec;
  --txt: #243247;
  --muted: #5c6c80;
  --brand: #185fa5;
  --brand-soft: #eaf2fb;
  --brand-hover: #124e89;
  --surface-subtle: #f7f9fc;
  --line-soft: #e9edf3;
  --control-line: #bbc6d4;
  --danger: #a32d2d;
  --ok: #0f6e56;
  --warn: #854f0b;
  --warn-bg: #fff3df;
  --page-space: 28px;
  --control-height: 38px;
  --radius: 10px;
}

body { line-height: 1.6; }
button, input, select, textarea { font-family: inherit; }
input, textarea { caret-color: var(--brand); }
::selection { color: #133e69; background: #dceafb; }
::placeholder { color: var(--muted); opacity: 1; }
:where(button, a, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 3px;
}
a { text-underline-offset: 3px; }

/* 导航有独立滚动区，品牌和账号入口始终可见。 */
.sidebar {
  width: 228px;
  height: 100dvh;
  background: var(--surface-subtle);
  overflow: hidden;
}
.side-brand { flex: 0 0 auto; padding: 22px 22px 20px; }
.side-logo { max-width: 176px; }
#nav { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0 16px; }
.nav-group { padding: 14px 12px 0; }
.nav-group-title { color: var(--muted); padding: 0 10px 6px; font-size: 12px; font-weight: 600; }
.nav-item { min-height: 38px; padding: 8px 10px; margin: 2px 0; border-radius: 6px; font-size: 13px; line-height: 1.65; }
.nav-item:hover { background: #eaf0f7; }
.nav-item.active { color: var(--brand-hover); background: #e0ebf8; font-weight: 600; }
.side-foot { flex: 0 0 auto; padding: 14px 22px; background: var(--surface-subtle); }
.side-foot #whoami { color: var(--txt); font-weight: 500; }
.side-foot .linklike { padding-top: 5px; padding-bottom: 5px; }
.nav-backdrop { display: none; }

/* 固定字号层级，内容按任务组织，表格保持足够密度。 */
.main { padding: 0 var(--page-space) 48px; }
.topbar { min-height: 68px; margin: 0 calc(-1 * var(--page-space)) 28px; padding: 14px var(--page-space); gap: 16px; }
.topbar-title { color: var(--muted); font-size: 13px; line-height: 1.5; }
.topbar-logo { width: 22px; height: 22px; }
.topbar-right { gap: 12px; }
.global-search { width: 248px; background: var(--surface-subtle); }
.page-head { align-items: flex-start; margin-bottom: 22px; gap: 16px; }
.page-title { color: var(--txt); font-size: 22px; font-weight: 600; line-height: 1.4; }
.page-sub { font-size: 13px; line-height: 1.65; margin-top: 7px; max-width: 75ch; }
.page-head > .toolbar { padding-top: 2px; }
.toolbar { gap: 10px; }
.toolbar > label { display: inline-flex; align-items: center; gap: 7px; }
.pfilter { flex-wrap: wrap; gap: 8px; }
.search-input, .btn { height: var(--control-height); border-radius: 7px; font-size: 13px; }
.search-input { border-color: var(--control-line); color: var(--txt); max-width: 100%; }
.btn { padding: 0 14px; color: var(--txt); border-color: var(--control-line); white-space: nowrap; }
.btn:not(:disabled):hover { border-color: #8fa5be; background: var(--surface-subtle); }
.btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 500; }
.btn.primary:not(:disabled):hover { background: var(--brand-hover); border-color: var(--brand-hover); filter: none; }
.btn.danger { color: var(--danger); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn.mini { height: 30px; border-radius: 6px; }
.icon-btn { min-width: 34px; min-height: 34px; border-radius: 6px; color: var(--muted); }
.icon-btn:hover { color: var(--brand); background: var(--brand-soft); }
.chips { margin-bottom: 16px; }
.chip { height: 34px; padding: 0 13px; border-radius: 6px; border-color: var(--control-line); font-size: 13px; }
.chip.active { background: var(--brand-soft); border-color: #87abd0; color: var(--brand-hover); }

/* 金额用等宽数字，日常指标保持中性色，异常沿用红/黄/绿语义。 */
.cards { gap: 12px; margin-bottom: 24px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.card { min-width: 0; padding: 18px; border-radius: var(--radius); }
.card .v { color: var(--txt); font-size: 25px; font-weight: 600; line-height: 1.35; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.card .l { color: var(--muted); font-size: 12px; line-height: 1.6; margin-top: 7px; }
.card.danger .v { color: var(--danger); }
.section { padding: 20px; margin-bottom: 20px; border-radius: var(--radius); min-width: 0; }
.section h3 { font-size: 15px; font-weight: 600; line-height: 1.6; margin-bottom: 14px; }
.section > .section { border: 0; padding-left: 0; padding-right: 0; }
.cols2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.production-overview-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 18px; margin-top: 16px; }
.production-overview-card { border: 0; border-radius: 0; background: transparent; padding: 0 0 4px; min-width: 0; }
.production-overview-card h3 { margin-bottom: 8px; overflow-wrap: anywhere; }
.production-meter { grid-template-columns: 64px minmax(30px, 1fr) 82px; gap: 10px; margin: 13px 0; }
.production-meter b { font-variant-numeric: tabular-nums; }
.production-track { height: 8px; }
.production-overview-card > .muted { font-size: 12px; }
.pgrid, .formcards { gap: 16px; }
.pcard, .scard, .formcard { padding: 18px; border-radius: var(--radius); }
.pcard:hover, .scard.clickable:hover, .formcard:hover { box-shadow: none; transform: none; background: #fcfdff; }
.pc-name, .sc-name { font-size: 15px; line-height: 1.65; margin-bottom: 8px; }
.pc-id { opacity: 1; font-size: 12px; }
.pc-meta, .pc-dates { line-height: 1.65; }
.pc-money, .pc-foot { border-top-style: solid; border-top-color: var(--line-soft); padding-top: 10px; margin-top: 10px; }
.badge { font-size: 12px; line-height: 1.6; padding: 2px 8px; border-radius: 5px; }
.tabs { gap: 8px; margin-bottom: 20px; }
.tab { min-height: 42px; padding: 9px 12px; font-size: 13px; }

/* 宽表只在容器内横向滚动。保留日历单元格原有的固定列和密度。 */
.table-wrap { border-radius: 8px; max-width: 100%; overscroll-behavior-x: contain; }
table.grid { font-size: 13px; font-variant-numeric: tabular-nums; line-height: 1.6; }
table.grid:not(.ts-table) th { background: #f2f5f9; color: #45576d; font-weight: 600; padding: 12px 14px; text-align: center; vertical-align: middle; }
table.grid:not(.ts-table) td { padding: 11px 14px; border-bottom-color: var(--line-soft); text-align: center; vertical-align: middle; }
table.grid:not(.ts-table) tbody tr:last-child td { border-bottom: 0; }
table.grid tr:hover td { background: #f0f5fc; }
table.grid:not(.ts-table) :is(th, td).num { text-align: center; }
table.grid:not(.ts-table) :is(th, td).ckcol { text-align: center; padding: 4px 8px; }
table.grid:not(.ts-table) td.row-actions { text-align: center; }
table.grid small { font-size: 12px; color: var(--muted); }
.table-desc { line-height: 1.75; }
.table-desc, .quickbar { border-left-width: 1px; border-radius: 8px; }
.edit-hint, .empty-sub { line-height: 1.7; }
.empty { padding: 40px 24px; }
.empty-title { font-size: 15px; font-weight: 500; }
.tipbar { line-height: 1.75; }

/* 财务页面复用同一组布局和字号，避免内嵌待办再套卡片。 */
#page .finance-list { gap: 0; }
#page .finance-todo { padding: 13px 0; border: 0; border-radius: 0; border-bottom: 1px solid var(--line-soft); }
#page .finance-todo:last-child { border-bottom: 0; padding-bottom: 0; }
#page .finance-todo:first-child { padding-top: 0; }
#page .finance-todo b { font-variant-numeric: tabular-nums; margin-left: 6px; }
#page .finance-note { color: var(--muted); font-size: 13px; margin: 8px 0 12px; }
#page .finance-subnav { gap: 8px; margin-bottom: 18px; }
#page .finance-subnav + .toolbar { margin-bottom: 16px; }
#page .finance-actions { gap: 10px; }
.finance-more summary { color: var(--muted); }
#finance-month { width: 168px; }

/* 弹窗保留业务流程；标题、表单、按钮遵循同一节奏。 */
.modal-mask { background: rgba(25, 40, 61, .38); padding: 48px 20px; }
.modal { border-radius: 12px; max-height: calc(100dvh - 96px); }
.modal-head { padding: 16px 22px; font-size: 16px; font-weight: 600; gap: 12px; }
.modal-body { padding: 22px; line-height: 1.65; }
.modal-foot { padding: 14px 22px; background: var(--surface-subtle); border-radius: 0 0 12px 12px; flex-wrap: wrap; }
.form-grid { gap: 16px 20px; }
.form-item label { font-size: 13px; color: #45576d; margin-bottom: 7px; }
.form-item input, .form-item select { height: var(--control-height); border-color: var(--control-line); }
.form-item input:focus-visible, .form-item select:focus-visible,
.login-card input:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.qitem { padding: 14px; gap: 14px; border-radius: 8px; }
.qitem b { line-height: 1.6; }
.qitem small { display: block; margin-top: 3px; }
.login-wrap { padding: 24px; }
.login-card { width: 400px; max-width: 100%; padding: 38px 32px; }
.login-card h1 { font-size: 20px; font-weight: 600; }
.login-sub { font-size: 13px; line-height: 1.7; }
.login-card input { height: 44px; border-color: var(--control-line); }
.login-card button { height: 44px; }

@media (max-width: 1100px) {
  :root { --page-space: 20px; }
  .sidebar { width: 212px; }
  .side-brand { padding: 20px; }
  .topbar-title { max-width: 220px; }
  .global-search { width: 200px; }
  .cols2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  :root { --page-space: 16px; }
  .main { width: 100%; }
  .sidebar { width: 260px; max-width: calc(100vw - 60px); height: 100dvh; visibility: hidden; transition: transform 180ms ease-out, visibility 180ms; }
  body.nav-open .sidebar { visibility: visible; box-shadow: 8px 0 24px rgba(25, 40, 61, .16); }
  body.nav-open .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 35; border: 0; background: rgba(25, 40, 61, .34); }
  body.nav-open { overflow: hidden; }
  .topbar { min-height: 64px; padding: 12px 16px; margin-bottom: 22px; gap: 10px; }
  .topbar-title { min-width: 0; flex: 1; font-size: 12px; max-width: none; }
  .topbar-logo { display: none; }
  .topbar-right { flex-shrink: 0; gap: 8px; }
  .menu-btn { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 38px; min-height: 40px; }
  .page-title { font-size: 20px; }
  .page-head { margin-bottom: 18px; gap: 14px; }
  .page-head > .toolbar { width: 100%; }
  .page-sub { font-size: 12px; }
  .section { padding: 16px; margin-bottom: 16px; }
  .production-overview-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .production-overview-card { padding: 16px 0; border-bottom: 1px solid var(--line-soft); }
  .production-overview-card:first-child { padding-top: 0; }
  .production-overview-card:last-child { border-bottom: 0; padding-bottom: 0; }
  #page .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; }
  .card { padding: 14px 12px; }
  .card .v { font-size: 21px; }
  .card .l { font-size: 12px; margin-top: 6px; }
  .formcards, .pgrid, .form-grid { grid-template-columns: minmax(0, 1fr); }
  .toolbar .search-input, .pfilter .search-input { width: auto; min-width: 0; flex: 1 1 150px; }
  .btn, .chip { min-height: 40px; }
  .btn.mini { min-height: 34px; }
  .formcard { flex-wrap: wrap; }
  .fc-acts { flex-direction: row; flex-wrap: wrap; }
  .modal-mask { padding: 16px 12px; }
  .modal { max-height: calc(100dvh - 32px); }
  .modal-head, .modal-body { padding: 16px; }
  .modal-foot { padding: 12px 16px; }
  .modal-foot .btn { flex: 1; }
  .mrow { flex-wrap: wrap; }
  .mrow .mv { width: auto; min-width: 0; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .sidebar, .pcard, .scard { transition: none; }
}