:root {
  color-scheme: dark;
  --bg: #0b1017;
  --panel: #131b25;
  --panel-strong: #192431;
  --line: #2a394a;
  --text: #f4f7fa;
  --muted: #9fb0c2;
  --accent: #ffb84d;
  --accent-strong: #ff9f1c;
  font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  min-width: 320px;
  margin: 0;
  background: radial-gradient(circle at top right, #172434 0, var(--bg) 42rem);
  color: var(--text);
}

a { color: inherit; }

.site-header {
  display: flex;
  align-items: baseline;
  gap: .85rem;
  padding: 1rem max(1rem, calc((100vw - 1320px) / 2));
  border-bottom: 1px solid var(--line);
  background: rgb(11 16 23 / 88%);
}

.brand { color: var(--accent); font-size: 1.2rem; font-weight: 800; text-decoration: none; }
.brand-note, .hero p, .contact-note { color: var(--muted); }
.staff-login-link { margin-left: auto; color: var(--muted); font-size: .84rem; }
.staff-nav { display: flex; align-items: center; gap: .8rem; margin-left: auto; font-size: .84rem; }
.staff-nav a { color: var(--muted); }
.staff-nav form { margin: 0; }
.staff-nav button { padding: 0; border: 0; background: transparent; color: var(--accent); font: inherit; cursor: pointer; }
.site-main { width: min(1320px, calc(100% - 2rem)); margin: 0 auto; padding: 2.5rem 0 4rem; }
.hero { margin-bottom: 1.5rem; }
.hero h1, .detail-header h1 { margin: .2rem 0 .35rem; font-size: clamp(2rem, 5vw, 3.4rem); }
.public-announcement {
  max-width: 72ch;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.eyebrow { margin: 0; color: var(--accent); font-size: .72rem; font-weight: 800; letter-spacing: .18em; }

.filter-panel {
  display: grid;
  grid-template-columns: repeat(4, minmax(8rem, 1fr));
  gap: .8rem;
  margin-bottom: 1.2rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}

.filter-panel label { display: grid; gap: .35rem; color: var(--muted); font-size: .78rem; font-weight: 700; }
.filter-panel input, .filter-panel select {
  width: 100%;
  min-height: 2.5rem;
  padding: .55rem .65rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0c131c;
  color: var(--text);
}
.filter-keyword { grid-column: span 2; }
.filter-submit, .contact-button, .detail-action, .rental-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.6rem;
  padding: .65rem 1rem;
  border: 0;
  border-radius: 9px;
  background: var(--accent);
  color: #241503;
  font: inherit;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}
.filter-submit {
  align-self: end;
  background: transparent;
  color: var(--accent);
  outline: 1px solid var(--accent);
}

.mobile-view-toolbar {
  display: none;
  justify-content: flex-end;
  margin-bottom: .75rem;
}
.mobile-view-toggle {
  min-height: 2.6rem;
  padding: .6rem .85rem;
  border: 1px solid var(--accent);
  border-radius: 9px;
  background: #211b12;
  color: var(--accent);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.listing-board { display: grid; gap: .65rem; margin: 0; padding: 0; list-style: none; }
.listing-card {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr) 15rem;
  align-items: center;
  gap: 1rem;
  padding: .9rem 1rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(110deg, var(--panel-strong), var(--panel));
}
.listing-code { display: grid; gap: .1rem; }
.listing-code-value { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; }
.special-offer-badge { display: inline-flex; align-items: center; padding: .2rem .48rem; border: 1px solid #ffb84d; border-radius: 999px; background: #5a2d0c; color: #ffd08a; font-size: .7rem; font-weight: 900; letter-spacing: .06em; white-space: nowrap; }
.listing-code > span, .summary-item dt, .detail-fields dt { color: var(--muted); font-size: .72rem; }
.listing-code strong { color: var(--accent); font-size: 1.05rem; }
.summary-grid { display: grid; grid-template-columns: repeat(9, minmax(4rem, 1fr)); gap: .7rem; margin: 0; }
.summary-item { min-width: 0; }
.summary-item dd { overflow: hidden; margin: .18rem 0 0; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.listing-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.detail-action { background: transparent; color: var(--accent); outline: 1px solid var(--accent); }
.rental-dialog {
  width: min(42rem, calc(100% - 2rem));
  max-height: calc(100dvh - 2rem);
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  color: var(--text);
}
.rental-dialog::backdrop { background: rgb(3 7 12 / 78%); }
.rental-dialog-shell { max-height: calc(100dvh - 2rem); overflow-y: auto; padding: 1.25rem; }
.rental-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.rental-dialog-header h2 { margin: 0; overflow-wrap: anywhere; }
.rental-dialog-close { min-height: 2.6rem; padding: .55rem .8rem; border: 1px solid var(--accent); border-radius: 9px; background: transparent; color: var(--accent); font: inherit; font-weight: 800; cursor: pointer; }
.staff-dialog {
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  color: var(--text);
}
.staff-dialog::backdrop { background: rgb(3 7 12 / 78%); }
.staff-dialog-shell {
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
  padding: 1.25rem;
}
.staff-dialog-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.staff-dialog-header h2 { margin: 0; overflow-wrap: anywhere; }
.staff-dialog-close {
  min-height: 2.6rem;
  padding: .55rem .8rem;
  border: 1px solid var(--accent);
  border-radius: 9px;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.phone-dialog {
  width: min(28rem, calc(100% - 2rem));
  max-height: calc(100dvh - 2rem);
}
.phone-dialog-value {
  display: block;
  min-height: 1.5rem;
  color: var(--accent);
  font-size: 1.2rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.dialog-error {
  margin: .75rem 0 0;
  color: #ff9b9b;
  overflow-wrap: anywhere;
}
.refund-dialog {
  width: min(48rem, calc(100% - 2rem));
  max-height: calc(100dvh - 2rem);
}
.refund-dialog-shell { overflow-y: auto; }
.refund-fallback-fields,
.refund-conditional-panel { display: grid; gap: 1rem; }
.refund-conditional-panel h2 { margin-bottom: 0; }
.refund-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: .75rem;
  margin-top: 1rem;
}
.refund-existing-settlement {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 0;
}
.refund-existing-settlement > div {
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.refund-existing-settlement dd { margin: .25rem 0 0; font-weight: 800; }

.contact-content { display: grid; gap: .8rem; }
.contact-content p { margin: 0; overflow-wrap: anywhere; }
.contact-information { color: var(--accent); font-weight: 800; }
.contact-image-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .85rem; }
.contact-image-figure { display: grid; gap: .45rem; min-width: 0; margin: 0; }
.contact-image-figure figcaption { color: var(--muted); font-size: .84rem; }
.contact-image-figure img { display: block; width: 100%; max-height: 22rem; object-fit: contain; border-radius: 10px; background: #fff; }

.empty-state { padding: 4rem 1rem; border: 1px dashed var(--line); border-radius: 12px; text-align: center; }
.pagination { display: flex; justify-content: center; gap: 1rem; margin-top: 1.5rem; color: var(--muted); }
.back-link { display: inline-block; margin-bottom: 1.1rem; color: var(--muted); text-decoration: none; }
.detail-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); }
.detail-header { display: flex; align-items: center; justify-content: space-between; padding: 1.5rem; border-bottom: 1px solid var(--line); }
.detail-badges { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; }
.status-badge { padding: .35rem .65rem; border-radius: 999px; background: #193d2d; color: #76e5ad; font-weight: 800; }
.detail-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.detail-fields > div { min-width: 0; padding: 1rem 1.5rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.detail-fields dd { overflow-wrap: anywhere; margin: .35rem 0 0; font-size: 1.05rem; font-weight: 700; }
.contact-area { padding: 1.5rem; }
.contact-area h2 { margin-top: 0; }
.contact-panel { margin-top: 1rem; padding: 1rem; border: 1px solid var(--accent); border-radius: 10px; background: #211b12; }
.contact-panel p { margin-bottom: 0; }

.staff-page-header { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.staff-page-header h1, .staff-form-card h1 { margin: .2rem 0 .35rem; }
.staff-page-header p, .field-help { color: var(--muted); }
.staff-filters { grid-template-columns: repeat(5, minmax(8rem, 1fr)); }
.staff-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
.staff-table { width: 100%; min-width: 1180px; border-collapse: collapse; }
.staff-table th, .staff-table td { padding: .75rem; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.staff-table th { color: var(--muted); font-size: .75rem; }
.staff-table tbody tr:last-child td { border-bottom: 0; }
.audit-summary { min-width: 14rem; white-space: normal; overflow-wrap: anywhere; }
.audit-details { width: min(48rem, 68vw); min-width: 22rem; }
.audit-details summary { cursor: pointer; color: var(--accent); font-weight: 800; }
.audit-json-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: .75rem; }
.audit-json-panel { min-width: 0; padding: .75rem; border: 1px solid var(--line); border-radius: 9px; background: #0c131c; }
.audit-json-panel h3 { margin: 0 0 .5rem; color: var(--muted); font-size: .78rem; }
.audit-json-panel pre { max-width: 100%; margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text); }
.table-action { color: var(--accent); font-weight: 800; }
.staff-form-card { max-width: 760px; margin: 0 auto; padding: 1.25rem; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.staff-form { display: grid; gap: 1rem; }
.staff-form fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; margin: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; }
.staff-form legend { padding: 0 .35rem; color: var(--accent); font-weight: 800; }
.staff-form label { display: grid; gap: .35rem; color: var(--muted); font-size: .82rem; font-weight: 700; }
.staff-form input:not([type="checkbox"]), .staff-form select, .staff-form textarea { width: 100%; min-height: 2.6rem; padding: .6rem .7rem; border: 1px solid var(--line); border-radius: 8px; background: #0c131c; color: var(--text); }
.staff-form textarea { resize: vertical; }
.field-help, .form-errors { grid-column: 1 / -1; margin: 0; }
.form-errors, .errorlist { color: #ff9b9b; }
.result-message { margin: 1rem 0; padding: .85rem 1rem; border: 1px solid #3f8f72; border-radius: 10px; background: #102b24; color: #b7f5dd; overflow-wrap: anywhere; }
.staff-actions { padding: 1.5rem; }
.staff-actions h2 { margin-top: 0; }
.action-row { display: flex; flex-wrap: wrap; gap: .7rem; }
.action-row form { margin: 0; }
.stage-action {
  margin-left: auto;
  background: var(--accent);
  color: #241503;
  outline: 0;
}
.primary-submit {
  background: var(--accent);
  color: #241503;
  outline: 0;
  box-shadow: 0 7px 18px rgb(230 162 60 / 22%);
}
.danger-action { outline: 1px solid #ff7777; color: #ff9b9b; }
.filter-submit.danger-action { background: #2b1114; }

.settlement-page-card { max-width: 1120px; }
.settlement-workspace {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: 1rem;
}
.settlement-track {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0f1721;
}
.settlement-track-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.settlement-track-header h2 { margin: .2rem 0 0; }
.track-status {
  margin: 0;
  padding: .35rem .65rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
}
.track-status.is-complete { color: #76e5ad; }
.track-status.is-pending { color: #ffd08a; }
.settlement-track-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  margin: 1rem 0;
}
.settlement-track-summary > div {
  min-width: 0;
  padding: .7rem;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
}
.settlement-track-summary dt { color: var(--muted); font-size: .72rem; }
.settlement-track-summary dd { margin: .25rem 0 0; font-weight: 800; overflow-wrap: anywhere; }
.settlement-track-form { margin-top: 1rem; }
.settlement-track-form fieldset { grid-template-columns: 1fr; }
.track-notice {
  margin: 1rem 0 0;
  padding: .8rem;
  border: 1px solid #a97932;
  border-radius: 9px;
  background: #2a2114;
  color: #ffd08a;
}
.reversal-form { padding-top: 1rem; border-top: 1px solid var(--line); }

.statistics-filter-panel { grid-template-columns: repeat(5, minmax(8rem, 1fr)); }
.statistics-filter-field { display: grid; gap: .35rem; min-width: 0; }
.statistics-filter-panel .errorlist { grid-column: 1 / -1; margin: 0; padding-left: 1.1rem; }
.statistics-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 1rem; }
.metric-card { min-width: 0; padding: 1.25rem; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(145deg, var(--panel-strong), var(--panel)); }
.metric-label { margin: 0; color: var(--muted); font-size: .8rem; font-weight: 800; }
.metric-value { margin: .55rem 0 0; color: var(--accent); font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 900; line-height: 1.1; overflow-wrap: anywhere; }
.metric-money { font-variant-numeric: tabular-nums; }

.catalog-export-format-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.catalog-export-part-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 1rem;
}
.catalog-export-part-form {
  display: grid;
  gap: .75rem;
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}
.catalog-export-part-form p { margin: 0; color: var(--muted); }
@media (max-width: 1200px) {
  .filter-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .listing-card { grid-template-columns: 6.5rem minmax(0, 1fr) 14rem; }
  .summary-grid { grid-template-columns: repeat(4, minmax(4rem, 1fr)); }
  .detail-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .staff-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .statistics-filter-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .site-header { align-items: flex-start; flex-wrap: wrap; padding-inline: 1rem; }
  .staff-nav { flex-basis: 100%; flex-wrap: wrap; margin-left: 0; }
  .brand-note { display: none; }
  .site-main { width: min(100% - 1rem, 42rem); padding-top: 1.5rem; }
  .filter-panel { grid-template-columns: 1fr; }
  .filter-keyword { grid-column: auto; }
  .mobile-view-toolbar { display: flex; }
  .public-listing-view { overflow-x: auto; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
  .listing-card { display: block; padding: 1rem; }
  .listing-code { margin-bottom: .85rem; }
  .summary-grid { grid-template-columns: 1fr; gap: 0; }
  .summary-item { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-top: 1px solid var(--line); }
  .summary-item dd { margin: 0; text-align: right; white-space: normal; }
  .listing-actions { grid-template-columns: 1fr; margin-top: .85rem; }
  .listing-actions .detail-action, .listing-actions .rental-action { width: 100%; }
  .contact-image-grid { grid-template-columns: 1fr; }
  .detail-header { align-items: flex-start; gap: 1rem; padding: 1rem; }
  .detail-header h1 { font-size: 1.8rem; }
  .detail-fields { grid-template-columns: 1fr; }
  .detail-fields > div, .contact-area { padding: 1rem; border-right: 0; }
  .contact-button { width: 100%; }
  .staff-filters, .staff-form fieldset { grid-template-columns: 1fr; }
  .statistics-filter-panel { grid-template-columns: 1fr; }
  .audit-json-grid { grid-template-columns: 1fr; }
  .audit-details { width: 100%; min-width: 0; }
  .settlement-workspace { grid-template-columns: 1fr; }
  .staff-table { min-width: 0; }
  .staff-table thead { display: none; }
  .staff-table, .staff-table tbody, .staff-table tr, .staff-table td { display: block; width: 100%; }
  .staff-table tr { padding: .6rem 0; border-bottom: 1px solid var(--line); }
  .staff-table tr:last-child { border-bottom: 0; }
  .staff-table td { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem .75rem; border: 0; white-space: normal; text-align: right; }
  .staff-table td::before { content: attr(data-label); color: var(--muted); font-size: .75rem; font-weight: 700; text-align: left; }
  .public-listing-view.is-wide-view .listing-board { min-width: 1180px; }
  .public-listing-view.is-wide-view .listing-card { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr) 15rem; padding: .9rem 1rem; }
  .public-listing-view.is-wide-view .listing-code { margin-bottom: 0; }
  .public-listing-view.is-wide-view .summary-grid { grid-template-columns: repeat(9, minmax(4rem, 1fr)); gap: .7rem; }
  .public-listing-view.is-wide-view .summary-item { display: block; padding: 0; border-top: 0; }
  .public-listing-view.is-wide-view .summary-item dd { margin: .18rem 0 0; text-align: left; white-space: nowrap; }
  .public-listing-view.is-wide-view .listing-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 0; }
  .staff-table-wrap.is-wide-view .staff-table { display: table; width: 100%; min-width: 1180px; }
  .staff-table-wrap.is-wide-view .staff-table thead { display: table-header-group; }
  .staff-table-wrap.is-wide-view .staff-table tbody { display: table-row-group; width: auto; }
  .staff-table-wrap.is-wide-view .staff-table tr { display: table-row; width: auto; padding: 0; border-bottom: 0; }
  .staff-table-wrap.is-wide-view .staff-table th,
  .staff-table-wrap.is-wide-view .staff-table td {
    display: table-cell;
    width: auto;
    padding: .75rem;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
    text-align: left;
  }
  .staff-table-wrap.is-wide-view .staff-table td::before { display: none; content: none; }
  .staff-actions { padding: 1rem; }
  .action-row, .action-row form, .action-row .detail-action { width: 100%; }
  .stage-action { order: 99; width: 100%; margin-left: 0; }
  .catalog-export-format-actions { grid-template-columns: 1fr; }
  .catalog-export-part-form .primary-submit { width: 100%; }
}

@media (max-width: 320px) {
  .site-header { align-items: flex-start; flex-wrap: wrap; }
  .staff-login-link { flex-basis: 100%; margin-left: 0; }
  .site-main { width: calc(100% - .75rem); }
  .statistics-grid { grid-template-columns: 1fr; }
  .settlement-workspace, .settlement-track-summary { grid-template-columns: 1fr; }
}
.site-settings-card { max-width: 1180px; }
.site-settings-form > fieldset,
.contact-images-fieldset { grid-template-columns: 1fr; }
.contact-image-slots {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: .8rem;
}
.contact-image-slot {
  min-width: 0;
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #0f1721;
}
.contact-image-slot h2 { margin: 0 0 .7rem; font-size: 1rem; }
.contact-image-slot img {
  display: block;
  width: 100%;
  max-height: 15rem;
  margin-bottom: .65rem;
  object-fit: contain;
  border-radius: 8px;
  background: #fff;
}
.inline-check {
  display: flex !important;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: .45rem !important;
}
.settings-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.settings-field-grid fieldset {
  grid-template-columns: 1fr;
  align-content: start;
}
.field-choice-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
}
.selected-field-list {
  display: grid;
  gap: .45rem;
  margin: .2rem 0 0;
  padding: 0;
  list-style: none;
}
.selected-field-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: .5rem;
  padding: .6rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0c131c;
}
.selected-field-list button,
.settings-sync-button {
  min-height: 2rem;
  padding: .35rem .55rem;
  border: 1px solid var(--accent);
  border-radius: 7px;
  background: transparent;
  color: var(--accent);
  cursor: pointer;
}
.drag-handle { color: var(--muted); cursor: grab; }

@media (max-width: 768px) {
  .settings-field-grid,
  .field-choice-list { grid-template-columns: 1fr; }
  .selected-field-list li {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .selected-field-list button { width: 100%; }
}

.staff-page-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .7rem;
}
.staff-page-actions button.detail-action {
  min-height: 2.7rem;
  border: 0;
  border-radius: 9px;
  padding: .7rem 1rem;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.catalog-export-dialog {
  width: min(32rem, calc(100% - 2rem));
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  color: var(--text);
}
.catalog-export-dialog::backdrop { background: rgb(3 7 12 / 78%); }
.catalog-export-dialog-shell { padding: 1.25rem; }
.catalog-export-dialog-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.catalog-export-dialog-header h2 { margin: .2rem 0 0; }
.catalog-export-close {
  min-height: 2.6rem;
  padding: .55rem .8rem;
  border: 1px solid var(--accent);
  border-radius: 9px;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.catalog-export-form { display: grid; gap: 1rem; margin-top: 1rem; }
.catalog-export-form fieldset {
  display: grid;
  gap: .7rem;
  margin: 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.catalog-export-form legend { padding: 0 .35rem; color: var(--accent); font-weight: 800; }
.catalog-export-form label { display: flex; align-items: center; gap: .55rem; }

@media (max-width: 640px) {
  .staff-page-header, .staff-page-actions { align-items: stretch; flex-direction: column; }
  .staff-page-actions .detail-action { width: 100%; text-align: center; }
  .refund-dialog-shell { padding: 1rem; }
  .refund-dialog-actions { flex-direction: column; }
  .refund-dialog-actions .filter-submit { width: 100%; }
  .refund-existing-settlement { grid-template-columns: 1fr; }
}

.receipt-page-header,
.receipt-cycle-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  padding: 22px;
}
.receipt-page-header { margin: 16px 0 20px; }
.receipt-cycle-list { display: grid; gap: 22px; }
.receipt-cycle-header {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: flex-start;
}
.receipt-cycle-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 12px;
  margin: 0;
}
.receipt-cycle-meta div,
.receipt-history-item {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
}
.receipt-cycle-meta dt { color: var(--muted); font-size: .82rem; }
.receipt-cycle-meta dd { margin: 4px 0 0; }
.receipt-legacy-notice {
  margin: 18px 0 0;
  padding: 18px;
  border-radius: 12px;
  background: rgba(255, 204, 102, .08);
  color: #ffd98d;
}
.receipt-type-section,
.receipt-history {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.receipt-section-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
}
.receipt-section-heading span { color: var(--muted); }
.receipt-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.receipt-image-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  background: rgba(255, 255, 255, .02);
}
.receipt-image-link {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 10px;
  background: #10151d;
}
.receipt-image-link img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.receipt-image-actions,
.receipt-mutation-form,
.receipt-history,
.receipt-history-item,
.receipt-history-links {
  display: grid;
  gap: 10px;
}
.receipt-image-actions {
  margin-top: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.receipt-mutation-form {
  align-content: start;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.receipt-mutation-form label { display: grid; gap: 6px; }
.receipt-mutation-form textarea,
.receipt-mutation-form input[type="file"] { width: 100%; }
.receipt-add-form {
  max-width: 560px;
  margin-top: 16px;
}
.receipt-history-item header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.receipt-history-item header span,
.receipt-history-item h4 { color: var(--muted); }
.receipt-history-item h4 { margin: 0 0 6px; }
.receipt-history-links {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

@media (max-width: 768px) {
  .receipt-page-header,
  .receipt-cycle-card { padding: 16px; }
  .receipt-cycle-header { display: grid; }
  .receipt-cycle-meta,
  .receipt-gallery,
  .receipt-image-actions,
  .receipt-history-links { grid-template-columns: 1fr; }
  .receipt-section-heading,
  .receipt-history-item header { align-items: flex-start; flex-direction: column; }
  .receipt-mutation-form .detail-action { width: 100%; }
}

.collection-page-header,
.collection-cycle {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  padding: 22px;
}
.collection-page-header { margin: 16px 0 20px; }
.collection-cycle-list,
.collection-card-list,
.collection-history-list { display: grid; gap: 16px; }
.collection-cycle-header,
.collection-card-header,
.collection-section-heading,
.collection-version-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.collection-cycle-header p,
.collection-card-header time,
.collection-section-heading span,
.collection-version-row { color: var(--muted); }
.collection-summary-grid,
.collection-card-meta {
  display: grid;
  gap: 12px;
  margin: 18px 0 0;
}
.collection-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.collection-card-meta { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.collection-summary-grid div,
.collection-card-meta div,
.collection-history-item {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .02);
}
.collection-summary-grid dt,
.collection-card-meta dt { color: var(--muted); font-size: .82rem; }
.collection-summary-grid dd,
.collection-card-meta dd { margin: 4px 0 0; font-weight: 800; }
.collection-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0f1721;
}
.collection-card-list { margin-top: 20px; }
.collection-card-header h3 { margin: 4px 0 0; }
.collection-receipts,
.collection-admin-history > section {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.collection-receipt-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.collection-receipt-link {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 10px;
  background: #10151d;
}
.collection-receipt-link img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.collection-admin-history {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.collection-admin-history summary { color: var(--accent); cursor: pointer; font-weight: 800; }
.collection-version-row { margin-top: 14px; flex-wrap: wrap; }
.collection-history-item { display: grid; gap: 6px; }
.collection-history-item span { overflow-wrap: anywhere; }
.collection-history-links { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 900px) {
  .collection-summary-grid,
  .collection-card-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .collection-page-header,
  .collection-cycle { padding: 16px; }
  .collection-cycle-header,
  .collection-card-header,
  .collection-section-heading { flex-direction: column; }
  .collection-summary-grid,
  .collection-card-meta,
  .collection-receipt-gallery { grid-template-columns: 1fr; }
}
