:root, html[data-theme] {
  --primary: #0873aa;
  --secondary: #065d8c;
  --accent: #fff;
  --primary-fg: #fff;
  --body-bg: #f5f7fa;
  --body-fg: #202938;
  --body-quiet-color: #616e80;
  --body-medium-color: #46556a;
  --body-loud-color: #202938;
  --darkened-bg: #f0f3f7;
  --hairline-color: #e8ecf2;
  --border-color: #dce3ed;
  --link-fg: #08689a;
  --link-hover-color: #065d8c;
  --link-selected-fg: #065d8c;
  --header-bg: #fff;
  --header-color: #202938;
  --header-link-color: #46556a;
  --header-branding-color: #202938;
  --breadcrumbs-bg: transparent;
  --breadcrumbs-fg: #616e80;
  --breadcrumbs-link-fg: #08689a;
  --selected-bg: #eaf5fc;
  --selected-row: #eaf5fc;
  --button-bg: #0873aa;
  --button-hover-bg: #065d8c;
  --default-button-bg: #0873aa;
  --default-button-hover-bg: #065d8c;
  --close-button-bg: #e9eef4;
  --close-button-hover-bg: #dce4ed;
  --paopao-surface: #fff;
  --paopao-shadow: 0 4px 20px #20293807;
  --paopao-pink: #bd3c70;
  --paopao-pink-soft: #fff1f6;
  --paopao-green: #157361;
  --paopao-green-soft: #eaf6f0;
  --paopao-amber: #936018;
  --paopao-amber-soft: #fff4df;
  --paopao-radius: 8px;
  --paopao-sidebar: 224px;
  --font-family-primary: "Microsoft YaHei", "PingFang SC", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
html[data-theme="dark"] {
  --body-bg: #17191e;
  --body-fg: #e5e8ee;
  --body-quiet-color: #a0aabb;
  --body-medium-color: #b8c2d1;
  --body-loud-color: #f4f6fa;
  --darkened-bg: #292d35;
  --hairline-color: #313640;
  --border-color: #414956;
  --link-fg: #75c7f3;
  --link-hover-color: #a3dcfa;
  --link-selected-fg: #a3dcfa;
  --header-bg: #202329;
  --header-color: #e5e8ee;
  --header-link-color: #b8c2d1;
  --header-branding-color: #e5e8ee;
  --breadcrumbs-fg: #a0aabb;
  --breadcrumbs-link-fg: #75c7f3;
  --selected-bg: #18394c;
  --selected-row: #18394c;
  --paopao-surface: #202329;
  --paopao-shadow: 0 4px 20px #00000012;
  --paopao-pink: #f290b5;
  --paopao-pink-soft: #422536;
  --paopao-green: #71d1b0;
  --paopao-green-soft: #1d3a31;
  --paopao-amber: #eac17e;
  --paopao-amber-soft: #403320;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --body-bg: #17191e;
    --body-fg: #e5e8ee;
    --body-quiet-color: #a0aabb;
    --body-medium-color: #b8c2d1;
    --body-loud-color: #f4f6fa;
    --darkened-bg: #292d35;
    --hairline-color: #313640;
    --border-color: #414956;
    --link-fg: #75c7f3;
    --link-hover-color: #a3dcfa;
    --link-selected-fg: #a3dcfa;
    --header-bg: #202329;
    --header-color: #e5e8ee;
    --header-link-color: #b8c2d1;
    --header-branding-color: #e5e8ee;
    --breadcrumbs-fg: #a0aabb;
    --breadcrumbs-link-fg: #75c7f3;
    --selected-bg: #18394c;
    --selected-row: #18394c;
    --paopao-surface: #202329;
    --paopao-shadow: 0 4px 20px #00000012;
    --paopao-pink: #f290b5;
    --paopao-pink-soft: #422536;
    --paopao-green: #71d1b0;
    --paopao-green-soft: #1d3a31;
    --paopao-amber: #eac17e;
    --paopao-amber-soft: #403320;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
body { font-size: 14px; letter-spacing: 0; line-height: 1.6; }
a:link, a:visited { text-decoration: none; }
button, input, textarea, select { font-family: var(--font-family-primary); letter-spacing: 0; }
:is(a, button, input, textarea, select, summary):focus-visible { outline: 2px solid var(--link-fg); outline-offset: 3px; }
:is(button, input)[disabled] { opacity: .5; cursor: default; }
#container { min-width: 0; }
#header.paopao-topbar { height: 72px; min-height: 72px; padding: 0 32px; margin-left: var(--paopao-sidebar); width: calc(100% - var(--paopao-sidebar)); display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 16px; background: var(--paopao-surface); color: var(--body-fg); box-shadow: 0 2px 12px #20293803; }
#header a:link, #header a:visited { color: var(--body-medium-color); border: 0; }
.topbar-label { font-size: 14px; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 20px; margin-left: auto; }
.site-link { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; font-size: 13px; }
.site-link img, .account-dropdown summary > img { width: 17px; height: 17px; }
.paopao-sidebar { position: fixed; top: 0; bottom: 0; left: 0; z-index: 40; width: var(--paopao-sidebar); background: var(--paopao-surface); display: flex; flex-direction: column; }
.paopao-brand { display: flex; align-items: center; gap: 10px; height: 88px; min-height: 88px; padding: 0 24px; font-size: 20px; font-weight: 700; color: var(--body-fg) !important; }
.paopao-brand small { display: block; margin-top: 2px; color: var(--body-quiet-color); font-size: 12px; font-weight: 400; }
.brand-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--primary); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.brand-icon img { width: 23px; height: 23px; filter: invert(1); }
.admin-nav { overflow-y: auto; padding: 8px 14px 20px; flex: 1; }
.admin-nav-group { margin-top: 20px; }
.admin-nav-label { display: block; margin: 0 12px 8px; font-size: 12px; color: var(--body-quiet-color); }
.admin-nav-item { display: flex; align-items: center; gap: 11px; padding: 10px 12px; min-height: 42px; border-radius: 6px; margin: 2px 0; color: var(--body-medium-color) !important; font-size: 13px; }
.admin-nav-item img { height: 18px; width: 18px; opacity: .65; flex-shrink: 0; }
.admin-nav-item:hover { background: var(--darkened-bg); }
.admin-nav-item.active { background: var(--selected-bg); color: var(--link-fg) !important; font-weight: 600; }
.sidebar-account { display: flex; align-items: center; gap: 10px; padding: 18px 24px; background: var(--paopao-surface); }
.sidebar-account > span:last-child { min-width: 0; font-size: 12px; overflow-wrap: anywhere; }
.sidebar-account small { display: block; color: var(--body-quiet-color); font-size: 12px; margin-top: 2px; }
.admin-avatar { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--paopao-pink-soft); color: var(--paopao-pink); font-size: 13px; font-weight: 600; flex-shrink: 0; }
.account-dropdown { position: relative; font-size: 13px; }
.account-dropdown summary { display: flex; align-items: center; gap: 9px; min-height: 44px; list-style: none; cursor: pointer; }
.account-dropdown summary::-webkit-details-marker { display: none; }
.account-dropdown-content { position: absolute; top: calc(100% + 8px); right: 0; width: 160px; z-index: 60; padding: 8px; border-radius: 8px; background: var(--paopao-surface); box-shadow: 0 8px 30px #0002; }
.account-dropdown-content a, #logout-form button { display: block; width: 100%; min-height: 40px; padding: 10px 12px; text-align: left; font-size: 13px; color: var(--body-fg) !important; border-radius: 6px; border: 0; background: none; cursor: pointer; }
.account-dropdown-content a:hover, #logout-form button:hover { background: var(--darkened-bg); }
#header .theme-toggle { color: var(--body-quiet-color); padding: 10px; width: 40px; height: 40px; border-radius: 6px; }
#header .theme-toggle:hover { background: var(--darkened-bg); }
.mobile-navigation { display: none; }
body:not(.popup) #main { margin-left: var(--paopao-sidebar); }
#main > .content { min-width: 0; max-width: 100%; }
#content { padding: 32px; width: 100%; }
div.breadcrumbs { margin-left: var(--paopao-sidebar); padding: 18px 32px 0; font-size: 12px; background: transparent; color: var(--body-quiet-color); }
div.breadcrumbs a { color: var(--link-fg); }
.admin-page-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 28px; }
.admin-page-heading h1 { color: var(--body-fg); font-size: 24px; font-weight: 650; margin: 0; line-height: 1.4; }
.admin-date { font-size: 12px; color: var(--body-quiet-color); }
#content h2 { font-size: 15px; }
#content-main { min-width: 0; width: 100%; float: none; }
.operations-dashboard { display: flex; flex-direction: column; gap: 24px; }
.overview-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.overview-stat { display: block; min-width: 0; padding: 20px; border-radius: 8px; background: var(--paopao-surface); box-shadow: var(--paopao-shadow); color: var(--body-fg) !important; }
.overview-stat:hover { box-shadow: 0 5px 24px #20293814; }
.stat-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 16px; font-size: 12px; color: var(--body-quiet-color); }
.stat-icon { display: flex; align-items: center; justify-content: center; height: 34px; width: 34px; border-radius: 8px; background: var(--selected-bg); flex-shrink: 0; }
.stat-icon img { width: 18px; height: 18px; }
.stat-icon.pink { background: var(--paopao-pink-soft); }
.stat-icon.green { background: var(--paopao-green-soft); }
.overview-stat > strong { display: block; font-size: 28px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.overview-stat > small { display: block; margin-top: 8px; color: var(--body-quiet-color); font-size: 12px; }
.overview-columns { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(260px, 1fr); gap: 24px; }
.bottom-columns { align-items: start; }
.operations-section { min-width: 0; padding: 24px; background: var(--paopao-surface); border-radius: 8px; box-shadow: var(--paopao-shadow); }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.section-heading h2 { margin: 0; color: var(--body-fg); font-size: 15px; font-weight: 600; background: transparent; padding: 0; }
.section-meta { display: block; color: var(--body-quiet-color); font-size: 12px; margin-top: 6px; }
.chart-total { font-size: 26px; font-weight: 600; white-space: nowrap; }
.chart-total small { font-size: 12px; font-weight: 400; color: var(--body-quiet-color); }
.orders-chart { height: 184px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.chart-column { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; }
.chart-value, .chart-label { font-size: 12px; color: var(--body-quiet-color); line-height: 1.5; }
.chart-track { height: 130px; width: 100%; max-width: 36px; display: flex; align-items: flex-end; background: var(--darkened-bg); border-radius: 4px; overflow: hidden; }
.chart-bar { display: block; width: 100%; min-height: 0; background: var(--primary); border-radius: 4px; }
.task-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; min-height: 56px; color: var(--body-fg) !important; font-size: 13px; }
.task-row:hover { color: var(--link-fg) !important; }
.task-icon, .shortcut-icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: var(--darkened-bg); flex-shrink: 0; }
.task-icon img, .shortcut-icon img { width: 18px; height: 18px; }
.task-row > strong { margin-left: auto; font-size: 18px; font-weight: 600; }
.task-row > img { width: 16px; height: 16px; opacity: .55; }
.needs-attention { color: var(--paopao-amber); }
.text-link { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; font-size: 12px; }
.text-link img { width: 15px; height: 15px; }
.table-scroll { width: 100%; overflow-x: auto; }
.operations-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.operations-table thead th { padding: 12px 16px; background: var(--darkened-bg); color: var(--body-quiet-color); font-size: 12px; font-weight: 500; text-transform: none; }
.operations-table td { padding: 15px 16px; border-bottom: 0; vertical-align: middle; white-space: nowrap; }
.operations-table tbody tr:nth-child(even) { background: color-mix(in srgb, var(--darkened-bg) 45%, transparent); }
.operations-table tbody tr:hover { background: var(--selected-bg); }
.order-title { color: var(--body-fg) !important; font-weight: 500; }
.order-id { display: block; font-size: 12px; color: var(--body-quiet-color); margin-top: 4px; }
.money-cell { font-variant-numeric: tabular-nums; font-weight: 600; }
.table-action { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; min-width: 40px; }
.status-badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; font-size: 12px; line-height: 1.7; border-radius: 4px; background: var(--darkened-bg); color: var(--body-quiet-color); white-space: nowrap; font-weight: 500; }
.status-paid, .status-active { background: var(--paopao-green-soft); color: var(--paopao-green); }
.status-processing, .status-refunding, .status-pending { background: var(--paopao-amber-soft); color: var(--paopao-amber); }
.status-part_refund, .status-refunded { background: var(--paopao-pink-soft); color: var(--paopao-pink); }
.dashboard-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dashboard-shortcuts a { display: flex; align-items: center; gap: 10px; padding: 12px 0; min-width: 0; color: var(--body-fg); font-size: 13px; }
.dashboard-shortcuts a:hover { color: var(--link-fg); }
.dashboard-shortcuts a > img { width: 15px; height: 15px; opacity: .55; margin-left: auto; }
.audit-entry { display: flex; gap: 12px; padding: 10px 0; }
.audit-dot { height: 7px; width: 7px; flex-shrink: 0; border-radius: 50%; background: var(--primary); margin-top: 7px; }
.audit-entry strong { font-size: 12px; font-weight: 500; }
.audit-entry div > span { display: block; margin-top: 4px; font-size: 12px; color: var(--body-quiet-color); }
.empty-state { padding: 32px 16px; text-align: center; color: var(--body-quiet-color); font-size: 13px; }
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="url"], input[type="search"], select, textarea, .vTextField {
  min-height: 42px; border-radius: 6px; border: 1px solid var(--border-color); padding: 10px 12px; background: var(--paopao-surface); color: var(--body-fg); font-size: 13px;
}
textarea { min-height: 112px; max-width: 100%; }
input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--primary); }
input[type="file"] { font-size: 13px; max-width: 100%; }
.button, input[type="submit"], input[type="button"], button[type="submit"], .submit-row a.deletelink, .object-tools a, .submit-row a.closelink {
  display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 10px 16px; box-sizing: border-box; border-radius: 6px; border: 0; font-size: 13px; line-height: 1.5; font-weight: 500; cursor: pointer;
}
.object-tools { float: none; display: flex; justify-content: flex-end; gap: 8px; padding: 0; margin: -66px 0 24px; position: relative; }
.object-tools li { padding: 0; height: auto; margin: 0; }
.object-tools a:link, .object-tools a:visited { background: var(--primary); color: white; padding: 10px 16px; }
.object-tools a:hover { background: var(--secondary); }
.object-tools a.addlink { background-image: none; }
.module { background: var(--paopao-surface); border: 0; border-radius: 8px; box-shadow: var(--paopao-shadow); overflow: hidden; margin-bottom: 24px; }
.module h2, .module caption, .inline-group h2 { padding: 16px 20px; background: var(--paopao-surface); color: var(--body-fg); font-size: 14px; font-weight: 600; }
fieldset.module { padding: 8px 4px; }
fieldset.module > h2 { padding-bottom: 8px; }
#changelist { display: flex; gap: 20px; background: transparent; box-shadow: none; overflow: visible; }
#changelist .changelist-form-container { min-width: 0; width: 100%; background: var(--paopao-surface); border-radius: 8px; box-shadow: var(--paopao-shadow); overflow: hidden; }
#changelist-form { margin: 0; }
#toolbar { padding: 20px; border: 0; background: var(--paopao-surface); }
#toolbar form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
#toolbar form input[type="text"] { height: 42px; padding: 10px 12px; margin: 0; max-width: 100%; }
#toolbar form input[type="submit"] { margin: 0; height: 42px; padding: 10px 16px; border: 0; box-shadow: none; background: var(--darkened-bg); color: var(--body-fg); font-size: 13px; }
#toolbar form label { display: inline-flex; align-items: center; }
#changelist .actions { padding: 12px 20px; border: 0; background: var(--darkened-bg); color: var(--body-quiet-color); display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
#changelist .actions label { font-size: 12px; }
#changelist .actions select { height: 40px; margin: 0 8px; padding: 8px 12px; font-size: 12px; }
#changelist .actions .button { height: 40px; padding: 8px 14px; font-size: 12px; }
#changelist .actions .action-counter { font-size: 12px; }
#changelist .results { overflow-x: auto; width: 100%; }
#result_list { width: 100%; background: var(--paopao-surface); }
#result_list thead th { padding: 12px 16px; background: var(--darkened-bg); color: var(--body-quiet-color); font-size: 12px; text-transform: none; border: 0; font-weight: 500; }
#result_list thead th .text a { padding: 0; color: var(--body-quiet-color); }
#result_list tbody td, #result_list tbody th { padding: 14px 16px; background: transparent; font-size: 13px; line-height: 1.8; border: 0; vertical-align: middle; }
#result_list tbody th a { display: inline-flex; min-height: 40px; align-items: center; font-weight: 500; }
#result_list tbody tr { background: var(--paopao-surface); }
#result_list tbody tr:nth-child(even) { background: color-mix(in srgb, var(--darkened-bg) 45%, transparent); }
#result_list tbody tr:hover, #result_list tbody tr.selected { background: var(--selected-row); }
#result_list .action-checkbox { width: 44px; }
#result_list .field-id { font-size: 12px; overflow-wrap: anywhere; max-width: 200px; }
#changelist .paginator { padding: 18px 20px; background: var(--paopao-surface); border: 0; font-size: 12px; color: var(--body-quiet-color); }
#changelist .paginator a { display: inline-flex; min-width: 40px; min-height: 40px; align-items: center; justify-content: center; border-radius: 6px; }
#changelist-filter { flex: 0 0 208px; width: 208px; background: var(--paopao-surface); border-radius: 8px; box-shadow: var(--paopao-shadow); margin: 0; align-self: flex-start; overflow: hidden; }
#changelist-filter h2 { padding: 16px 20px; margin: 0; background: transparent; color: var(--body-fg); font-size: 14px; font-weight: 600; }
#changelist-filter details { padding: 12px 20px; border-top: 0; }
#changelist-filter details summary { color: var(--body-fg); font-weight: 600; font-size: 12px; min-height: 32px; }
#changelist-filter ul { padding: 0; margin: 0; }
#changelist-filter li { padding: 0; margin: 2px 0; border: 0; }
#changelist-filter li a { display: block; padding: 10px; min-height: 40px; color: var(--body-quiet-color); font-size: 12px; border-radius: 4px; }
#changelist-filter li.selected a { color: var(--link-fg); background: var(--selected-bg); }
#changelist-filter li a:hover { background: var(--darkened-bg); }
.form-row { padding: 16px 20px; border: 0; }
.form-row > div { max-width: 100%; }
.aligned .form-row > div { width: 100%; min-width: 0; max-width: 100%; }
.form-row .flex-container { min-width: 0; }
.aligned .form-row .flex-container { max-width: 100%; }
.form-row .flex-container > div { min-width: 0; max-width: 100%; }
.form-row label { color: var(--body-medium-color); font-size: 13px; padding-top: 10px; }
.form-row .help, .help, p.help { font-size: 12px; color: var(--body-quiet-color); line-height: 1.7; }
.aligned .form-row input:not([type="checkbox"]), .aligned .form-row textarea { max-width: 100%; }
.form-row .readonly { color: var(--body-fg); font-size: 13px; padding-top: 10px; }
.submit-row { background: var(--paopao-surface); border: 0; padding: 20px; border-radius: 8px; box-shadow: var(--paopao-shadow); display: flex; flex-wrap: wrap; gap: 10px; }
.submit-row input { margin: 0; }
.submit-row a.closelink { color: var(--body-fg); background: var(--darkened-bg); }
.submit-row .deletelink-box { margin-left: auto; }
.selector { max-width: 100%; }
.selector .selector-available h2, .selector .selector-chosen h2 { background: var(--darkened-bg); color: var(--body-fg); }
.select2-container--admin-autocomplete .select2-selection--single { min-height: 42px; border-radius: 6px; border-color: var(--border-color); background: var(--paopao-surface); }
.select2-container--admin-autocomplete .select2-selection--single .select2-selection__rendered { line-height: 40px; color: var(--body-fg); }
.related-widget-wrapper { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; max-width: 100%; min-width: 0; }
.related-widget-wrapper .select2-container { flex: 1 1 200px; min-width: 0; max-width: 100%; }
.related-widget-wrapper-link { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; margin: 0; }
ul.messagelist { margin-left: 0; }
ul.messagelist li { margin: 20px 32px 0; padding: 14px 20px 14px 42px; border-radius: 8px; font-size: 13px; }
.admin-form-surface { max-width: 860px; padding: 28px; background: var(--paopao-surface); border-radius: 8px; box-shadow: var(--paopao-shadow); }
.admin-form-surface > p:first-child { margin-top: 0; color: var(--body-quiet-color); font-size: 13px; }
.admin-form-surface form > p { margin: 20px 0; }
.admin-form-surface label { display: block; margin-bottom: 8px; font-size: 13px; color: var(--body-medium-color); }
.admin-form-surface :is(input:not([type="submit"]):not([type="hidden"]), select, textarea) { width: 100%; }
.adjustment-preview { padding: 20px; margin: 24px 0; background: var(--selected-bg); border-radius: 6px; }
.adjustment-preview p { margin: 6px 0; }
.form-footer { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.form-footer a { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 14px; font-size: 13px; }
.ai-test-section { padding: 20px; background: var(--paopao-surface); border-radius: 8px; margin-bottom: 24px; }
.ai-test-section p { font-size: 12px; color: var(--body-quiet-color); }
.admin-thumbnail { width: 36px; height: 36px; border-radius: 50%; vertical-align: middle; object-fit: cover; background: var(--darkened-bg); }
body.login { background: var(--body-bg); }
body.login #container { width: 420px; max-width: calc(100% - 40px); min-width: 0; margin: 8vh auto; background: var(--paopao-surface); border: 0; border-radius: 8px; box-shadow: 0 12px 50px #20293810; overflow: visible; }
body.login #header.paopao-topbar { width: 100%; margin: 0; padding: 24px 28px 0; height: 80px; box-shadow: none; border-radius: 8px 8px 0 0; }
body.login .paopao-brand { padding: 0; min-height: 0; height: auto; font-size: 20px; }
body.login #main { margin-left: 0; }
body.login #content { padding: 28px; }
body.login .admin-page-heading { margin-bottom: 20px; }
body.login .admin-page-heading h1 { font-size: 22px; }
body.login .form-row { padding: 0 0 20px; }
body.login .form-row label { padding: 0 0 8px; }
body.login #login-form .submit-row { padding: 4px 0 0; box-shadow: none; }
body.login #login-form .submit-row input { width: 100%; height: 44px; }
body.login #footer { padding: 0; }
body.popup #header, body.popup #main, body.popup div.breadcrumbs { margin-left: 0; }
html[data-theme="dark"] :is(.admin-nav-item, .stat-icon, .task-icon, .shortcut-icon, .site-link, .account-dropdown, .text-link, .task-row, .dashboard-shortcuts, .mobile-navigation) img { filter: invert(.85); }
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] :is(.admin-nav-item, .stat-icon, .task-icon, .shortcut-icon, .site-link, .account-dropdown, .text-link, .task-row, .dashboard-shortcuts, .mobile-navigation) img { filter: invert(.85); }
}
@media (min-width: 1600px) {
  #content { max-width: 1680px; margin: 0 auto; padding: 40px; }
}
@media (max-width: 1200px) {
  :root { --paopao-sidebar: 204px; }
  #content { padding: 24px; }
  .overview-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .overview-columns { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  #changelist-filter { flex-basis: 180px; width: 180px; }
  .dashboard-shortcuts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dashboard-shortcuts a { flex-wrap: wrap; }
}
@media (max-width: 900px) {
  .paopao-sidebar { display: none; }
  #header.paopao-topbar { margin-left: 0; width: 100%; padding: 0 20px; height: 64px; min-height: 64px; position: relative; z-index: 50; }
  body:not(.popup) #main, div.breadcrumbs { margin-left: 0; }
  div.breadcrumbs { padding: 16px 24px 0; }
  .mobile-navigation { display: block; }
  .mobile-navigation summary { display: flex; align-items: center; justify-content: center; height: 40px; width: 40px; list-style: none; cursor: pointer; }
  .mobile-navigation summary::-webkit-details-marker { display: none; }
  .mobile-navigation summary img { height: 22px; width: 22px; }
  .mobile-navigation-content { position: absolute; top: 64px; left: 0; width: 256px; max-height: calc(100dvh - 64px); overflow-y: auto; background: var(--paopao-surface); box-shadow: 4px 8px 24px #0002; }
  .topbar-actions { gap: 10px; }
  .account-dropdown summary > span:not(.admin-avatar) { display: none; }
  .object-tools { margin-top: 0; }
  #changelist { gap: 16px; }
}
@media (max-width: 600px) {
  #content { padding: 20px 16px; }
  #header.paopao-topbar { padding: 0 12px; gap: 8px; }
  .topbar-actions { gap: 4px; }
  .site-link { font-size: 12px; }
  .topbar-label { font-size: 13px; }
  .overview-stats { gap: 12px; }
  .overview-stat { padding: 16px; }
  .stat-top { font-size: 12px; align-items: flex-start; gap: 4px; }
  .stat-icon { width: 28px; height: 28px; }
  .stat-icon img { width: 16px; height: 16px; }
  .overview-stat > strong { font-size: 23px; }
  .operations-section { padding: 18px 16px; }
  .admin-page-heading h1 { font-size: 22px; }
  .admin-page-heading { margin-bottom: 24px; }
  .dashboard-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-shortcuts a { flex-wrap: nowrap; }
  #changelist { flex-direction: column-reverse; }
  #changelist-filter { width: 100%; flex-basis: auto; }
  #changelist-filter h2 { padding: 14px 16px; }
  #changelist-filter details { display: inline-block; padding: 8px 16px; vertical-align: top; min-width: 140px; }
  #changelist .actions, #toolbar { padding: 16px; }
  #toolbar form input[type="text"] { width: 180px; flex: 1; }
  .aligned label { width: 100%; margin-bottom: 8px; }
  .form-row { padding: 16px; }
  .aligned .form-row .help { margin-left: 0; padding-left: 0; }
  .form-row input, .form-row textarea, .form-row select { max-width: 100%; }
  .form-row .flex-container { display: block; }
  .form-row .flex-container > div { width: 100%; }
  .form-row input.vURLField, .form-row input.vTextField, .form-row textarea { width: 100%; }
  .submit-row { padding: 16px; }
  .admin-form-surface { padding: 20px; }
  ul.messagelist li { margin: 16px 16px 0; }
  .orders-chart { gap: 8px; }
  .chart-label { font-size: 12px; }
}
.review-channel { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.review-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.review-documents { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 16px; margin: 24px 0; }
.review-documents img { display: block; width: 100%; max-height: 320px; object-fit: contain; border-radius: 8px; background: var(--body-bg); }