/* Dashboard & settlement list page-level polish */
.dashboard-period-form .period-trigger,
.settlement-filter-card .period-trigger {
  min-height: 46px !important;
  border-color: rgba(7, 91, 136, 0.16) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%) !important;
  color: #153f58 !important;
  box-shadow: 0 10px 22px rgba(8, 71, 104, 0.06) !important;
}

.dashboard-period-form .period-trigger:hover,
.settlement-filter-card .period-trigger:hover {
  border-color: rgba(7, 91, 136, 0.34) !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(8, 71, 104, 0.1) !important;
}

.dashboard-period-form .settlement-period-picker,
.settlement-filter-card .settlement-period-picker {
  border: 1px solid rgba(7, 91, 136, 0.13) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 54px rgba(18, 62, 88, 0.16) !important;
}

.dashboard-period-form .period-shortcuts,
.settlement-filter-card .period-shortcuts {
  background: linear-gradient(180deg, #f7fbfe 0%, #eef7fc 100%) !important;
  border-color: rgba(7, 91, 136, 0.1) !important;
}

.dashboard-period-form .period-shortcut-btn,
.settlement-filter-card .period-shortcut-btn {
  border-radius: 11px !important;
  color: #496879 !important;
}

.dashboard-period-form .period-shortcut-btn:hover,
.dashboard-period-form .period-shortcut-btn.active,
.settlement-filter-card .period-shortcut-btn:hover,
.settlement-filter-card .period-shortcut-btn.active {
  background: #e5f4fb !important;
  color: var(--hz-primary) !important;
}

.dashboard-period-form .period-cell-btn,
.settlement-filter-card .period-cell-btn {
  border-radius: 14px !important;
  background: #f2f8fb !important;
  color: #284e63 !important;
}

.dashboard-period-form .period-cell-btn.active,
.settlement-filter-card .period-cell-btn.active {
  background: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-accent) 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(7, 91, 136, 0.2) !important;
}

.dashboard-period-form .period-cell-btn.active:hover,
.dashboard-period-form .period-cell-btn.active:focus,
.dashboard-period-form .period-cell-btn.active.in-range,
.settlement-filter-card .period-cell-btn.active:hover,
.settlement-filter-card .period-cell-btn.active:focus,
.settlement-filter-card .period-cell-btn.active.in-range {
  background: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-accent) 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.dashboard-period-form .period-cell-btn.in-range,
.settlement-filter-card .period-cell-btn.in-range {
  background: #dff3fb !important;
  color: var(--hz-deep) !important;
}

.dashboard-period-form .period-cell-btn.in-range:hover,
.settlement-filter-card .period-cell-btn.in-range:hover {
  background: #cdebf7 !important;
  color: var(--hz-deep) !important;
}

.dashboard-period-form .period-range-summary,
.settlement-filter-card .period-range-summary {
  border-color: rgba(7, 91, 136, 0.12) !important;
  background: #f8fcfe !important;
  border-radius: 15px !important;
}

.settlement-filter-card {
  border: 1px solid rgba(7, 91, 136, 0.09) !important;
  border-radius: 24px !important;
  box-shadow: 0 16px 38px rgba(18, 62, 88, 0.08) !important;
}

.settlement-filter-head h2,
.card.panel h5 {
  color: var(--hz-ink) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.settlement-actionbar {
  gap: 0.55rem !important;
}

.settlement-actionbar .action-btn {
  min-height: 42px !important;
  min-width: auto !important;
  padding: 0.68rem 1.05rem !important;
  border-radius: 999px !important;
  font-size: 0.9rem !important;
  box-shadow: 0 10px 22px rgba(8, 71, 104, 0.08) !important;
}

.settlement-actionbar .action-btn-secondary,
.settlement-actionbar .action-btn-import {
  background: #ffffff !important;
  color: var(--hz-deep) !important;
  border-color: rgba(7, 91, 136, 0.14) !important;
}

.settlement-actionbar .action-btn-secondary:hover,
.settlement-actionbar .action-btn-import:hover {
  background: #eef8fd !important;
  border-color: rgba(7, 91, 136, 0.24) !important;
}

.settlement-actionbar .action-btn-create {
  background: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-accent) 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

.settlement-filter-card #settlement-filter-form {
  align-items: center;
  padding-top: 0.1rem;
}

.settlement-filter-card .form-control,
.settlement-filter-card .form-select {
  min-height: 46px !important;
  border-radius: 16px !important;
  background-color: #fbfdfe !important;
}

.settlement-row-no {
  color: var(--hz-primary) !important;
  font-weight: 800 !important;
}

.settlement-amount-main {
  color: var(--hz-ink) !important;
  font-weight: 800 !important;
}

.settlement-amount-breakdown {
  display: inline-flex !important;
  flex-direction: column;
  gap: 0.2rem !important;
  margin-top: 0.35rem !important;
  color: var(--hz-muted) !important;
  font-size: 0.76rem !important;
}

.settlement-amount-breakdown .item {
  display: inline-flex !important;
  justify-content: flex-end;
  gap: 0.38rem;
  white-space: nowrap;
}

.settlement-amount-breakdown strong {
  color: #35586b !important;
}

.settlement-amount-tip {
  margin-top: 0.35rem;
  color: #8aa0ad !important;
  font-size: 0.72rem !important;
}

.status-align-end .badge,
.settlement-table-wrap .badge {
  border-radius: 999px !important;
  padding: 0.42rem 0.7rem !important;
  font-weight: 800 !important;
}

.card.panel .row .small.text-muted + .fw-bold {
  color: var(--hz-ink);
}

/* Final contrast guard: selected/date cells and primary action buttons must never become white-on-white. */
.settlement-period-picker .period-grid .period-cell-btn.active,
.settlement-period-picker .period-grid .period-cell-btn.active:hover,
.settlement-period-picker .period-grid .period-cell-btn.active:focus,
.dashboard-period-form .settlement-period-picker .period-grid .period-cell-btn.active,
.settlement-filter-card .settlement-period-picker .period-grid .period-cell-btn.active {
  background-color: var(--hz-primary) !important;
  background-image: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-accent) 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}

.settlement-period-picker .period-grid .period-cell-btn.active *,
.dashboard-period-form .settlement-period-picker .period-grid .period-cell-btn.active *,
.settlement-filter-card .settlement-period-picker .period-grid .period-cell-btn.active * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.settlement-period-picker .period-grid .period-cell-btn.in-range:not(.active),
.dashboard-period-form .settlement-period-picker .period-grid .period-cell-btn.in-range:not(.active),
.settlement-filter-card .settlement-period-picker .period-grid .period-cell-btn.in-range:not(.active) {
  background: #dff3fb !important;
  color: var(--hz-deep) !important;
  -webkit-text-fill-color: var(--hz-deep) !important;
}

.settlement-actionbar a.action-btn-create,
.settlement-actionbar .btn.action-btn-create,
a.btn.action-btn-create {
  background-color: var(--hz-primary) !important;
  background-image: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-accent) 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: transparent !important;
}

.settlement-actionbar a.action-btn-create:hover,
.settlement-actionbar .btn.action-btn-create:hover,
a.btn.action-btn-create:hover {
  background-color: var(--hz-deep) !important;
  background-image: linear-gradient(135deg, var(--hz-deep) 0%, #0f84ae 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Align top spacing for main archive/management list pages. */
.app-shell:has(.receipt-page),
.app-shell:has(.sys-page) {
  padding-top: 1.35rem !important;
}

/* Page detail polish: unify cards, detail grids, tables and small actions across modules. */
.page-hero,
.station-hero,
.station-list-hero,
.receipt-hero,
.account-hero,
.account-detail-hero,
.profile-hero,
.sys-hero,
.entry-hero,
.import-hero {
  overflow: hidden;
  position: relative;
}

.page-hero::after,
.station-hero::after,
.station-list-hero::after,
.receipt-hero::after,
.account-hero::after,
.account-detail-hero::after,
.profile-hero::after,
.sys-hero::after,
.entry-hero::after,
.import-hero::after {
  content: "";
  position: absolute;
  right: -84px;
  top: -112px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.11);
  pointer-events: none;
}

.page-hero > *,
.station-hero > *,
.station-list-hero > *,
.receipt-hero > *,
.account-hero > *,
.account-detail-hero > *,
.profile-hero > *,
.sys-hero > *,
.entry-hero > *,
.import-hero > * {
  position: relative;
  z-index: 1;
}

.detail-panel,
.detail-card,
.entry-form-card,
.entry-tip-card,
.baseline-context-card,
.profile-card,
.sys-panel,
.sys-form-card,
.import-template-card,
.import-upload-panel,
.allocation-side-card,
.allocation-recommend-card,
.receipt-table-panel,
.station-list-filter-card,
.station-list-table-card,
.account-filter-panel,
.account-table-panel {
  border: 1px solid rgba(7, 91, 136, 0.09) !important;
  border-radius: 24px !important;
  box-shadow: 0 14px 34px rgba(18, 62, 88, 0.07) !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

.detail-panel .card-body,
.detail-card .card-body,
.entry-form-card .card-body,
.entry-tip-card .card-body,
.baseline-context-card .card-body,
.profile-card .card-body,
.sys-panel .card-body,
.sys-form-card .card-body {
  padding: 1.45rem 1.55rem !important;
}

.panel-header,
.detail-section-title,
.entry-section-head,
.sys-filter,
.station-list-filter-head,
.receipt-list-head,
.account-list-head {
  border-bottom-color: rgba(7, 91, 136, 0.09) !important;
}

.panel-title,
.detail-section-title h5,
.entry-section-title,
.sys-panel h5,
.sys-form-card h5,
.profile-card h5 {
  color: var(--hz-ink) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.panel-note,
.detail-summary-note,
.form-text,
.entry-section-subtitle {
  color: var(--hz-muted) !important;
  line-height: 1.65;
}

.detail-grid-clean,
.detail-grid,
.profile-account-card,
.sys-summary-grid,
.detail-summary-grid,
.allocation-summary-grid {
  gap: 1rem !important;
}

.detail-item,
.detail-summary-card,
.sys-summary-card,
.profile-account-card > div,
.allocation-summary-card {
  border: 1px solid rgba(7, 91, 136, 0.08) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%) !important;
  box-shadow: 0 10px 24px rgba(18, 62, 88, 0.045) !important;
}

.detail-item label,
.detail-summary-card .label,
.sys-summary-card small,
.profile-account-card .text-muted,
.allocation-summary-card .label {
  color: #6f8798 !important;
  font-weight: 700 !important;
}

.detail-item strong,
.detail-summary-card strong,
.sys-summary-card strong,
.profile-account-card strong,
.allocation-summary-card strong {
  color: var(--hz-ink) !important;
}

.table:not(.calendar-table) {
  --bs-table-hover-bg: #f6fbfd;
}

.table:not(.calendar-table) thead th {
  background: #f4f9fc !important;
  color: #496879 !important;
  border-bottom-color: rgba(7, 91, 136, 0.11) !important;
  font-weight: 800 !important;
}

.table:not(.calendar-table) tbody td {
  border-color: rgba(7, 91, 136, 0.075) !important;
}

.table a.fw-semibold,
.table .fw-semibold[href],
.account-table-panel a,
.station-list-table-card a,
.receipt-table-panel a {
  color: var(--hz-deep) !important;
  text-decoration: none !important;
}

.table a.fw-semibold:hover,
.table .fw-semibold[href]:hover,
.account-table-panel a:hover,
.station-list-table-card a:hover,
.receipt-table-panel a:hover {
  color: var(--hz-bright) !important;
  text-decoration: underline !important;
  text-underline-offset: 0.22rem;
}

.hero-back,
.page-hero-actions a,
.account-detail-actions a,
.sys-hero-actions a,
.receipt-detail-page .page-hero-actions a,
.station-hero a.btn,
.receipt-hero a.btn,
.account-hero a.btn,
.import-hero a.btn {
  border-radius: 999px !important;
  font-weight: 800 !important;
}

.hero-back,
.page-hero-actions a:not(.btn-primary),
.account-detail-actions a:not(.btn-primary),
.sys-hero-actions a:not(.btn-primary) {
  background: rgba(255, 255, 255, 0.14) !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

.hero-back:hover,
.page-hero-actions a:not(.btn-primary):hover,
.account-detail-actions a:not(.btn-primary):hover,
.sys-hero-actions a:not(.btn-primary):hover {
  background: rgba(255, 255, 255, 0.22) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}


.empty-state,
.table .text-center.text-muted.py-5 {
  color: var(--hz-muted) !important;
  background: #f8fbfd;
  border-radius: 18px;
}

@media (max-width: 768px) {
  .shell-flush-top .app-shell {
    padding-top: 1rem !important;
  }

  .detail-panel .card-body,
  .detail-card .card-body,
  .entry-form-card .card-body,
  .entry-tip-card .card-body,
  .baseline-context-card .card-body,
  .profile-card .card-body,
  .sys-panel .card-body,
  .sys-form-card .card-body {
    padding: 1.1rem !important;
  }

  .page-hero,
  .station-hero,
  .station-list-hero,
  .receipt-hero,
  .account-hero,
  .account-detail-hero,
  .profile-hero,
  .sys-hero,
  .entry-hero,
  .import-hero {
    border-radius: 20px !important;
  }
}


.table .btn-sm,
.sys-actions .btn-sm,
.receipt-table-panel .btn-sm,
.station-list-table-card .btn-sm,
.account-table-panel .btn-sm {
  min-height: 32px;
  padding: 0.36rem 0.72rem !important;
  font-size: 0.78rem !important;
  box-shadow: none !important;
}


.btn *,
.action-btn *,
.hero-back *,
.bank-info-entry-btn *,
.allocation-mini-btn *,
.station-edit-link *,
.table-inline-link * {
  -webkit-text-fill-color: currentColor !important;
}

/* Final Hengzhen brand color pass: calmer deep blue, cleaner cyan, less visual noise. */
body {
  background:
    radial-gradient(circle at 8% -8%, rgba(15, 143, 190, 0.075), transparent 28rem),
    radial-gradient(circle at 92% 2%, rgba(78, 180, 216, 0.08), transparent 24rem),
    linear-gradient(180deg, #fbfdfe 0%, var(--hz-bg) 100%) !important;
}

.brand-nav {
  background: linear-gradient(112deg, #044564 0%, #08658f 52%, #087eaa 100%) !important;
  box-shadow: 0 12px 28px rgba(4, 69, 100, 0.2) !important;
}

.brand-logo-image {
  background: rgba(255, 255, 255, 0.16) !important;
}

.brand-nav-links {
  background: rgba(255, 255, 255, 0.105) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.brand-nav .nav-link.active {
  color: var(--hz-deep) !important;
  background: rgba(255, 255, 255, 0.98) !important;
}

.page-hero,
.station-hero,
.station-list-hero,
.receipt-hero,
.account-hero,
.account-detail-hero,
.profile-hero,
.sys-hero,
.entry-hero,
.import-hero {
  background: var(--hz-hero-gradient) !important;
  box-shadow: 0 18px 42px rgba(8, 101, 143, 0.15) !important;
}

.metric-card.blue,
.metric-card.cyan {
  background: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-bright) 100%) !important;
}

.metric-card.green {
  background: linear-gradient(135deg, #17764b 0%, #31a96e 100%) !important;
}

.metric-card.red {
  background: linear-gradient(135deg, #b84d4d 0%, #dc6868 100%) !important;
}

.metric-card.yellow {
  background: linear-gradient(135deg, #b47a18 0%, #dda83a 100%) !important;
}


.panel,
.card.panel,
.detail-panel,
.detail-card,
.entry-form-card,
.entry-tip-card,
.baseline-context-card,
.profile-card,
.sys-panel,
.sys-form-card,
.import-template-card,
.import-upload-panel,
.allocation-side-card,
.allocation-recommend-card,
.receipt-table-panel,
.station-list-filter-card,
.station-list-table-card,
.account-filter-panel,
.account-table-panel,
.settlement-filter-card {
  border-color: rgba(8, 101, 143, 0.085) !important;
  box-shadow: 0 14px 34px rgba(13, 63, 91, 0.065) !important;
}

.form-control,
.form-select,
input,
select,
textarea {
  border-color: #d7e6ee !important;
}

.form-control:focus,
.form-select:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: rgba(8, 101, 143, 0.46) !important;
  box-shadow: 0 0 0 0.16rem rgba(8, 101, 143, 0.105) !important;
}

a {
  color: #08769f;
}

a:hover {
  color: var(--hz-deep);
}



.settlement-period-picker .period-grid .period-cell-btn.active,
.settlement-period-picker .period-grid .period-cell-btn.active:hover,
.settlement-period-picker .period-grid .period-cell-btn.active:focus {
  background-image: linear-gradient(135deg, var(--hz-primary) 0%, var(--hz-bright) 100%) !important;
}

/* Shared workspace card: monthly settlement and receipt management use the same rhythm. */
.hz-workspace-card {
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 96% 0%, rgba(17, 148, 195, 0.075), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fafdff 100%) !important;
  border: 1px solid rgba(17, 148, 195, 0.12) !important;
  box-shadow: 0 18px 42px rgba(7, 91, 136, 0.075) !important;
  color: #14384d !important;
  overflow: visible !important;
}

.hz-workspace-card::after {
  display: none !important;
}

.hz-workspace-card > .card-body {
  padding: 1.35rem 1.45rem 1.45rem !important;
}

.hz-workspace-card h2,
.hz-workspace-card .settlement-section-title,
.hz-workspace-card .receipt-section-title {
  color: #0f344d !important;
  -webkit-text-fill-color: #0f344d !important;
  font-size: 1.24rem !important;
  font-weight: 850 !important;
  letter-spacing: -0.01em !important;
}

.hz-workspace-card p,
.hz-workspace-card .text-muted {
  color: #6b8292 !important;
  -webkit-text-fill-color: #6b8292 !important;
  font-size: .9rem !important;
  line-height: 1.62 !important;
}

.hz-workspace-card .hz-filter-section {
  margin-top: 1.12rem !important;
}

.hz-workspace-card .hz-filter-section:first-of-type {
  margin-top: 0 !important;
}

/* Unified list-page workspace style: keep archive/account/system pages aligned with the monthly settlement rhythm. */
.hz-page-hero,
.station-list-page > .station-list-hero,
.account-page > .account-hero {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1.1rem !important;
  padding: 1.35rem 1.55rem !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 94% 10%, rgba(17, 148, 195, 0.1), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fafdff 100%) !important;
  border: 1px solid rgba(17, 148, 195, 0.12) !important;
  box-shadow: 0 18px 42px rgba(7, 91, 136, 0.08) !important;
  color: #14384d !important;
  overflow: visible !important;
}

.hz-page-hero::after,
.station-list-page > .station-list-hero::after,
.account-page > .account-hero::after {
  display: none !important;
}

.hz-page-hero h2,
.station-list-page > .station-list-hero h2,
.account-page > .account-hero h2 {
  margin: 0 0 .35rem !important;
  color: #0f344d !important;
  -webkit-text-fill-color: #0f344d !important;
  font-size: 1.55rem !important;
  font-weight: 900 !important;
  letter-spacing: .01em !important;
}

.hz-page-hero p,
.station-list-page > .station-list-hero p,
.account-page > .account-hero p {
  max-width: 56rem !important;
  margin: 0 !important;
  color: #6b8292 !important;
  -webkit-text-fill-color: #6b8292 !important;
  line-height: 1.65 !important;
  font-size: .92rem !important;
}

.hz-page-actions,
.station-list-hero-actions,
.account-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: .65rem !important;
}

.hz-main-card,
.station-list-filter-card,
.account-filter-panel,
.sys-panel.hz-filter-card {
  border: 1px solid rgba(17, 148, 195, 0.12) !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fafdff 100%) !important;
  box-shadow: 0 18px 42px rgba(7, 91, 136, 0.075) !important;
  overflow: visible !important;
}

.hz-filter-card,
.station-list-filter-card,
.account-filter-panel {
  padding: 1.25rem !important;
}

.station-list-filter-card.hz-filter-card {
  padding: 0 !important;
}

.station-list-filter-card .card-body {
  padding: 1.35rem 1.45rem 1.45rem !important;
  background: transparent !important;
}

.station-list-filter-card .card-body::before {
  display: none !important;
}

.station-list-filter-title,
.account-panel-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding-bottom: .95rem !important;
  margin-bottom: .95rem !important;
  border-bottom: 1px solid rgba(7, 91, 136, 0.10) !important;
}

.hz-panel-title {
  color: #12364b !important;
  font-size: 1.05rem !important;
  font-weight: 900 !important;
  letter-spacing: .01em !important;
}

.hz-panel-note {
  margin-top: .28rem !important;
  color: #6f8798 !important;
  font-size: .86rem !important;
  line-height: 1.55 !important;
}

.hz-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .8rem !important;
  margin-bottom: .55rem !important;
}

.hz-section-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: .42rem !important;
}

.hz-section-title::before {
  content: "" !important;
  width: .48rem !important;
  height: .48rem !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #075b88 0%, #20a9d6 100%) !important;
  box-shadow: 0 0 0 .24rem rgba(17, 148, 195, .1) !important;
}

.hz-section-badge,
.station-list-filter-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: .35rem .78rem !important;
  border-radius: 999px !important;
  background: #edf7fc !important;
  border: 1px solid rgba(7, 91, 136, 0.1) !important;
  color: #075b88 !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

.account-filter-grid:not(.receiving),
.sys-panel .hz-filter-grid {
  grid-template-columns: minmax(240px, 1.45fr) repeat(2, minmax(160px, .9fr)) auto !important;
}

.station-list-workspace-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 1.1rem !important;
  padding-bottom: 1rem !important;
  margin-bottom: 1rem !important;
  border-bottom: 1px solid rgba(7, 91, 136, 0.08) !important;
}

.station-list-workspace-title h2 {
  margin: 0 0 .32rem !important;
  color: #0f344d !important;
  font-size: 1.22rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}

.station-list-workspace-title p {
  margin: 0 !important;
  max-width: 58rem !important;
  color: #6b8292 !important;
  font-size: .9rem !important;
  line-height: 1.62 !important;
}

.station-list-workspace-head .action-btn-export {
  background: #f5fbfe !important;
  border: 1px solid rgba(7, 91, 136, 0.16) !important;
  color: #075b88 !important;
  -webkit-text-fill-color: #075b88 !important;
  box-shadow: 0 10px 22px rgba(7, 91, 136, 0.07) !important;
}

.station-list-workspace-head .action-btn-export:hover,
.station-list-workspace-head .action-btn-export:focus {
  background: #eaf7fd !important;
  border-color: rgba(7, 91, 136, 0.28) !important;
  color: #064b70 !important;
  -webkit-text-fill-color: #064b70 !important;
  box-shadow: 0 12px 26px rgba(7, 91, 136, 0.11) !important;
}

.station-filter-section {
  margin-top: 1.12rem !important;
}

.station-filter-section:first-of-type {
  margin-top: 0 !important;
}

.station-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .8rem !important;
  margin-bottom: .55rem !important;
}

.station-section-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: .42rem !important;
  color: #14384d !important;
  font-size: .86rem !important;
  font-weight: 900 !important;
}

.station-section-title::before {
  content: "" !important;
  width: .48rem !important;
  height: .48rem !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #075b88 0%, #20a9d6 100%) !important;
  box-shadow: 0 0 0 .24rem rgba(17, 148, 195, .1) !important;
}

.station-section-note {
  color: #93a6b3 !important;
  font-size: .74rem !important;
  font-weight: 600 !important;
}

.station-filter-panel {
  padding: .78rem .86rem !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(248, 252, 254, .82) 100%) !important;
  border: 1px solid rgba(7, 91, 136, 0.06) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .94), 0 10px 24px rgba(7, 91, 136, .035) !important;
}

.station-filter-panel .station-advanced-filter {
  margin-top: .72rem !important;
}

.station-filter-panel .station-advanced-filter[open] {
  display: flex !important;
  flex-direction: column-reverse !important;
  align-items: flex-start !important;
  gap: .64rem !important;
}

.station-filter-panel .station-advanced-filter[open] .station-advanced-grid {
  margin-top: 0 !important;
}

.station-filter-panel .station-advanced-filter[open] summary {
  margin-top: .06rem !important;
}

/* Account archive: align with the refined station archive page rhythm. */

.account-filter-panel.hz-filter-card {
  padding: 1.35rem 1.45rem 1.45rem !important;
}

.account-filter-panel::before {
  display: none !important;
}

.account-workspace-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 1.1rem !important;
  padding-bottom: 1rem !important;
  margin-bottom: 1rem !important;
  border-bottom: 1px solid rgba(7, 91, 136, 0.08) !important;
}

.account-workspace-title h2 {
  margin: 0 0 .32rem !important;
  color: #0f344d !important;
  font-size: 1.22rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}

.account-workspace-title p {
  margin: 0 !important;
  max-width: 58rem !important;
  color: #6b8292 !important;
  font-size: .9rem !important;
  line-height: 1.62 !important;
}

.account-workspace-head .action-btn-export {
  background: #f5fbfe !important;
  border: 1px solid rgba(7, 91, 136, 0.16) !important;
  color: #075b88 !important;
  -webkit-text-fill-color: #075b88 !important;
  box-shadow: 0 10px 22px rgba(7, 91, 136, 0.07) !important;
}

.account-workspace-head .action-btn-export:hover,
.account-workspace-head .action-btn-export:focus {
  background: #eaf7fd !important;
  border-color: rgba(7, 91, 136, 0.28) !important;
  color: #064b70 !important;
  -webkit-text-fill-color: #064b70 !important;
  box-shadow: 0 12px 26px rgba(7, 91, 136, 0.11) !important;
}

.account-workspace-head .action-btn-assist {
  background: #eefaf3 !important;
  border: 1px solid rgba(22, 114, 71, 0.16) !important;
  color: #167247 !important;
  -webkit-text-fill-color: #167247 !important;
  box-shadow: 0 10px 22px rgba(22, 114, 71, 0.07) !important;
}

.account-workspace-head .action-btn-assist::before {
  content: "¥" !important;
  font-size: .86rem !important;
}

.account-workspace-head .action-btn-assist:hover,
.account-workspace-head .action-btn-assist:focus {
  background: #e3f6eb !important;
  border-color: rgba(22, 114, 71, 0.28) !important;
  color: #0f623a !important;
  -webkit-text-fill-color: #0f623a !important;
  box-shadow: 0 12px 26px rgba(22, 114, 71, 0.11) !important;
}

.account-tabs {
  margin-bottom: 1.05rem !important;
}

.account-filter-section {
  margin-top: 1.12rem !important;
}

.account-filter-section:first-of-type {
  margin-top: 0 !important;
}

.account-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .8rem !important;
  margin-bottom: .55rem !important;
}

.account-section-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: .42rem !important;
  color: #14384d !important;
  font-size: .86rem !important;
  font-weight: 900 !important;
}

.account-section-title::before {
  content: "" !important;
  width: .48rem !important;
  height: .48rem !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #075b88 0%, #20a9d6 100%) !important;
  box-shadow: 0 0 0 .24rem rgba(17, 148, 195, .1) !important;
}

.account-section-note {
  color: #93a6b3 !important;
  font-size: .74rem !important;
  font-weight: 600 !important;
}

.account-filter-cardlet {
  padding: .78rem .86rem !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(248, 252, 254, .82) 100%) !important;
  border: 1px solid rgba(7, 91, 136, 0.06) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .94), 0 10px 24px rgba(7, 91, 136, .035) !important;
}

/* Main business pages final pass: monthly settlement / receipts / station archive / account archive. */
.receipt-page,
.station-list-page,
.account-page {
  gap: 1rem !important;
}

.metric-card {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 22px !important;
  box-shadow: 0 16px 34px rgba(7, 91, 136, 0.13) !important;
}

.metric-card small {
  color: rgba(255, 255, 255, 0.86) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.86) !important;
  font-size: .88rem !important;
  font-weight: 750 !important;
}

.metric-card strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(1.42rem, 1.7vw, 1.82rem) !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
}

.metric-card .summary-time,
.station-summary-note,
.account-summary-note {
  color: rgba(255, 255, 255, 0.78) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.78) !important;
  font-size: .76rem !important;
  font-weight: 650 !important;
}

.station-list-filter-card.hz-filter-card,
.account-filter-panel.hz-filter-card {
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 96% 0%, rgba(17, 148, 195, 0.075), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fafdff 100%) !important;
  border: 1px solid rgba(17, 148, 195, 0.12) !important;
  box-shadow: 0 18px 42px rgba(7, 91, 136, 0.075) !important;
}

.settlement-filter-head,
.receipt-hero-head,
.station-list-workspace-head,
.account-workspace-head {
  border-bottom-color: rgba(7, 91, 136, 0.08) !important;
}

.station-list-workspace-title h2,
.account-workspace-title h2 {
  color: #0f344d !important;
  -webkit-text-fill-color: #0f344d !important;
  font-size: 1.24rem !important;
  font-weight: 850 !important;
  letter-spacing: -0.01em !important;
}

.station-list-workspace-title p,
.account-workspace-title p {
  color: #6b8292 !important;
  -webkit-text-fill-color: #6b8292 !important;
  font-size: .9rem !important;
  line-height: 1.62 !important;
}

.hz-section-title {
  color: #14384d !important;
  -webkit-text-fill-color: #14384d !important;
  font-size: .86rem !important;
  font-weight: 900 !important;
}

.hz-index-badge {
  width: 2rem !important;
  height: 2rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: #eaf5fb !important;
  color: #075b88 !important;
  -webkit-text-fill-color: #075b88 !important;
  font-weight: 800 !important;
  font-size: .88rem !important;
}

.hz-section-note {
  color: #93a6b3 !important;
  -webkit-text-fill-color: #93a6b3 !important;
}

.hz-metric-grid {
  align-items: stretch !important;
}

.hz-metric-grid .metric-card {
  width: 100% !important;
  min-height: 128px !important;
}

.hz-filter-panel {
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .94) 0%, rgba(248, 252, 254, .84) 100%) !important;
  border: 1px solid rgba(7, 91, 136, 0.06) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .94), 0 10px 24px rgba(7, 91, 136, .035) !important;
}

/* --------------------------------------------------------------------------
   Hengzhen Product UI System 2026
   Brand source: Hengzhen standard deck (#045C9C primary, #C00000 risk,
   #F6BD3E warning, #80BF63 success, neutral gray scale).
   This final layer intentionally normalizes the product surface without
   changing business structure.
-------------------------------------------------------------------------- */
:root {
  --hz-brand: #045C9C;
  --hz-brand-deep: #033F72;
  --hz-brand-dark: #022E52;
  --hz-brand-mid: #0878B7;
  --hz-brand-bright: #2EA7D4;
  --hz-brand-pale: #EAF6FC;
  --hz-brand-faint: #F5FAFD;
  --hz-danger: #C00000;
  --hz-danger-soft: #FDECEC;
  --hz-warning: #F6BD3E;
  --hz-warning-soft: #FFF7E3;
  --hz-success: #5FAE48;
  --hz-success-soft: #EEF8EA;
  --hz-gray-900: #111827;
  --hz-gray-800: #263746;
  --hz-gray-700: #404040;
  --hz-gray-600: #647484;
  --hz-gray-500: #7F7F7F;
  --hz-gray-300: #BFBFBF;
  --hz-gray-200: #D9D9D9;
  --hz-gray-100: #F4F7FA;
  --hz-surface: #FFFFFF;
  --hz-surface-soft: #FAFCFE;
  --hz-line: #DDEAF2;
  --hz-line-strong: #C8DDE9;
  --hz-radius-sm: 10px;
  --hz-radius-md: 16px;
  --hz-radius-lg: 22px;
  --hz-radius-xl: 28px;
  --hz-shadow-xs: 0 1px 2px rgba(2, 46, 82, .04);
  --hz-shadow-sm: 0 8px 22px rgba(2, 46, 82, .06);
  --hz-shadow-md: 0 16px 38px rgba(2, 46, 82, .08);
  --hz-shadow-lg: 0 24px 58px rgba(2, 46, 82, .11);
  --hz-focus-ring: 0 0 0 .18rem rgba(4, 92, 156, .16);
  --hz-ease: cubic-bezier(.2, .8, .2, 1);
}

html {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  background:
    radial-gradient(circle at 8% -10%, rgba(4, 92, 156, .08), transparent 28rem),
    radial-gradient(circle at 88% 4%, rgba(46, 167, 212, .08), transparent 26rem),
    linear-gradient(180deg, #F8FBFD 0%, #F3F7FA 52%, #F6F9FB 100%) !important;
  color: var(--hz-gray-800) !important;
  font-family: "Microsoft YaHei", "PingFang SC", "Segoe UI", Arial, sans-serif !important;
  font-size: 15px;
  line-height: 1.62;
}

::selection {
  color: #fff;
  background: rgba(4, 92, 156, .82);
}

.app-shell {
  padding: 1.45rem 1.2rem 1.8rem !important;
}

.app-shell-inner {
  max-width: 1480px !important;
}

.brand-nav {
  background:
    linear-gradient(115deg, rgba(2, 46, 82, .98) 0%, rgba(4, 92, 156, .98) 54%, rgba(8, 120, 183, .96) 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .13) !important;
  box-shadow: 0 12px 30px rgba(2, 46, 82, .22) !important;
}

.brand-nav .container-fluid {
  min-height: 76px !important;
}

.brand-logo-image {
  width: 42px !important;
  height: 42px !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 10px 22px rgba(2, 46, 82, .16) !important;
}

.brand-system-name {
  font-size: 1.24rem !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
}

.brand-nav-links {
  padding: .32rem !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .095) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
}

.brand-nav .nav-link {
  min-height: 44px;
  padding: .62rem 1rem !important;
  border-radius: 15px !important;
  color: rgba(242, 249, 253, .88) !important;
  font-size: .95rem !important;
  font-weight: 800 !important;
  transition: background .18s var(--hz-ease), color .18s var(--hz-ease), transform .18s var(--hz-ease), box-shadow .18s var(--hz-ease) !important;
}

.brand-nav .nav-link:hover {
  background: rgba(255, 255, 255, .13) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

.brand-nav .nav-link.active {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  background: #fff !important;
  box-shadow: 0 10px 22px rgba(2, 46, 82, .16) !important;
}

.brand-user-menu {
  min-height: 46px !important;
  background: rgba(255, 255, 255, .13) !important;
  border-color: rgba(255, 255, 255, .23) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 9px 20px rgba(2, 46, 82, .12) !important;
}

.brand-user-menu:hover,
.brand-user-menu:focus,
.brand-user-menu.show {
  background: rgba(255, 255, 255, .19) !important;
  border-color: rgba(255, 255, 255, .38) !important;
}

.page-hero,
.station-hero,
.station-list-hero,
.receipt-hero,
.account-hero,
.account-detail-hero,
.profile-hero,
.sys-hero,
.entry-hero,
.import-hero,
.hz-page-hero {
  border-radius: var(--hz-radius-xl) !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(255, 255, 255, .16), transparent 18rem),
    linear-gradient(135deg, var(--hz-brand-deep) 0%, var(--hz-brand) 54%, var(--hz-brand-bright) 100%) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  box-shadow: var(--hz-shadow-lg) !important;
}

.page-hero h1,
.page-hero h2,
.station-hero h1,
.station-hero h2,
.station-list-hero h1,
.station-list-hero h2,
.receipt-hero h1,
.receipt-hero h2,
.account-hero h1,
.account-hero h2,
.account-detail-hero h1,
.account-detail-hero h2,
.profile-hero h1,
.profile-hero h2,
.sys-hero h1,
.sys-hero h2,
.entry-hero h1,
.entry-hero h2,
.import-hero h1,
.import-hero h2,
.hz-page-hero h1,
.hz-page-hero h2 {
  font-weight: 900 !important;
  letter-spacing: -.025em !important;
}

.page-hero p,
.station-hero p,
.station-list-hero p,
.receipt-hero p,
.account-hero p,
.account-detail-hero p,
.profile-hero p,
.sys-hero p,
.entry-hero p,
.import-hero p,
.hz-page-hero p {
  max-width: 64rem;
  color: rgba(255, 255, 255, .84) !important;
}

.panel,
.card,
.card.panel,
.hz-workspace-card,
.hz-table-panel,
.station-list-filter-card,
.station-list-table-card,
.account-filter-panel,
.account-table-panel,
.receipt-table-panel,
.sys-panel,
.profile-card,
.detail-card,
.entry-form-card,
.entry-section-card,
.import-section,
.allocation-side-card,
.allocation-recommend-card {
  border: 1px solid rgba(4, 92, 156, .09) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(252, 254, 255, .96) 100%) !important;
  border-radius: var(--hz-radius-lg) !important;
  box-shadow: var(--hz-shadow-sm) !important;
}

.hz-workspace-card > .card-body,
.card.panel > .card-body,
.panel > .card-body {
  padding: 1.45rem 1.5rem !important;
}

/* Unified form pages: station archive form, receipt entry, account entry,
   settlement entry and allocation entry should feel like one product family. */
.station-page,
.entry-page,
.form-page,
.import-page {
  width: 100% !important;
  max-width: none !important;
}

.station-main-card,
.entry-form-card {
  border: 1px solid rgba(4, 92, 156, .09) !important;
  border-radius: var(--hz-radius-xl) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .99) 0%, rgba(250, 253, 255, .97) 100%) !important;
  box-shadow: var(--hz-shadow-md) !important;
  overflow: hidden !important;
}

.station-main-card .card-body,
.entry-form-card .card-body {
  padding: 1.55rem !important;
}

.station-section-card,
.entry-section {
  border: 1px solid rgba(4, 92, 156, .085) !important;
  border-radius: 22px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(248, 252, 254, .94) 100%) !important;
  box-shadow: 0 12px 28px rgba(2, 46, 82, .045) !important;
}

.station-section-card.p-4,
.entry-section.p-4 {
  padding: 1.3rem !important;
}

.station-section-header,
.entry-section-header {
  align-items: flex-start !important;
  border-bottom: 1px solid rgba(4, 92, 156, .09) !important;
  padding-bottom: .92rem !important;
  margin-bottom: 1.1rem !important;
}

.station-section-header h5,
.entry-section-header h5,
.entry-section-title h5 {
  margin-bottom: .2rem !important;
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  font-size: 1.03rem !important;
  font-weight: 900 !important;
  letter-spacing: -.015em !important;
}

.station-section-header .text-muted,
.entry-section-header .text-muted,
.entry-section-title .text-muted {
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
  font-size: .86rem !important;
  line-height: 1.58 !important;
}

.station-section-badge,
.entry-section-badge {
  min-height: 28px !important;
  padding: .32rem .72rem !important;
  border-radius: 999px !important;
  background: var(--hz-brand-pale) !important;
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  font-size: .76rem !important;
  font-weight: 850 !important;
  border: 1px solid rgba(4, 92, 156, .08) !important;
}

.station-guide-strip,
.entry-guide-strip {
  gap: .46rem !important;
  margin-bottom: 1rem !important;
}

.station-guide-pill,
.entry-guide-pill {
  min-height: 32px !important;
  padding: .4rem .78rem !important;
  border-radius: 999px !important;
  background: rgba(234, 246, 252, .82) !important;
  color: #365A70 !important;
  -webkit-text-fill-color: #365A70 !important;
  border: 1px solid rgba(4, 92, 156, .08) !important;
  font-size: .78rem !important;
  font-weight: 720 !important;
}

.station-guide-pill strong,
.entry-guide-pill strong {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  font-weight: 900 !important;
}

.station-required,
.entry-required,
.sys-required,
.profile-required,
.required-star,
.asteriskField {
  color: var(--hz-danger) !important;
  -webkit-text-fill-color: var(--hz-danger) !important;
  background: transparent !important;
  border-radius: 0 !important;
  min-width: auto !important;
  width: auto !important;
  height: auto !important;
  display: inline !important;
  margin-left: .25rem !important;
  font-size: .95em !important;
  font-weight: 800 !important;
}

.station-link-hint,
.form-text,
.helptext {
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
  font-size: .8rem !important;
  line-height: 1.5 !important;
}

.station-link-hint {
  margin-top: .42rem !important;
  padding: .5rem .68rem !important;
  border-radius: 13px !important;
  border: 1px solid rgba(4, 92, 156, .075) !important;
  background: rgba(245, 250, 253, .9) !important;
}

.station-link-hint strong {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
}

.entry-field-col,
.station-section-card .col-12,
.station-section-card [class*="col-md-"] {
  min-width: 0 !important;
}

.entry-field-col .form-control,
.entry-field-col .form-select,
.entry-field-col textarea,
.station-section-card .form-control,
.station-section-card .form-select,
.station-section-card textarea {
  border-color: var(--hz-line) !important;
}

.entry-field-col .form-control:focus,
.entry-field-col .form-select:focus,
.entry-field-col textarea:focus,
.station-section-card .form-control:focus,
.station-section-card .form-select:focus,
.station-section-card textarea:focus {
  border-color: var(--hz-brand) !important;
  box-shadow: var(--hz-focus-ring) !important;
}

.date-enhanced-wrap,
.entry-field-col .date-enhanced-wrap {
  gap: .52rem !important;
}

.date-picker-open-btn {
  width: 44px !important;
  height: 44px !important;
  border-radius: 14px !important;
  border: 1px solid var(--hz-line) !important;
  background: #fff !important;
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  box-shadow: var(--hz-shadow-xs) !important;
}

.date-picker-open-btn:hover,
.date-picker-open-btn:focus {
  background: var(--hz-brand-pale) !important;
  border-color: rgba(4, 92, 156, .24) !important;
}

.station-action-bar,
.entry-action-bar,
.form-action-bar,
.form-actions {
  border-top: 1px solid rgba(4, 92, 156, .09) !important;
  padding-top: 1rem !important;
  margin-top: 1.25rem !important;
}

.allocation-alert,
.allocation-continue-banner {
  border-radius: 18px !important;
  border: 1px solid rgba(4, 92, 156, .10) !important;
  background: linear-gradient(180deg, #F9FCFE 0%, #F2F8FC 100%) !important;
  color: var(--hz-gray-800) !important;
}

.metric-card {
  min-height: 128px !important;
  border-radius: 22px !important;
  padding: 1.22rem 1.34rem !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  box-shadow: 0 15px 34px rgba(2, 46, 82, .12) !important;
  overflow: hidden;
  position: relative;
}

.metric-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, .12), transparent 52%);
  pointer-events: none;
}

.metric-card small,
.metric-card strong,
.metric-card .summary-time {
  position: relative;
  z-index: 1;
}

.metric-card small {
  color: rgba(255, 255, 255, .82) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, .82) !important;
  font-size: .88rem !important;
  font-weight: 750 !important;
}

.metric-card strong {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: clamp(1.65rem, 2.1vw, 2.16rem) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
}

.metric-card.blue,
.metric-card.cyan {
  background: linear-gradient(135deg, var(--hz-brand-deep) 0%, var(--hz-brand) 58%, var(--hz-brand-bright) 100%) !important;
}

.metric-card.green {
  background: linear-gradient(135deg, #3F8E30 0%, var(--hz-success) 100%) !important;
}

.metric-card.red {
  background: linear-gradient(135deg, #9F0000 0%, var(--hz-danger) 100%) !important;
}

.metric-card.yellow {
  background: linear-gradient(135deg, #C78918 0%, var(--hz-warning) 100%) !important;
}

.summary-time,
.metric-card .summary-time {
  background: rgba(255, 255, 255, .16) !important;
  color: rgba(255, 255, 255, .84) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, .84) !important;
  border: 1px solid rgba(255, 255, 255, .12);
}

.hz-filter-panel,
.settlement-filter-panel,
.station-filter-panel,
.account-filter-cardlet {
  padding: .9rem .96rem !important;
  border-radius: 20px !important;
  border: 1px solid rgba(4, 92, 156, .075) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .96) 0%, rgba(248, 252, 254, .9) 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 10px 24px rgba(2, 46, 82, .035) !important;
}

.form-label,
.settlement-filter-label,
.hz-filter-grid .form-label {
  color: #2D4658 !important;
  -webkit-text-fill-color: #2D4658 !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  letter-spacing: .005em !important;
}

.form-control,
.form-select,
.period-trigger,
textarea,
input[type="file"] {
  min-height: 44px !important;
  border-radius: 14px !important;
  border: 1px solid var(--hz-line) !important;
  background-color: #fff !important;
  color: var(--hz-gray-800) !important;
  font-size: .92rem !important;
  font-weight: 500 !important;
  box-shadow: var(--hz-shadow-xs) !important;
  transition: border-color .18s var(--hz-ease), box-shadow .18s var(--hz-ease), background .18s var(--hz-ease) !important;
}

.form-control::placeholder,
textarea::placeholder {
  color: #A1B2BE !important;
  -webkit-text-fill-color: #A1B2BE !important;
}

.form-control:hover,
.form-select:hover,
.period-trigger:hover {
  border-color: var(--hz-line-strong) !important;
  background-color: #FBFDFE !important;
}

.form-control:focus,
.form-select:focus,
.period-trigger:focus,
textarea:focus {
  border-color: var(--hz-brand) !important;
  box-shadow: var(--hz-focus-ring) !important;
}


.table {
  color: var(--hz-gray-800) !important;
}

.table thead th,
.settlement-table-wrap thead th,
.receipt-table-panel thead th,
.station-list-table-card thead th,
.account-table-panel thead th {
  background: #F2F7FA !important;
  color: #4F6676 !important;
  -webkit-text-fill-color: #4F6676 !important;
  border-bottom: 1px solid var(--hz-line) !important;
  font-size: .8rem !important;
  font-weight: 850 !important;
  letter-spacing: .015em !important;
}

.table tbody td,
.settlement-table-wrap tbody td,
.receipt-table-panel tbody td,
.station-list-table-card tbody td,
.account-table-panel tbody td {
  border-color: rgba(4, 92, 156, .075) !important;
}

.table tbody tr,
.settlement-table-wrap tbody tr,
.receipt-table-panel tbody tr,
.station-list-table-card tbody tr,
.account-table-panel tbody tr {
  transition: background .16s var(--hz-ease), box-shadow .16s var(--hz-ease) !important;
}

.table tbody tr:hover,
.settlement-table-wrap tbody tr:hover,
.receipt-table-panel tbody tr:hover,
.station-list-table-card tbody tr:hover,
.account-table-panel tbody tr:hover {
  background: #F7FBFE !important;
}

.hz-index-badge,
.receipt-index,
.station-index,
.account-index,
.settlement-row-no {
  background: var(--hz-brand-pale) !important;
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  box-shadow: inset 0 0 0 1px rgba(4, 92, 156, .04) !important;
}

.workflow-pill-group {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
  padding-top: .25rem;
}


.alert {
  border-radius: 18px !important;
  border-width: 1px !important;
  box-shadow: var(--hz-shadow-xs) !important;
}

.dropdown-menu {
  border: 1px solid rgba(4, 92, 156, .10) !important;
  border-radius: 18px !important;
  box-shadow: var(--hz-shadow-md) !important;
}

.dropdown-item {
  border-radius: 12px !important;
  font-weight: 720 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--hz-brand-pale) !important;
  color: var(--hz-brand) !important;
}

.empty-state,
.table-empty,
.no-data,
.empty-row td {
  color: var(--hz-gray-600) !important;
  background: linear-gradient(180deg, #fff 0%, var(--hz-brand-faint) 100%) !important;
}

.settlement-period-picker,
.hz-date-picker,
.dropdown-menu {
  border-color: rgba(4, 92, 156, .12) !important;
}

@media (max-width: 991.98px) {
  .brand-nav .container-fluid {
    min-height: 68px !important;
  }

  .brand-nav-links {
    margin-top: .8rem !important;
    margin-left: 0 !important;
    width: 100%;
  }

  .brand-nav .nav-link {
    justify-content: flex-start !important;
  }

  .hz-workspace-card > .card-body,
  .card.panel > .card-body,
  .panel > .card-body {
    padding: 1.15rem !important;
  }
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px;
  }

  .app-shell {
    padding: 1rem .8rem 1.4rem !important;
  }

  .page-hero,
  .station-hero,
  .station-list-hero,
  .receipt-hero,
  .account-hero,
  .account-detail-hero,
  .profile-hero,
  .sys-hero,
  .entry-hero,
  .import-hero,
  .hz-page-hero,
  .hz-workspace-card,
  .hz-table-panel,
  .station-list-table-card,
  .account-table-panel,
  .receipt-table-panel,
  .station-main-card,
  .entry-form-card,
  .station-section-card,
  .entry-section {
    border-radius: 20px !important;
  }

  .metric-card {
    min-height: 112px !important;
  }

  .hz-filter-actions,
  .settlement-filter-actions,

  .settlement-filter-actions .btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
  }

  .table-responsive {
    border-radius: 16px !important;
  }
}

/* List table refinement: one mature rhythm for settlement, receipt,
   station archive and account archive tables. */

.settlement-amount-breakdown,
.settlement-amount-tip,
.station-subtext,
.table-subtext,
.bank-meta,
.invoice-meta,
.biz-metric-line {
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
}

.settlement-amount-breakdown {
  gap: .34rem !important;
}

.settlement-amount-breakdown .item,
.biz-metric-line {
  background: rgba(245, 250, 253, .76) !important;
  border: 1px solid rgba(4, 92, 156, .065) !important;
  border-radius: 10px !important;
}

.receipt-amount-alert {
  justify-content: flex-end !important;
  border-radius: 999px !important;
  border: 1px solid rgba(192, 0, 0, .10) !important;
  background: var(--hz-danger-soft) !important;
  color: var(--hz-danger) !important;
  -webkit-text-fill-color: var(--hz-danger) !important;
  font-weight: 900 !important;
}


@media (max-width: 767.98px) {
  .hz-table-panel thead th,
  .settlement-table-wrap thead th,
  .receipt-table-panel thead th,
  .station-list-table-card thead th,
  .account-table-panel thead th {
    height: 42px !important;
    padding: .68rem .78rem !important;
    font-size: .75rem !important;
  }

  .hz-table-panel tbody td,
  .settlement-table-wrap tbody td,
  .receipt-table-panel tbody td,
  .station-list-table-card tbody td,
  .account-table-panel tbody td {
    padding: .82rem .78rem !important;
    font-size: .84rem !important;
  }
}

/* Detail page refinement: shared visual language for station, settlement,
   receipt and account detail pages. */
.receipt-detail-page,
.account-detail-page {
  gap: 1.1rem !important;
}

.account-detail-hero,
.receipt-detail-page .page-hero,
.station-profile .page-hero,
.station-detail-page .page-hero {
  padding: 1.55rem 1.75rem !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 92% 16%, rgba(255, 255, 255, .18), transparent 14rem),
    linear-gradient(135deg, #045C9C 0%, #087FAE 58%, #51B9DA 100%) !important;
  box-shadow: 0 20px 46px rgba(4, 92, 156, .16) !important;
}

.account-detail-hero h2,
.receipt-detail-page .page-hero h2,
.station-profile .page-hero h2,
.station-detail-page .page-hero h2 {
  margin-bottom: .42rem !important;
  font-size: clamp(1.55rem, 2.2vw, 2.05rem) !important;
  font-weight: 920 !important;
  letter-spacing: -.025em !important;
}

.account-detail-hero p,
.receipt-detail-page .hero-subtext,
.receipt-detail-page .page-hero p,
.station-profile .page-hero .muted,
.station-detail-page .page-hero .muted {
  color: rgba(245, 251, 255, .88) !important;
  -webkit-text-fill-color: rgba(245, 251, 255, .88) !important;
  font-size: .94rem !important;
  line-height: 1.72 !important;
}

.hero-back {
  display: inline-flex !important;
  align-items: center !important;
  gap: .35rem !important;
  margin-bottom: .55rem !important;
  color: rgba(255, 255, 255, .9) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, .9) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}

.hero-back:hover,
.hero-back:focus {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  transform: translateX(-2px);
}

.hero-status-row {
  gap: .48rem !important;
  margin-top: .85rem !important;
}

.hero-mini-pill,
.soft-badge {
  border-radius: 999px !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
}

.hero-mini-pill {
  padding: .36rem .76rem !important;
  background: rgba(255, 255, 255, .16) !important;
  border: 1px solid rgba(255, 255, 255, .2) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.page-hero-actions,
.account-detail-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: .62rem !important;
}

.page-hero-actions .btn,
.account-detail-actions .btn,
.section-head .section-action-btn {
  min-height: 40px !important;
  padding: .56rem 1rem !important;
  border-radius: 999px !important;
  font-size: .86rem !important;
  font-weight: 900 !important;
}

.detail-summary-grid,
.profile-summary-grid {
  gap: .9rem !important;
}

.detail-summary-card,
.profile-summary-card,
.receipt-summary-card {
  min-height: 122px !important;
  border: 1px solid rgba(4, 92, 156, .10) !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FBFD 100%) !important;
  box-shadow: 0 14px 34px rgba(4, 92, 156, .075) !important;
  overflow: hidden !important;
}

.profile-summary-card .card-body {
  padding: 1.05rem 1.14rem !important;
}

.detail-summary-card small,
.profile-summary-label,
.detail-summary-note {
  color: #6F8798 !important;
  -webkit-text-fill-color: #6F8798 !important;
  font-size: .78rem !important;
  font-weight: 820 !important;
}

.detail-summary-card strong,
.profile-summary-value {
  color: #123D59 !important;
  -webkit-text-fill-color: #123D59 !important;
  font-size: clamp(1.28rem, 2vw, 1.72rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.03em !important;
}

.detail-summary-card.warning strong {
  color: var(--hz-danger) !important;
  -webkit-text-fill-color: var(--hz-danger) !important;
}

.detail-summary-card.success strong {
  color: #238A56 !important;
  -webkit-text-fill-color: #238A56 !important;
}

.detail-panel,
.detail-card,
.card.panel {
  border: 1px solid rgba(4, 92, 156, .10) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 16px 38px rgba(4, 92, 156, .075) !important;
  overflow: hidden !important;
}

.detail-panel .card-body,
.detail-card .card-body,
.card.panel > .card-body,
.panel > .card-body {
  padding: 1.3rem 1.38rem !important;
}

.panel-header,
.detail-section-title,
.section-head {
  padding-bottom: .86rem !important;
  margin-bottom: 1rem !important;
  border-bottom: 1px solid rgba(4, 92, 156, .10) !important;
}

.panel-title,
.detail-section-title h5,
.card.panel h5,
.section-head h5 {
  margin: 0 !important;
  color: #123D59 !important;
  -webkit-text-fill-color: #123D59 !important;
  font-size: 1.02rem !important;
  font-weight: 800 !important;
  letter-spacing: -.012em !important;
}

.panel-note,
.detail-section-title .text-muted,
.section-head .text-muted {
  color: #758C9D !important;
  -webkit-text-fill-color: #758C9D !important;
  font-size: .82rem !important;
  line-height: 1.62 !important;
}

.detail-grid,
.detail-grid-clean {
  gap: .82rem !important;
}

.detail-grid > div,
.detail-item,
.account-recommend-card,
.counterparty-summary-card,
.change-compare-card,
.mini-row {
  border: 1px solid rgba(4, 92, 156, .095) !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FBFD 100%) !important;
  box-shadow: 0 8px 20px rgba(4, 92, 156, .035) !important;
}

.detail-grid > div,
.detail-item {
  min-height: 82px !important;
  padding: .9rem .98rem !important;
  justify-content: center !important;
}

.detail-grid label,
.detail-item label,
.counterparty-summary-card .summary-label {
  margin-bottom: .28rem !important;
  color: #758C9D !important;
  -webkit-text-fill-color: #758C9D !important;
  font-size: .76rem !important;
  font-weight: 700 !important;
}

.detail-grid b,
.detail-item strong,
.counterparty-summary-card .summary-value,
.mini-row strong {
  color: #123D59 !important;
  -webkit-text-fill-color: #123D59 !important;
  font-size: .94rem !important;
  font-weight: 650 !important;
  word-break: break-word !important;
}

.station-guide-strip,
.entry-guide-strip {
  border: 1px solid rgba(4, 92, 156, .10) !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(232, 246, 251, .9) 0%, rgba(255, 255, 255, .94) 100%) !important;
  color: #294D62 !important;
  -webkit-text-fill-color: #294D62 !important;
  box-shadow: 0 10px 24px rgba(4, 92, 156, .05) !important;
}

.change-compare-card.before {
  background: linear-gradient(180deg, #FFF7F7 0%, #FFFFFF 100%) !important;
  border-color: rgba(192, 0, 0, .13) !important;
}

.change-compare-card.after {
  background: linear-gradient(180deg, #F2FBF5 0%, #FFFFFF 100%) !important;
  border-color: rgba(35, 138, 86, .16) !important;
}

.table-responsive .table a,
.mini-row a {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Workspace card unification: use monthly settlement as the baseline for
   settlement, receipt, station archive and account archive main filter cards. */
.hz-workspace-card,
.settlement-filter-card.hz-workspace-card,
.station-list-filter-card.hz-workspace-card,
.account-filter-panel.hz-workspace-card {
  border: 1px solid rgba(4, 92, 156, .09) !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(252, 254, 255, .96) 100%) !important;
  box-shadow: 0 16px 38px rgba(2, 46, 82, .08) !important;
  overflow: visible !important;
  padding: 0 !important;
}

.hz-workspace-card > .card-body {
  padding: 1.45rem 1.5rem !important;
}

.hz-workspace-card .settlement-filter-head,
.hz-workspace-card .receipt-hero-head,
.hz-workspace-card .station-list-workspace-head,
.hz-workspace-card .account-workspace-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 1.1rem !important;
  padding: 0 0 1rem !important;
  margin: 0 0 1rem !important;
  border-bottom: 1px solid rgba(7, 91, 136, .08) !important;
}

.hz-workspace-card .settlement-filter-title,
.hz-workspace-card .receipt-hero-head > div:first-child,
.hz-workspace-card .station-list-workspace-title,
.hz-workspace-card .account-workspace-title {
  flex: 1 1 26rem !important;
  min-width: 0 !important;
}

.hz-workspace-card .settlement-filter-title h2,
.hz-workspace-card .receipt-hero-head h2,
.hz-workspace-card .station-list-workspace-title h2,
.hz-workspace-card .account-workspace-title h2 {
  margin: 0 0 .25rem !important;
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  font-size: 1.24rem !important;
  font-weight: 800 !important;
  letter-spacing: -.014em !important;
  line-height: 1.28 !important;
}

.hz-workspace-card .settlement-filter-title .text-muted,
.hz-workspace-card .receipt-hero-head p,
.hz-workspace-card .station-list-workspace-title p,
.hz-workspace-card .account-workspace-title p {
  max-width: 58rem !important;
  margin: 0 !important;
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
  font-size: .9rem !important;
  font-weight: 400 !important;
  line-height: 1.62 !important;
}

.hz-workspace-card .hz-workspace-actions,
.hz-workspace-card .settlement-actionbar,
.hz-workspace-card .receipt-hero-actions,
.hz-workspace-card .station-list-hero-actions,
.hz-workspace-card .account-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: .55rem !important;
  width: auto !important;
  min-width: min(100%, 18rem) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.hz-workspace-card .hz-filter-section,
.hz-workspace-card .settlement-filter-section,
.hz-workspace-card .receipt-filter-section,
.hz-workspace-card .station-filter-section,
.hz-workspace-card .account-filter-section {
  margin-top: 0 !important;
  margin-bottom: 1rem !important;
}

.hz-workspace-card .hz-filter-section:last-child,
.hz-workspace-card .settlement-filter-section:last-child,
.hz-workspace-card .receipt-filter-section:last-child,
.hz-workspace-card .station-filter-section:last-child,
.hz-workspace-card .account-filter-section:last-child {
  margin-bottom: 0 !important;
}

.hz-workspace-card .hz-filter-panel {
  width: 100% !important;
}

@media (max-width: 991.98px) {
  .hz-workspace-card .settlement-filter-head,
  .hz-workspace-card .receipt-hero-head,
  .hz-workspace-card .station-list-workspace-head,
  .hz-workspace-card .account-workspace-head {
    flex-direction: column !important;
  }

  .hz-workspace-card .hz-workspace-actions,
  .hz-workspace-card .settlement-actionbar,
  .hz-workspace-card .receipt-hero-actions,
  .hz-workspace-card .station-list-hero-actions,
  .hz-workspace-card .account-hero-actions {
    justify-content: flex-start !important;
    width: 100% !important;
  }
}

.table-responsive .table a:hover,
.mini-row a:hover {
  color: var(--hz-brand-deep) !important;
  -webkit-text-fill-color: var(--hz-brand-deep) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* --------------------------------------------------------------------------
   Typography final pass
   全站文字层级收敛：以月度结算页面的克制感为基准，统一颜色、字号和字重。
   这一层只处理文字表现，不改变业务结构。
-------------------------------------------------------------------------- */
:root {
  --hz-type-body: .92rem;
  --hz-type-body-sm: .86rem;
  --hz-type-caption: .78rem;
  --hz-type-table: .88rem;
  --hz-type-control: .9rem;
  --hz-type-section: 1.04rem;
  --hz-type-workspace-title: 1.2rem;
  --hz-weight-body: 400;
  --hz-weight-control: 450;
  --hz-weight-label: 650;
  --hz-weight-title: 780;
  --hz-weight-strong: 680;
}

body {
  color: var(--hz-gray-800) !important;
  -webkit-text-fill-color: var(--hz-gray-800) !important;
  font-size: 15px !important;
  font-weight: var(--hz-weight-body) !important;
  line-height: 1.62 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  letter-spacing: -.018em !important;
}

.page-hero h1,
.page-hero h2,
.station-hero h1,
.station-hero h2,
.station-list-hero h1,
.station-list-hero h2,
.receipt-hero h1,
.receipt-hero h2,
.account-hero h1,
.account-hero h2,
.account-detail-hero h1,
.account-detail-hero h2,
.profile-hero h1,
.profile-hero h2,
.sys-hero h1,
.sys-hero h2,
.entry-hero h1,
.entry-hero h2,
.import-hero h1,
.import-hero h2,
.hz-page-hero h1,
.hz-page-hero h2 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: clamp(1.52rem, 2.1vw, 2.04rem) !important;
  font-weight: 850 !important;
  line-height: 1.18 !important;
}

.page-hero p,
.station-hero p,
.station-list-hero p,
.receipt-hero p,
.account-hero p,
.account-detail-hero p,
.profile-hero p,
.sys-hero p,
.entry-hero p,
.import-hero p,
.hz-page-hero p,
.page-hero .muted,
.station-hero .muted {
  color: rgba(245, 251, 255, .86) !important;
  -webkit-text-fill-color: rgba(245, 251, 255, .86) !important;
  font-size: var(--hz-type-body-sm) !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

.card-body,
.hz-workspace-card > .card-body,
.hz-table-panel > .card-body,
.receipt-table-panel > .card-body,
.station-list-table-card > .card-body,
.account-table-panel > .card-body,
.detail-panel .card-body,
.detail-card .card-body,
.entry-form-card .card-body,
.station-main-card .card-body,
.station-section-card .card-body {
  color: var(--hz-gray-800) !important;
  -webkit-text-fill-color: var(--hz-gray-800) !important;
  font-size: var(--hz-type-body) !important;
  font-weight: var(--hz-weight-body) !important;
  line-height: 1.62 !important;
}

.station-section-header h5,
.entry-section-header h5,
.entry-section-title h5,
.panel-title,
.detail-section-title h5,
.card.panel h5,
.section-head h5,
.profile-section-header h5 {
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  font-size: var(--hz-type-section) !important;
  font-weight: var(--hz-weight-title) !important;
  line-height: 1.38 !important;
}

p,
.text-muted,
.form-text,
.helptext,
.panel-note,
.hz-section-note,
.hz-table-note,
.settlement-filter-title .text-muted,
.station-list-workspace-title p,
.account-workspace-title p,
.table-subtext,
.station-subtext,
.bank-meta,
.invoice-meta,
.biz-metric-line {
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
  font-size: var(--hz-type-body-sm) !important;
  font-weight: 400 !important;
  line-height: 1.58 !important;
}

label,
.form-label,
.settlement-filter-label,
.filter-field-label,
.hz-filter-grid .form-label,
.detail-grid label,
.detail-item label,
.profile-info-item label,
.counterparty-summary-card .summary-label {
  color: var(--hz-gray-700) !important;
  -webkit-text-fill-color: var(--hz-gray-700) !important;
  font-size: .8rem !important;
  font-weight: var(--hz-weight-label) !important;
  line-height: 1.42 !important;
}

.form-control,
.form-select,
.period-trigger,
textarea,
input[type="file"],
.custom-date-select {
  color: var(--hz-gray-800) !important;
  -webkit-text-fill-color: var(--hz-gray-800) !important;
  font-size: var(--hz-type-control) !important;
  font-weight: var(--hz-weight-control) !important;
  line-height: 1.45 !important;
}

.hz-filter-grid .form-control,
.hz-filter-grid .form-select,
.station-filter-grid .form-control,
.station-filter-grid .form-select,
.account-filter-grid .form-control,
.account-filter-grid .form-select,
.receipt-filter-grid .form-control,
.receipt-filter-grid .form-select,
.settlement-filter-card .form-control,
.settlement-filter-card .form-select {
  font-size: var(--hz-type-control) !important;
  font-weight: var(--hz-weight-control) !important;
}

.form-control::placeholder,
textarea::placeholder {
  color: #9CAEBB !important;
  -webkit-text-fill-color: #9CAEBB !important;
  font-weight: 400 !important;
}

strong,
b,
.table-primary-text,
.station-primary-text,
.bank-main,
.detail-grid b,
.detail-item strong,
.counterparty-summary-card .summary-value,
.mini-row strong {
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  font-weight: var(--hz-weight-strong) !important;
}

.table thead th,
.hz-table-panel thead th,
.settlement-table-wrap thead th,
.receipt-table-panel thead th,
.station-list-table-card thead th,
.account-table-panel thead th,
.audit-table th,
.sys-table th {
  color: #526B7C !important;
  -webkit-text-fill-color: #526B7C !important;
  font-size: .78rem !important;
  font-weight: 720 !important;
  letter-spacing: .012em !important;
}

.table a,
.table-inline-link,
.station-inline-link,
.station-name-link,
.account-name-link,
.table-responsive .table a,
.mini-row a {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
  font-weight: 650 !important;
  text-decoration: none !important;
}

.settlement-amount-main,
.receipt-table-panel .text-end,
.station-list-table-card .text-end,
.account-table-panel .biz-metric-value,
.audit-user,
.audit-time {
  color: #163D56 !important;
  -webkit-text-fill-color: #163D56 !important;
  font-weight: 680 !important;
}


.metric-card small {
  color: rgba(255, 255, 255, .84) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, .84) !important;
  font-size: .86rem !important;
  font-weight: 650 !important;
}

.metric-card strong {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: clamp(1.58rem, 2vw, 2.02rem) !important;
  font-weight: 850 !important;
  letter-spacing: -.025em !important;
}

.brand-nav .nav-link {
  font-size: .94rem !important;
  font-weight: 720 !important;
}

.brand-system-name {
  font-size: 1.2rem !important;
  font-weight: 780 !important;
}

.brand-user-name {
  font-size: .88rem !important;
  font-weight: 720 !important;
}

.brand-user-role {
  font-size: .68rem !important;
  font-weight: 500 !important;
}

/* Main navigation color correction
   导航位于深蓝背景上，必须独立于正文色系，避免被全站标题/正文色覆盖。 */
.brand-nav,
.brand-nav * {
  -webkit-text-fill-color: inherit;
}

.brand-mark,
.brand-mark:hover,
.brand-system-name {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

.brand-system-name {
  text-shadow: 0 1px 2px rgba(2, 46, 82, .22) !important;
}

.brand-nav .nav-link {
  color: rgba(247, 252, 255, .9) !important;
  -webkit-text-fill-color: rgba(247, 252, 255, .9) !important;
}

.brand-nav .nav-link:hover,
.brand-nav .nav-link:focus {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

.brand-nav .nav-link.active {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
}

.brand-user-menu,
.brand-user-menu:hover,
.brand-user-menu:focus,
.brand-user-menu.show,
.brand-user-name {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

.brand-user-role {
  color: rgba(238, 248, 255, .78) !important;
  -webkit-text-fill-color: rgba(238, 248, 255, .78) !important;
}

.brand-user-avatar,
.brand-user-avatar-role {
  color: var(--hz-brand) !important;
  -webkit-text-fill-color: var(--hz-brand) !important;
}

.brand-user-menu::after {
  color: rgba(255, 255, 255, .78) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, .78) !important;
}

/* Dark surface text audit
   深色/渐变背景组件统一反白，防止被全站标题和正文颜色覆盖。 */
.page-hero,
.station-hero,
.station-list-hero,
.receipt-hero,
.account-hero,
.account-detail-hero,
.profile-hero,
.sys-hero,
.audit-hero,
.entry-hero,
.import-hero,
.hz-page-hero,
.metric-card,
.account-tabs .nav-link.active,
.page-hero *,
.station-hero *,
.station-list-hero *,
.receipt-hero *,
.account-hero *,
.account-detail-hero *,
.profile-hero *,
.sys-hero *,
.audit-hero *,
.entry-hero *,
.import-hero *,
.hz-page-hero *,
.metric-card * {
  -webkit-text-fill-color: inherit;
}

.account-tabs .nav-link.active,
.account-tabs .nav-link.active:hover,
.account-tabs .nav-link.active:focus,
.account-tabs .nav-link.active *,
.account-tabs .nav-link.active .badge {
  background: rgba(255, 255, 255, .18) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
}

.page-hero h1,
.page-hero h2,
.page-hero h3,
.station-hero h1,
.station-hero h2,
.station-list-hero h1,
.station-list-hero h2,
.receipt-hero h1,
.receipt-hero h2,
.account-hero h1,
.account-hero h2,
.account-detail-hero h1,
.account-detail-hero h2,
.profile-hero h1,
.profile-hero h2,
.sys-hero h1,
.sys-hero h2,
.audit-hero h1,
.audit-hero h2,
.entry-hero h1,
.entry-hero h2,
.import-hero h1,
.import-hero h2,
.hz-page-hero h1,
.hz-page-hero h2,
.metric-card strong {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

.page-hero p,
.station-hero p,
.station-list-hero p,
.receipt-hero p,
.account-hero p,
.account-detail-hero p,
.profile-hero p,
.sys-hero p,
.audit-hero p,
.entry-hero p,
.import-hero p,
.hz-page-hero p,
.page-hero .text-muted,
.station-hero .text-muted,
.station-list-hero .text-muted,
.receipt-hero .text-muted,
.account-hero .text-muted,
.audit-hero .text-muted,
.metric-card small,
.metric-card .summary-time {
  color: rgba(245, 251, 255, .86) !important;
  -webkit-text-fill-color: rgba(245, 251, 255, .86) !important;
}

.metric-card .summary-time {
  background: rgba(255, 255, 255, .16) !important;
  border-color: rgba(255, 255, 255, .16) !important;
}

/* Summary time baseline
   统一所有指标卡底部说明条，跟月度结算页面保持一致。 */
.summary-time,
.metric-card .summary-time,
.station-summary-note,
.account-summary-note {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: flex-start !important;
  max-width: 100% !important;
  min-height: 28px !important;
  margin-top: .45rem !important;
  padding: .28rem .7rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  background: rgba(255, 255, 255, .18) !important;
  color: rgba(245, 251, 255, .86) !important;
  -webkit-text-fill-color: rgba(245, 251, 255, .86) !important;
  font-size: .82rem !important;
  font-weight: 650 !important;
  line-height: 1.22 !important;
  opacity: .95 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

/* Filter section title baseline
   “快捷视图 / 筛选条件”在各主页面统一字号、粗细和辅助说明。 */
.hz-section-head,
.receipt-section-head,
.station-section-head,
.account-section-head,
.settlement-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .8rem !important;
  margin-bottom: .55rem !important;
}

.hz-section-title,
.receipt-section-title,
.station-section-title,
.account-section-title,
.settlement-section-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: .42rem !important;
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  font-size: .9rem !important;
  font-weight: 720 !important;
  line-height: 1.35 !important;
  letter-spacing: -.004em !important;
}

.hz-section-title::before,
.receipt-section-title::before,
.station-section-title::before,
.account-section-title::before,
.settlement-section-title::before {
  content: "" !important;
  width: .48rem !important;
  height: .48rem !important;
  flex: 0 0 .48rem !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--hz-brand) 0%, var(--hz-brand-bright) 100%) !important;
  box-shadow: 0 0 0 .24rem rgba(17, 148, 195, .1) !important;
}

.hz-section-note,
.receipt-section-note,
.station-section-note,
.account-section-note,
.settlement-section-note {
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
  font-size: .8rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

.receipt-date-cell,
.receipt-date-cell a {
  white-space: nowrap !important;
}

/* Final typography clamp for list page section labels.
   Keep "快捷视图 / 筛选条件" identical across monthly, receipt, station and account pages. */
.hz-workspace-card .hz-section-title,
.hz-workspace-card .settlement-section-title,
.hz-workspace-card .receipt-section-title,
.hz-workspace-card .station-section-title,
.hz-workspace-card .account-section-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: .42rem !important;
  color: var(--hz-gray-900) !important;
  -webkit-text-fill-color: var(--hz-gray-900) !important;
  font-size: .9rem !important;
  font-weight: 720 !important;
  line-height: 1.35 !important;
  letter-spacing: -.004em !important;
}

.hz-workspace-card .hz-section-note,
.hz-workspace-card .settlement-section-note,
.hz-workspace-card .receipt-section-note,
.hz-workspace-card .station-section-note,
.hz-workspace-card .account-section-note {
  color: var(--hz-gray-600) !important;
  -webkit-text-fill-color: var(--hz-gray-600) !important;
  font-size: .8rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

.dashboard-period-form {
  min-width: 250px;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus,
.btn-danger:hover,
.btn-danger:focus,
.action-btn-create:hover,
.action-btn-create:focus {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Final detail polish: receipt delete/date buttons, account table spacing and unpaid labels. */
.receipt-detail-page .receipt-delete-btn {
  border-color: rgba(255, 255, 255, .72) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: rgba(255, 255, 255, .08) !important;
}

.receipt-detail-page .receipt-delete-btn:hover,
.receipt-detail-page .receipt-delete-btn:focus {
  border-color: rgba(255, 255, 255, .96) !important;
  background: rgba(255, 255, 255, .96) !important;
  color: var(--hz-danger) !important;
  -webkit-text-fill-color: var(--hz-danger) !important;
  box-shadow: 0 12px 26px rgba(185, 72, 72, .22) !important;
  transform: translateY(-1px) !important;
}

.audit-page .date-picker-open-btn:hover,
.audit-page .date-picker-open-btn:focus,
.custom-date-nav:hover,
.custom-date-nav:focus,
.custom-date-action:hover,
.custom-date-action:focus {
  border-color: rgba(17, 148, 195, .22) !important;
  background: linear-gradient(180deg, #fafdff 0%, #e9f6fb 100%) !important;
  color: var(--hz-brand-dark) !important;
  -webkit-text-fill-color: var(--hz-brand-dark) !important;
  box-shadow: 0 8px 18px rgba(17, 105, 153, .16) !important;
}

.audit-page .custom-date-cell:hover,
.audit-page .custom-date-cell:focus {
  background: rgba(17, 148, 195, .12) !important;
  color: var(--hz-brand-dark) !important;
  -webkit-text-fill-color: var(--hz-brand-dark) !important;
}

.receipt-status.danger.unpaid-status {
  min-height: 28px !important;
  padding: .36rem .78rem !important;
  border: 1px solid rgba(185, 72, 72, .24) !important;
  background: linear-gradient(180deg, #fff6f6 0%, #fdeeee 100%) !important;
  color: var(--hz-danger) !important;
  -webkit-text-fill-color: var(--hz-danger) !important;
  font-weight: 850 !important;
  box-shadow: 0 8px 18px rgba(185, 72, 72, .1) !important;
}

.settlement-paid-head {
  color: var(--hz-success) !important;
  -webkit-text-fill-color: var(--hz-success) !important;
}

.settlement-unpaid-head {
  color: var(--hz-danger) !important;
  -webkit-text-fill-color: var(--hz-danger) !important;
}

@media (max-width: 767.98px) {
  body {
    font-size: 14px !important;
  }

  .hz-workspace-card .settlement-filter-title h2,
  .hz-workspace-card .receipt-hero-head h2,
  .hz-workspace-card .station-list-workspace-title h2,
  .hz-workspace-card .account-workspace-title h2,
  .hz-table-title {
    font-size: 1.08rem !important;
  }

  .form-control,
  .form-select,
  .period-trigger,
  textarea,
  input[type="file"] {
    font-size: .88rem !important;
  }
}

@media (max-width: 767.98px) {
  .account-detail-hero,
  .receipt-detail-page .page-hero,
  .station-profile .page-hero,
  .station-detail-page .page-hero {
    padding: 1.2rem !important;
    border-radius: 21px !important;
  }

  .page-hero-actions,
  .account-detail-actions {
    justify-content: flex-start !important;
    width: 100% !important;
  }

  .page-hero-actions .btn,
  .account-detail-actions .btn {
    flex: 1 1 auto !important;
  }

  .detail-panel .card-body,
  .detail-card .card-body,
  .card.panel > .card-body,
  .panel > .card-body {
    padding: 1rem !important;
  }
}

