/* 运营平台沿用业务站点的品牌、主题和基础控件。 */
:root {
  --bg:#f5f7fc; --surface:#fff; --surface-2:#f7f9fe;
  --text:#0e1729; --text-2:#5c6b85; --line:#e2e8f3; --line-2:#ccd7e9;
  --accent:#4f46e5; --accent-soft:#edefff; --accent-ink:#3730a3;
  --error:#b42318; --success:#176345; --warning:#815500;
  --action-bg:#4f46e5; --accent-hover:#4338ca;
  --radius:12px; --control-radius:10px; --panel-space:22px; --section-gap:24px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
}
*,*::before,*::after { box-sizing:border-box; }
[hidden] { display:none!important; }
html { font-family:var(--font); color:var(--text); background:var(--bg); -webkit-text-size-adjust:100%; }
body { margin:0; min-width:320px; font-size:14px; line-height:1.6; -webkit-font-smoothing:antialiased; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
a { color:var(--accent-ink); text-underline-offset:3px; }
h1,h2,h3,p { margin:0; }
h1 { font-size:26px; line-height:1.35; letter-spacing:-.02em; }
h2 { font-size:17px; line-height:1.5; }
h3 { font-size:15px; line-height:1.5; }
p { max-width:75ch; }
svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none; }
input,textarea { caret-color:var(--accent); }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
::selection { background:var(--accent-soft); color:var(--accent-ink); }
h1:focus { outline:none; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.skip-link { position:fixed; left:16px; top:-80px; z-index:100; padding:10px 14px; border-radius:var(--control-radius); background:var(--surface); }
.skip-link:focus { top:8px; }
.muted { color:var(--text-2); }
.small { font-size:13px; }
.mono { font-family:ui-monospace,monospace; font-size:12px; overflow-wrap:anywhere; }
.numeric { font-variant-numeric:tabular-nums; }
.long-text { white-space:pre-wrap; overflow-wrap:anywhere; }
.spacer { flex:1; }

/* 框架与导航始终对齐，不随内容长度拉伸。 */
.site-header { position:sticky; top:0; z-index:30; height:64px; padding:0 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); background:var(--surface); }
.brand { display:flex; align-items:center; gap:10px; color:var(--text); text-decoration:none; white-space:nowrap; font-size:15px; }
.brand-mark { display:grid; place-items:center; width:32px; height:32px; background:var(--accent-soft); color:var(--accent); border-radius:10px; }
.brand-caption { color:var(--text-2); font-size:13px; margin-left:12px; }
.header-tools { display:flex; align-items:center; gap:8px; min-width:0; }
#admin-name { display:block; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:24px; }
.theme-toggle { display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid var(--line); border-radius:var(--control-radius); background:var(--surface); color:var(--text-2); }
.theme-toggle:hover { color:var(--accent-ink); background:var(--surface-2); border-color:var(--line-2); }
.shell { display:grid; grid-template-columns:204px minmax(0,1fr); min-height:calc(100dvh - 64px); }
.sidebar { position:sticky; top:64px; align-self:start; height:calc(100dvh - 64px); display:flex; flex-direction:column; padding:24px 12px 16px; border-right:1px solid var(--line); background:var(--surface); }
.sidebar nav { display:flex; flex-direction:column; gap:6px; }
.sidebar nav a { display:flex; align-items:center; gap:11px; min-height:44px; padding:10px 13px; border-radius:var(--control-radius); color:var(--text-2); text-decoration:none; font-weight:600; }
.sidebar nav a:hover { background:var(--surface-2); color:var(--text); }
.sidebar nav a[aria-current="page"],#admin-name[aria-current="page"] { background:var(--accent-soft); color:var(--accent-ink); }
.sidebar-note { margin:auto 12px 16px; padding-top:32px; color:var(--text-2); font-size:12px; }
main#content { min-width:0; width:100%; padding:30px 32px 48px; outline:none; }
.page-view { min-width:0; width:100%; max-width:1360px; margin:0 auto; }
.page-head { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; }
.page-head>div { min-width:0; overflow-wrap:anywhere; }
.page-head p { margin-top:7px; color:var(--text-2); font-size:14px; }
.page-head>.button { flex:none; }
.back-link { display:inline-flex; align-items:center; min-height:36px; margin-bottom:10px; font-size:13px; text-decoration:none; }
.back-link:hover { text-decoration:underline; }
.page-tabs { display:flex; gap:24px; margin-bottom:22px; border-bottom:1px solid var(--line); }
.page-tabs a { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; color:var(--text-2); text-decoration:none; border-bottom:2px solid transparent; }
.page-tabs a[aria-current="page"] { color:var(--accent-ink); font-weight:650; border-bottom-color:var(--accent); }

/* 列表与详情共用分区，不在同一层级混用裸标题和嵌套卡片。 */
.panel,.list-panel { min-width:0; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); }
.panel { padding:var(--panel-space); }
.list-panel { overflow:hidden; }
.content-section,.section { margin-top:var(--section-gap); }
.section:empty { display:none; }
.section-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.section-head:last-child { margin-bottom:0; }
.section-body { display:flex; flex-direction:column; gap:18px; min-width:0; }
.section-body>:empty,.stack>:empty { display:none; }
.section-body>.table-wrap { border:0; border-radius:0; }
.section-body>.empty { border:0; padding:16px 0; min-height:64px; background:transparent; }
.summary-panel .form-actions { padding-top:18px; margin-top:18px; border-top:1px solid var(--line); }
.membership-summary { margin-bottom:var(--section-gap); }
.content-section h2[tabindex] { scroll-margin-top:88px; }
.details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 24px; margin:0; }
.details>div { min-width:0; }
.details dt { margin-bottom:5px; font-size:12px; color:var(--text-2); }
.details dd { margin:0; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.details .wide { grid-column:1/-1; }
.divider { border:0; border-top:1px solid var(--line); margin:24px 0; }
.privacy-note { margin-top:12px; font-size:12px; color:var(--text-2); }
.stack { display:flex; flex-direction:column; gap:18px; min-width:0; }
.stack>.button { align-self:flex-start; }
.inline,.form-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; min-width:0; }
.inline>.field { flex:1; min-width:180px; }
.task-page>.panel,.task-page>.section,.task-page>.content-section,.task-page>.task-recovery,.task-page>div:not(.page-head),.task-panel { max-width:880px; }
.task-page>.panel+.panel { margin-top:var(--section-gap); }
.task-panel>.section-head { margin-bottom:0; }

/* 表单、筛选与操作按钮使用同一套尺寸。 */
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.field { display:flex; flex-direction:column; gap:7px; min-width:0; }
.field label { font-size:13px; font-weight:650; }
.field label,.field small { overflow-wrap:anywhere; }
.field small { color:var(--text-2); font-size:12px; }
.field input,.field select,.field textarea { width:100%; min-width:0; min-height:44px; padding:9px 12px; border:1px solid var(--line-2); border-radius:var(--control-radius); background:var(--surface); color:var(--text); }
.field textarea { min-height:108px; resize:vertical; }
.field input[type="file"] { overflow:hidden; }
.field input::file-selector-button { margin-right:12px; border:0; padding:2px 8px; border-radius:4px; background:var(--surface-2); color:var(--text); cursor:pointer; }
.field input::placeholder,.field textarea::placeholder { color:var(--text-2); }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--accent); }
.field input[aria-invalid="true"],.field select[aria-invalid="true"],.field textarea[aria-invalid="true"] { border-color:var(--error); }
.field-error { font-size:12px; color:var(--error); }
.filters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px; margin:0; }
.filters .field { flex:1 1 180px; min-width:150px; }
.filters .compact { flex-grow:0; flex-basis:170px; }
.filters>.form-error { flex-basis:100%; }
.filters.gift-record-filters { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.gift-record-filters .field,.gift-record-filters .compact { min-width:0; }
.gift-record-filters>.button { align-self:end; }
.list-panel>.filters { padding:20px; border-bottom:1px solid var(--line); }
.list-panel>.form-error { margin:16px 20px; }
.filter-status,.filter-scope { max-width:none; margin:0; padding:12px 20px; color:var(--text-2); font-size:13px; }
.filter-scope { padding-top:0; border-bottom:1px solid var(--line); }
.list-feedback { padding:14px 20px; }
.list-feedback>.button { margin-top:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:9px 15px; border:1px solid transparent; border-radius:var(--control-radius); font-weight:650; font-size:14px; line-height:1.35; text-decoration:none; color:var(--text); background:var(--surface); overflow-wrap:anywhere; transition:background-color .16s,color .16s,border-color .16s; }
.button-primary { background:var(--action-bg); color:#fff; }
.button-primary:hover:not(:disabled) { background:var(--accent-hover); }
.button-outline { border-color:var(--line-2); }
.button-outline:hover:not(:disabled),.button-quiet:hover:not(:disabled) { background:var(--surface-2); }
.button-danger { border-color:var(--error); color:var(--error); }
.button-danger:hover:not(:disabled) { background:var(--surface-2); }
.button:active:not(:disabled) { transform:translateY(1px); }
button:disabled,input:disabled,select:disabled,textarea:disabled { cursor:not-allowed; opacity:.55; }
.text-button { min-height:44px; padding:8px 0; border:0; background:none; color:var(--accent-ink); text-align:left; text-decoration:underline; text-underline-offset:3px; }

/* 表格只在自身区域滚动，状态与空态保留明确文字。 */
.table-wrap { max-width:100%; overflow:auto; border:1px solid var(--line); border-radius:var(--control-radius); background:var(--surface); scrollbar-color:var(--line-2) var(--surface-2); scrollbar-width:thin; }
.table-wrap:focus-visible { outline-offset:-2px; }
.data-table { border-collapse:collapse; width:100%; text-align:left; font-size:13px; }
.data-table th,.data-table td { padding:13px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
.data-table th { font-weight:650; color:var(--text-2); background:var(--surface-2); white-space:nowrap; }
.data-table tr:last-child td { border-bottom:0; }
.data-table td { min-width:100px; max-width:420px; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.data-table td strong { display:block; font-weight:650; }
.data-table tr:hover td { background:var(--surface-2); }
.data-table td .button { min-height:40px; font-size:13px; padding:8px 12px; }
.row-title { min-width:160px; }
.row-title>a { font-weight:600; }
.row-title>p { margin-top:4px; }
.gift-mobile-summary { display:none; }
.record-identifiers summary { cursor:pointer; min-height:36px; padding:7px 0; color:var(--text-2); font-size:12px; }
.gift-ledger .identifier { white-space:normal; overflow-wrap:anywhere; }
.gift-ledger .row-title { width:180px; }
.pager { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:14px; }
.as-of { font-size:12px; color:var(--text-2); }
.list-panel .list-body>.table-wrap { border:0; border-radius:0; }
.list-body { min-width:0; width:100%; }
.list-body>.empty,.list-body>.loading { width:100%; max-width:none; }
.data-table .identifier,.data-table .no-wrap { white-space:nowrap; overflow-wrap:normal; }
.list-panel .list-body>.pager { margin:0; padding:14px 20px; border-top:1px solid var(--line); }
.empty,.loading { display:flex; align-items:center; min-height:112px; padding:24px; border:1px solid var(--line); border-radius:var(--control-radius); background:var(--surface); color:var(--text-2); }
.loading { background:var(--surface-2); }
.list-panel .list-body>.empty,.list-panel .list-body>.loading { border:0; border-radius:0; max-width:none; }
.status { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:650; color:var(--text-2); white-space:nowrap; }
.status.good { color:var(--success); }
.status.warn { color:var(--warning); }
.status.bad { color:var(--error); }

/* 确认与恢复信息保留在任务末尾，不与主表单争夺层级。 */
.form-error { max-width:none; padding:12px 14px; border:1px solid var(--error); border-radius:var(--control-radius); color:var(--error); overflow-wrap:anywhere; }
.notice { max-width:none; padding:13px 15px; border:1px solid var(--line-2); border-radius:var(--control-radius); background:var(--surface-2); font-size:14px; overflow-wrap:anywhere; }
.notice p+p { margin-top:7px; }
.notice.warning { color:var(--warning); }
.notice.success { color:var(--success); }
.confirmation { display:flex; gap:10px; align-items:flex-start; min-height:44px; font-size:14px; }
.confirmation input { margin:4px 0 0; width:18px; height:18px; flex:none; accent-color:var(--accent); }
.confirmation:has(input:focus-visible) { outline:2px solid var(--accent); outline-offset:4px; }
.confirmation-block { padding-top:16px; border-top:1px solid var(--line); }
.task-recovery,.disclosure { margin:20px 0 0; padding-top:6px; border-top:1px solid var(--line); }
.task-recovery summary,.disclosure summary { cursor:pointer; min-height:44px; padding:9px 0; color:var(--accent-ink); font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.task-recovery[open] summary,.disclosure[open] summary { margin-bottom:12px; }
.task-recovery>form+.form-error { margin-top:12px; }
.section-body>.disclosure:first-child { margin-top:0; padding-top:0; border-top:0; }
.operation-notice { padding:20px; }
.operation-notice>p { font-weight:600; }
.operation-notice>.inline:not(:empty) { margin-top:14px; }
.operation-notice>.inline:empty { display:none; }
.operation-notice>.form-error { margin-top:14px; font-weight:400; }
.operation-result { margin-top:18px; }
.operation-result>h3 { margin-bottom:18px; }
.operation-result:empty { display:none; }
.operation-result>p+a { display:inline-flex; margin-top:10px; }
.preview-list { list-style:none; margin:0; padding:0; }
.preview-list li { padding:14px 0; border-bottom:1px solid var(--line); }
.preview-list li:last-child { border:0; }
.file-slot { display:grid; grid-template-columns:minmax(160px,1fr) minmax(180px,1.4fr); gap:12px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line); }
.file-slot>div { min-width:0; overflow-wrap:anywhere; }
.file-slot .field { gap:4px; }

/* 登录与账号沿用同一表单语言。 */
.login-layout { display:grid; place-items:center; min-height:calc(100dvh - 64px); padding:40px 20px 72px; }
.login-panel { width:min(100%,440px); padding:32px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.login-panel>p { margin-top:12px; }
.login-panel form { margin:26px 0 22px; }
.login-panel .button { width:100%; }
.login-panel h1 { font-size:25px; }
.captcha-row { display:flex; align-items:center; gap:10px; min-width:0; }
.captcha-row input { min-width:0; flex:1; }
.captcha-refresh { display:grid; place-items:center; flex:0 0 160px; width:160px; height:56px; padding:0; border:1px solid var(--line-2); border-radius:var(--control-radius); background:var(--surface-2); color:var(--text-2); overflow:hidden; }
.captcha-refresh img { display:block; width:160px; height:56px; }
.captcha-refresh img[hidden] { display:none; }
.captcha-refresh:disabled { cursor:wait; }

@media(max-width:1100px) {
  main#content { padding:26px 24px 44px; }
  .shell { grid-template-columns:184px minmax(0,1fr); }
  .details { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .brand-caption { display:none; }
  .filters .compact { flex-grow:1; }
  .filters.gift-record-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  :root { --panel-space:18px; --section-gap:20px; }
  .site-header { padding:0 16px; gap:12px; }
  .brand { font-size:14px; }
  .header-tools { gap:4px; }
  #admin-name { max-width:104px; padding:9px 10px; }
  .shell { display:block; }
  .sidebar { position:static; height:auto; padding:8px 12px; border-right:0; border-bottom:1px solid var(--line); }
  .sidebar nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
  .sidebar nav a { flex-direction:column; justify-content:center; gap:4px; min-height:60px; padding:7px 2px; font-size:12px; }
  .sidebar nav svg { width:18px; height:18px; }
  .sidebar-note,.sidebar>#logout { display:none; }
  main#content { padding:22px 16px 36px; }
  h1 { font-size:23px; }
  h2 { font-size:16px; }
  .page-head { align-items:flex-start; gap:14px; margin-bottom:20px; flex-wrap:wrap; }
  .page-head p { font-size:13px; }
  .page-head>.button { min-height:44px; }
  .section-head { margin-bottom:16px; }
  .form-grid { grid-template-columns:1fr; gap:16px; }
  .field input,.field select,.field textarea { font-size:16px; }
  .filters { gap:12px; }
  .filters .field,.filters .compact { min-width:130px; flex:1 1 130px; }
  .list-panel>.filters { padding:16px; }
  .list-panel>.form-error { margin:14px 16px; }
  .filter-status,.filter-scope { padding-inline:16px; }
  .gift-ledger .row-title { width:258px; min-width:0; }
  .gift-mobile-summary { display:block; margin-top:10px; font-size:14px; }
  .gift-mobile-summary strong { margin-bottom:4px; }
  .gift-ledger th:nth-child(2),.gift-ledger td:nth-child(2),.gift-ledger th:nth-child(3),.gift-ledger td:nth-child(3) { display:none; }
  .filters>.button { flex:1 1 100%; }
  .filters.gift-record-filters { grid-template-columns:1fr; }
  .details { gap:17px 18px; }
  .details dd { font-size:14px; }
  .pager { flex-wrap:wrap; align-items:flex-start; }
  .list-panel .list-body>.pager { padding:14px 16px; }
  .pager>.inline { width:100%; }
  .pager .button { flex:1; }
  .data-table th,.data-table td { padding:12px; }
  .data-table td .button { min-height:44px; }
  .empty,.loading { padding:22px 16px; min-height:100px; }
  .file-slot { grid-template-columns:1fr; gap:8px; }
  .operation-notice { padding:16px; }
  .login-layout { padding:28px 16px 48px; }
  .login-panel { padding:26px; }
}
@media(max-width:430px) {
  .details { grid-template-columns:1fr; }
  .site-header { gap:8px; }
  #admin-name { max-width:90px; }
  .form-actions { align-items:stretch; }
  .form-actions>.button { flex:1 1 auto; }
  .inline>.field { min-width:0; flex-basis:100%; }
  .captcha-row { align-items:stretch; flex-direction:column; }
  .captcha-refresh { width:100%; flex-basis:56px; }
}
@media(prefers-reduced-motion:reduce) {
  * { transition:none!important; scroll-behavior:auto!important; }
}
