:root {
    --bg: #f5f7fb;
    --panel: #ffffff;
    --text: #172033;
    --muted: #667085;
    --line: #e5eaf2;
    --blue: #2f7df6;
    --blue-soft: #e8f2ff;
    --danger: #ef4444;
    --green: #13a86b;
    --shadow: 0 10px 28px rgba(15, 23, 42, .06);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
    margin: 0;
    min-height: 100vh;
    background: var(--bg);
    color: var(--text);
    font-family: Inter, "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button, input, select {
    font: inherit;
}

button {
    cursor: pointer;
}

.admin-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    min-height: 100vh;
}

.admin-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    background: #fff;
    border-right: 1px solid var(--line);
    padding: 18px 16px;
    display: flex;
    flex-direction: column;
}

.brand {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
    padding: 6px 4px 20px;
}

.brand img {
    display: block;
    width: 118px;
    height: 78px;
    object-fit: contain;
    object-position: left center;
}

/* 商单报名审核与完整资料字段，复用管理端现有颜色和卡片体系。 */
.merchant-application-list { display: grid; gap: 12px; }
.merchant-application-item {
    display: grid;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--panel-soft, var(--panel));
    padding: 14px;
}
.merchant-application-item.applied { border-color: color-mix(in srgb, var(--blue) 30%, var(--line)); }
.merchant-application-item > header,
.merchant-application-item > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.merchant-application-item > header > div { display: grid; gap: 4px; }
.merchant-application-item > header strong { font-size: 13px; }
.merchant-application-item > header span,
.merchant-application-item > small { color: var(--muted); font-size: 11px; }
.merchant-application-item > p { color: var(--text-soft, var(--text)); font-size: 12px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.merchant-application-portfolio { display: grid; gap: 6px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.merchant-application-portfolio > span,
.merchant-application-empty { color: var(--muted); font-size: 11px; }
.merchant-application-portfolio a { color: var(--blue); font-size: 12px; text-decoration: none; overflow-wrap: anywhere; }
.merchant-application-item > footer { justify-content: flex-end; border-top: 1px solid var(--line); padding-top: 12px; }
.merchant-application-item > footer button { min-height: 36px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); color: var(--text); padding: 0 13px; font-size: 11px; font-weight: 800; }
.merchant-application-item > footer button.primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.merchant-application-item > footer button.danger { color: var(--danger); }
#merchantReviewSettlementWrap { display: grid; gap: 7px; }
#merchantReviewSettlementWrap[hidden] { display: none; }
#merchantReviewSettlementWrap small { color: var(--muted); font-size: 11px; font-weight: 500; }

@media (max-width: 720px) {
    .merchant-application-item > header,
    .merchant-application-item > footer { align-items: stretch; flex-direction: column; }
    .merchant-application-item > footer button { width: 100%; }
}

.membership-confirm-button {
    border: 1px solid #b8d0ff;
    border-radius: 8px;
    background: #edf4ff;
    color: #1769df;
    padding: 8px 12px;
    font: inherit;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.membership-confirm-button:hover { background: #deebff; }
.membership-confirm-button:focus-visible { outline: 2px solid #2f80ed; outline-offset: 2px; }
.membership-confirm-button:disabled { cursor: wait; opacity: .62; }

.brand span {
    display: block;
    padding-left: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
}

.admin-nav {
    display: grid;
    flex: 1 1 auto;
    min-height: 0;
    align-content: start;
    gap: 4px;
    overflow: auto;
    padding-right: 2px;
}

.nav-section {
    grid-column: 1 / -1;
    margin: 10px 10px 2px;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 900;
}

.nav-section:first-child {
    margin-top: 4px;
}

.admin-nav button {
    height: 40px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #526071;
    padding: 0 14px;
    text-align: left;
    font-weight: 700;
}

.tool-view {
    height: calc(100vh - 112px);
    min-height: 620px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.tool-view iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    background: #fff;
}

.admin-nav button.active {
    background: var(--blue-soft);
    color: var(--blue);
    box-shadow: inset 3px 0 0 var(--blue);
}

.sidebar-foot {
    margin-top: auto;
    border-top: 1px solid var(--line);
    padding: 16px 10px 4px;
}

.sidebar-foot a {
    color: var(--muted);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
}

.admin-main {
    min-width: 0;
    padding: 24px;
}

.admin-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 24px;
}

.merchant-ops-active .admin-header { display: none; }
.merchant-ops-active .admin-main { padding-top: 10px; }

h1, h2, p {
    margin: 0;
}

h1 {
    font-size: 26px;
    letter-spacing: 0;
}

h2 {
    font-size: 18px;
}

p {
    color: var(--muted);
    margin-top: 6px;
    font-size: 14px;
}

.header-actions {
    display: flex;
    gap: 10px;
}

.header-actions button,
.panel-head button,
.upload-form button,
.submit {
    min-height: 38px;
    border: 0;
    border-radius: 8px;
    background: var(--blue);
    color: #fff;
    padding: 0 16px;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(47, 125, 246, .18);
}

.text-btn {
    background: transparent !important;
    color: var(--blue) !important;
    box-shadow: none !important;
    padding: 0 8px !important;
}

.view {
    display: none;
}

.view.active {
    display: block;
}

.metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card,
.panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.summary-card {
    min-height: 120px;
    padding: 22px;
    position: relative;
    overflow: hidden;
}

.summary-card::after {
    content: "";
    position: absolute;
    right: 22px;
    top: 26px;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--blue-soft);
}

.summary-card strong {
    display: block;
    font-size: 30px;
    margin-top: 8px;
}

.summary-card span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.split-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, .8fr);
    gap: 18px;
}

.panel {
    margin-bottom: 18px;
    overflow: hidden;
}

.panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--line);
}

.filter-row {
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
}

.order-filter,
.recharge-filter,
.project-filter {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.filter-row input,
.filter-row select,
.upload-form input,
.modal-card input,
.modal-card select {
    height: 42px;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    padding: 0 12px;
    outline: none;
}

.filter-row input {
    width: min(460px, 100%);
}

.order-filter input,
.recharge-filter input,
.project-filter input {
    width: min(340px, 100%);
}

.order-filter select,
.recharge-filter select,
.project-filter select {
    width: 150px;
}

.project-filter select {
    width: 160px;
}

.project-deadline-summary {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    min-height: 58px;
    padding: 12px 18px;
    border-bottom: 1px solid var(--line);
    background: #fbfdff;
    color: #55657a;
    font-size: 13px;
}

.deadline-reminder {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #dbe4ef;
    border-radius: 999px;
    background: #fff;
    padding: 6px 10px;
    font-weight: 800;
}

.deadline-reminder.overdue,
.deadline-tag.overdue {
    border-color: #fecaca;
    background: #fef2f2;
    color: #b91c1c;
}

.deadline-reminder.today,
.deadline-tag.today {
    border-color: #fed7aa;
    background: #fff7ed;
    color: #c2410c;
}

.deadline-reminder.soon,
.deadline-tag.soon {
    border-color: #fde68a;
    background: #fffbeb;
    color: #a16207;
}

.deadline-tag {
    display: inline-flex;
    margin-top: 5px;
    border: 1px solid #dbe4ef;
    border-radius: 999px;
    background: #f8fafc;
    color: #64748b;
    padding: 3px 7px;
    font-size: 11px;
    font-weight: 800;
}

tr.project-row-overdue td:first-child {
    box-shadow: inset 3px 0 0 #dc2626;
}

.order-filter button {
    height: 42px;
    border: 0;
    border-radius: 8px;
    background: var(--text);
    color: #fff;
    padding: 0 18px;
    font-weight: 800;
}

.upload-form {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 24px;
    flex-wrap: wrap;
}

.upload-form input {
    min-width: min(420px, 100%);
    padding-top: 8px;
}

#assetUploadMessage {
    color: var(--muted);
    font-size: 13px;
}

.asset-summary {
    padding: 0 24px 22px;
    color: var(--muted);
    font-size: 13px;
}

.table-wrap {
    overflow: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
    min-width: 860px;
}

th, td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    font-size: 14px;
    vertical-align: middle;
}

th {
    background: #f8fafc;
    color: #55657a;
    font-size: 12px;
    font-weight: 800;
}

.tag {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 9px;
    background: #eef2f7;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
}

.tag.admin {
    background: #111827;
    color: white;
}

.tag.disabled {
    background: #fee2e2;
    color: #991b1b;
}

.tag.paid {
    background: #dcfce7;
    color: #166534;
}

.tag.pending {
    background: #fff7ed;
    color: #9a3412;
}

.tag.open {
    background: #ecfdf3;
    color: #027a48;
}

.tag.claimed {
    background: #e8f2ff;
    color: var(--blue);
}

.tag.submitted {
    background: #fff7ed;
    color: #c2410c;
}

.tag.changes_requested,
.tag.payout_failed {
    background: #fef2f2;
    color: #b42318;
}

.tag.accepted,
.tag.payout_pending,
.tag.payout_processing {
    background: #eef2ff;
    color: #4338ca;
}

.tag.paid,
.tag.settled {
    background: #ecfdf3;
    color: #067647;
}

.tag.closed {
    background: #f2f4f7;
    color: #667085;
}

.tag.draft {
    background: #fff7ed;
    color: #b45309;
}

.tag.member {
    background: #dcfce7;
    color: #166534;
}

.tag.employee {
    background: #e8f2ff;
    color: #245caa;
}

.tag.external {
    background: #f2f4f7;
    color: #475467;
}

.tag.free {
    background: #f2f4f7;
    color: #667085;
}

.membership-expiry {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    font-weight: 500;
    color: #98a2b3;
    white-space: nowrap;
}

.recharge-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    padding: 18px 18px 4px;
}

.recharge-stat {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fbfdff;
    padding: 14px;
}

.recharge-stat span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.recharge-stat strong {
    display: block;
    margin-top: 6px;
    font-size: 22px;
}

.referral-admin-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.panel-head .referral-admin-actions .secondary {
    border: 1px solid var(--line);
    background: var(--panel);
    color: var(--text);
    box-shadow: none;
}

.referral-admin-message {
    min-height: 20px;
    margin: 0;
    padding: 10px 20px 0;
    color: var(--green);
    font-size: 13px;
}

.referral-admin-message:empty { display: none; }
.referral-admin-message.is-error { color: var(--danger); }

.referral-registration-code-panel {
    margin: 0 18px 16px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fbff;
    overflow: hidden;
}

.referral-registration-code-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px 12px;
}

.referral-registration-code-head h3 { margin: 0; font-size: 16px; }
.referral-registration-code-head p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.referral-registration-code-head button { flex: 0 0 auto; }
.referral-registration-code-summary { padding: 0 18px 12px; color: var(--muted); font-size: 12px; font-weight: 800; }
.referral-registration-code-table { border-top: 1px solid var(--line); }
.referral-registration-code-table table { min-width: 780px; }
.referral-registration-code-table code { color: var(--text); font-size: 13px; font-weight: 800; }
.referral-registration-code-copy {
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--panel);
    color: var(--text);
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 700;
}

.referral-admin-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.referral-admin-filter select { min-width: 190px; }
.referral-withdrawal-summary { align-self: center; color: var(--muted); font-size: 12px; font-weight: 800; }

.referral-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 18px 12px;
}

.referral-section-head-padded { padding: 20px 24px 14px; }
.referral-conversion-admin-head { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 22px; }
.referral-section-head h3 { margin: 0; font-size: 16px; }
.referral-section-head p { margin: 4px 0 0; font-size: 12px; }
.referral-section-head > span { color: var(--muted); font-size: 12px; font-weight: 800; white-space: nowrap; }
.referral-table-wrap table { min-width: 1000px; }
.referral-table-wrap code { color: var(--text); font-size: 12px; overflow-wrap: anywhere; }
.referral-error { max-width: 340px; color: var(--danger); font-size: 12px; line-height: 1.55; }

.referral-pager {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 18px 18px;
    color: var(--muted);
    font-size: 13px;
}

.referral-pager button {
    min-height: 34px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    color: var(--text);
    padding: 0 12px;
    font-weight: 700;
}

.referral-pager button:disabled { cursor: not-allowed; opacity: .45; }

.referral-pending-orders {
    margin: 0 18px 16px;
    border: 1px solid #fed7aa;
    border-radius: 10px;
    background: #fffaf3;
}

.referral-pending-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid #fed7aa;
    color: #9a3412;
    font-size: 13px;
}

.referral-pending-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.referral-pending-list article { min-width: 0; padding: 13px 14px; border-right: 1px solid #ffedd5; border-bottom: 1px solid #ffedd5; }
.referral-pending-list article > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.referral-pending-list code { color: var(--text); font-size: 11px; overflow-wrap: anywhere; }
.referral-pending-list p { margin: 7px 0 0; font-size: 12px; }
.referral-pending-list small { display: block; margin-top: 5px; color: var(--danger); overflow-wrap: anywhere; }
.referral-risk-flag { display: block; width: fit-content; margin: 3px 0; border: 1px solid #fed7aa; border-radius: 999px; background: #fff7ed; color: #9a3412; padding: 3px 7px; font-size: 11px; font-weight: 700; }
.referral-withdrawal-risk { background: #fffdf8; }
.referral-withdrawal-actions { min-width: 150px; }
.referral-withdrawal-actions button { border: 1px solid var(--line); border-radius: 7px; background: var(--panel); color: var(--text); padding: 7px 9px; font-size: 12px; font-weight: 700; }
.referral-withdrawal-actions button.primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.referral-withdrawal-actions button.danger { border-color: #fecaca; background: #fff5f5; color: #b42318; }

.pay-method {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 5px 9px;
    background: #eef2ff;
    color: #3730a3;
    font-size: 12px;
    font-weight: 900;
}

.pay-method.wechat {
    background: #ecfdf3;
    color: #067647;
}

.row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.row-actions button {
    height: 32px;
    border: 1px solid #d8e0ec;
    border-radius: 7px;
    background: #fff;
    color: var(--text);
    padding: 0 10px;
    font-weight: 800;
}

.row-actions button.danger {
    border-color: #fecaca;
    color: var(--danger);
}

.row-actions button:disabled {
    cursor: not-allowed;
    border-color: #e4e7ec;
    background: #f8fafc;
    color: #98a2b3;
    box-shadow: none;
}

.merchant-ops-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    overflow: hidden;
    border: 1px solid #dce7f7;
    border-radius: 16px;
    background:
        radial-gradient(circle at 80% 20%, rgba(47, 125, 246, .14), transparent 34%),
        linear-gradient(135deg, #fff 0%, #f6f9ff 65%, #eef5ff 100%);
    padding: 24px 26px;
    box-shadow: var(--shadow);
}

.merchant-ops-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -42px;
    bottom: -76px;
    width: 210px;
    height: 210px;
    border: 1px solid rgba(47, 125, 246, .12);
    border-radius: 50%;
    box-shadow: 0 0 0 28px rgba(47, 125, 246, .035), 0 0 0 56px rgba(47, 125, 246, .025);
}

.merchant-ops-intro { min-width: 0; }
.merchant-ops-eyebrow {
    display: block;
    margin-bottom: 7px;
    color: var(--blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
}
.merchant-ops-intro h2 { font-size: 23px; letter-spacing: -.02em; }
.merchant-ops-intro p { max-width: 720px; line-height: 1.7; }

.merchant-ops-guard {
    min-width: 250px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(47, 125, 246, .18);
    border-radius: 12px;
    background: rgba(255, 255, 255, .72);
    padding: 12px 14px;
    backdrop-filter: blur(8px);
}
.merchant-ops-guard svg { width: 20px; height: 20px; color: var(--blue); }
.merchant-ops-guard strong,
.merchant-ops-guard span { display: block; }
.merchant-ops-guard strong { font-size: 13px; }
.merchant-ops-guard span { margin-top: 3px; color: var(--muted); font-size: 11px; }

.merchant-primary-action {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 9px;
    background: var(--blue);
    color: #fff;
    padding: 0 18px;
    font-weight: 850;
    box-shadow: 0 10px 22px rgba(47, 125, 246, .22);
}
.merchant-primary-action svg { width: 16px; height: 16px; }

.merchant-hero-actions {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.tag.agent { color:#65d8ff; border-color:rgba(72,190,235,.45); background:rgba(45,145,190,.12); }
.agent-admin-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px;border:1px solid #26354b;border-radius:20px;background:radial-gradient(circle at 83% 20%,rgba(43,145,218,.2),transparent 36%),linear-gradient(135deg,#121b29,#0c1119);margin-bottom:16px}.agent-admin-hero>div:first-child>span{color:#59d8ff;font-size:11px;letter-spacing:.2em;font-weight:800}.agent-admin-hero h2{font-size:30px;margin:8px 0}.agent-admin-hero p{margin:0;color:#8f9bae}.agent-admin-security{max-width:360px;padding:15px 18px;border:1px solid #2f5168;border-radius:14px;background:rgba(20,45,63,.45)}.agent-admin-security strong,.agent-admin-security small{display:block}.agent-admin-security small{color:#91a6b8;margin-top:5px;line-height:1.5}.agent-admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.agent-admin-stats article{padding:18px;border:1px solid var(--border-color,#26303f);border-radius:15px;background:var(--panel,#12161d)}.agent-admin-stats span{display:block;color:#8794a8;font-size:12px}.agent-admin-stats strong{display:block;font-size:26px;margin-top:8px}.agent-application-list,.agent-admin-list{display:grid;gap:12px}.agent-application-item{display:flex;justify-content:space-between;gap:20px;padding:16px;border:1px solid #273344;border-radius:14px;background:#111821}.agent-application-item strong,.agent-application-item small{display:block}.agent-application-item small{color:#8290a4;margin-top:4px}.agent-application-item p{margin:10px 0 0;color:#aab4c3}.agent-admin-list{grid-template-columns:repeat(2,minmax(0,1fr))}.agent-admin-card{border:1px solid #27364b;border-radius:17px;padding:18px;background:linear-gradient(145deg,#131c29,#0e141d)}.agent-admin-card-head,.agent-admin-card-head>div{display:flex;align-items:center;justify-content:space-between;gap:11px}.agent-admin-card-head>div{justify-content:flex-start}.agent-admin-card-head strong,.agent-admin-card-head small{display:block}.agent-admin-card-head small{color:#8290a5;margin-top:3px}.agent-admin-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#14314a;color:#65d8ff;font-weight:800}.agent-admin-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:16px 0}.agent-admin-metrics span{padding:10px;border:1px solid #243144;border-radius:10px;color:#8290a4;font-size:11px}.agent-admin-metrics strong{display:block;color:#f3f7ff;font-size:16px;margin-top:5px}.agent-api-summary{display:flex;flex-wrap:wrap;gap:6px;min-height:28px}.agent-api-form{display:grid;grid-template-columns:.8fr 1.5fr auto;gap:8px;margin-top:13px}.agent-api-form select,.agent-api-form input{min-width:0;background:#0b1119;border:1px solid #2a3749;color:#f4f7fc;border-radius:9px;padding:9px}.agent-api-form button{border:0;border-radius:9px;background:#55caef;color:#07111a;font-weight:700;padding:9px 12px}@media(max-width:1050px){.agent-admin-list{grid-template-columns:1fr}.agent-admin-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.agent-admin-hero{align-items:flex-start;flex-direction:column}.agent-admin-stats{grid-template-columns:1fr}.agent-api-form{grid-template-columns:1fr}.agent-admin-metrics{grid-template-columns:repeat(2,1fr)}}

.credit-management-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 16px;
    padding: 26px 28px;
    border: 1px solid #cfe2ff;
    border-radius: 16px;
    background:
        radial-gradient(circle at 86% 10%, rgba(47, 125, 246, .17), transparent 32%),
        linear-gradient(135deg, #f7fbff 0%, #eef6ff 100%);
    box-shadow: 0 16px 38px rgba(34, 84, 150, .09);
}

.credit-management-kicker,
.credit-adjust-kicker {
    display: block;
    margin-bottom: 8px;
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .16em;
}

.credit-management-hero h2 { font-size: 25px; }
.credit-management-hero p { max-width: 660px; }

.admin-credit-bypass-badge {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 280px;
    border: 1px solid rgba(47, 125, 246, .24);
    border-radius: 13px;
    background: rgba(255, 255, 255, .82);
    padding: 14px 16px;
}

.admin-credit-bypass-badge > i {
    width: 24px;
    height: 24px;
    color: var(--blue);
}

.admin-credit-bypass-badge span { display: grid; gap: 3px; }
.admin-credit-bypass-badge strong { font-size: 14px; }
.admin-credit-bypass-badge small { color: var(--muted); font-size: 12px; }

.credit-management-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.credit-management-stats article {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel);
    padding: 18px 20px;
    box-shadow: var(--shadow);
}

.credit-management-stats span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.credit-management-stats strong {
    display: block;
    margin-top: 7px;
    font-size: 24px;
}

.credit-management-filter { display: flex; align-items: center; gap: 12px; }
.credit-management-message { color: var(--muted); font-size: 13px; font-weight: 800; }
.credit-management-message.success { color: #047857; }
.credit-management-message.error { color: var(--danger); }
.credit-user-table { min-width: 760px; }
.credit-ledger-table { min-width: 920px; }

.credit-balance-value {
    color: #0f3f75;
    font-size: 16px;
}

.credit-balance-value small { color: var(--muted); font-size: 11px; }
.credit-adjust-trigger { border-color: #a9ccff !important; color: var(--blue) !important; }
.credit-ledger-username { display: block; margin-top: 3px; color: var(--muted); }
.credit-ledger-description { max-width: 420px; color: #475569; }
.credit-delta { font-size: 15px; }
.credit-delta.positive { color: #047857; }
.credit-delta.negative { color: #c2410c; }

.credit-adjust-card { width: min(470px, calc(100vw - 32px)); }

.credit-adjust-user {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    border: 1px solid #dbeafe;
    border-radius: 11px;
    background: #f7fbff;
    padding: 13px;
}

.credit-adjust-user > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 11px;
    background: linear-gradient(135deg, #2f7df6, #72afff);
    color: #fff;
    font-weight: 900;
}

.credit-adjust-user div { display: grid; gap: 3px; }
.credit-adjust-user small { color: var(--muted); }

.credit-adjust-preview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    border-radius: 10px;
    background: #eff6ff;
    padding: 13px 14px;
    color: #315273;
    font-size: 13px;
    font-weight: 800;
}

.credit-adjust-preview strong { color: #0f3f75; font-size: 17px; }
.credit-adjust-preview strong.is-invalid { color: var(--danger); }

.membership-edit-card {
    width: min(720px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    overflow: auto;
}

.membership-edit-head { padding-right: 36px; }
.membership-edit-head h2 { margin: 0; }
.membership-edit-head p { margin: 7px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }

.membership-edit-user {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
}

.membership-edit-user > span {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 10px;
    background: var(--blue-soft);
    color: var(--blue);
    font-weight: 900;
}

.membership-edit-user div { display: grid; gap: 3px; }
.membership-edit-user small { color: var(--muted); }

.membership-current-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
}

.membership-current-grid > div {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #f8fafc;
    padding: 12px;
}

.membership-current-grid span { display: block; color: var(--muted); font-size: 11px; font-weight: 700; }
.membership-current-grid strong { display: block; margin-top: 5px; overflow-wrap: anywhere; font-size: 13px; line-height: 1.45; }

.membership-edit-lock {
    margin-top: 16px;
    border: 1px solid #bfdbfe;
    border-radius: 9px;
    background: #eff6ff;
    color: #1d4f91;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.6;
}

.membership-edit-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.membership-edit-form-grid label small {
    min-height: 34px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.5;
}

.membership-duration-button {
    margin-top: 9px;
    border: 1px solid #c7daf5;
    border-radius: 8px;
    background: #f5f9ff;
    color: #245caa;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 800;
}

.membership-duration-button:hover { background: #eaf3ff; }
.membership-duration-button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

.membership-edit-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
}

.membership-edit-actions > div { display: flex; gap: 8px; }
.membership-edit-actions button {
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    padding: 0 14px;
    font-weight: 800;
}
.membership-edit-actions button.primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.membership-edit-actions button.danger { border-color: #fecaca; background: #fff7f7; color: var(--danger); }
.membership-edit-actions button:hover:not(:disabled) { filter: brightness(.98); }
.membership-edit-actions button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.membership-edit-actions button:disabled { cursor: not-allowed; opacity: .55; }

.membership-audit-section { margin-top: 22px; border-top: 1px solid var(--line); padding-top: 18px; }
.membership-audit-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.membership-audit-head h3 { margin: 0; font-size: 14px; }
.membership-audit-head span { color: var(--muted); font-size: 11px; }
.membership-audit-list { display: grid; gap: 8px; margin-top: 10px; }
.membership-audit-item { border-bottom: 1px solid var(--line); padding: 9px 2px 11px; }
.membership-audit-item:last-child { border-bottom: 0; }
.membership-audit-item-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.membership-audit-item-head strong { font-size: 13px; }
.membership-audit-item-head time { color: var(--muted); font-size: 11px; }
.membership-audit-item p { margin: 5px 0 0; color: var(--text); font-size: 12px; line-height: 1.55; }
.membership-audit-item small { display: block; margin-top: 4px; color: var(--muted); line-height: 1.5; }

@media (max-width: 640px) {
    .membership-current-grid,
    .membership-edit-form-grid { grid-template-columns: 1fr; }
    .membership-edit-actions { align-items: stretch; flex-direction: column-reverse; }
    .membership-edit-actions > div { display: grid; grid-template-columns: 1fr 1fr; }
    .membership-edit-actions > .danger { width: 100%; }
}

.merchant-service-action {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #d5e1f2;
    border-radius: 9px;
    background: rgba(255, 255, 255, .86);
    color: #334155;
    padding: 0 15px;
    font-weight: 850;
}
.merchant-service-action:hover { border-color: #a9c7f5; color: var(--blue); }
.merchant-service-action svg { width: 16px; height: 16px; color: var(--blue); }

.merchant-job-service-status {
    min-width: 205px;
    min-height: 60px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce7f7;
    border-radius: 11px;
    background: rgba(255, 255, 255, .84);
    padding: 9px 12px;
}
.merchant-job-service-status img,
.merchant-job-service-status .job-service-qr-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    border: 1px solid #dce3ed;
    border-radius: 7px;
    background: #fff;
    object-fit: cover;
}
.merchant-job-service-status .job-service-qr-icon {
    display: grid;
    place-items: center;
    color: #64748b;
}
.merchant-job-service-status .job-service-qr-icon svg { width: 23px; height: 23px; }
.merchant-job-service-status strong,
.merchant-job-service-status span { display: block; }
.merchant-job-service-status strong { font-size: 11px; }
.merchant-job-service-status span { margin-top: 3px; color: var(--green); font-size: 10px; font-weight: 800; }
.merchant-job-service-status span.unconfigured { color: #b45309; }

.merchant-channel-switch {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 200px));
    margin-top: 18px;
    border-bottom: 1px solid var(--line);
}
.merchant-channel-switch button {
    min-height: 48px;
    border: 1px solid #dce3ed;
    border-bottom: 2px solid transparent;
    background: #fff;
    color: #475569;
    font-size: 14px;
    font-weight: 850;
}
.merchant-channel-switch button:first-child { border-radius: 9px 0 0 0; }
.merchant-channel-switch button:last-child { border-left: 0; border-radius: 0 9px 0 0; }
.merchant-channel-switch button.active {
    z-index: 1;
    border-bottom-color: var(--blue);
    color: var(--blue);
}
.merchant-channel-switch button:focus-visible {
    outline: 3px solid rgba(47, 125, 246, .18);
    outline-offset: -3px;
}

.merchant-flow-panel {
    display: grid;
    grid-template-columns: repeat(11, auto);
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 15px 18px;
    box-shadow: var(--shadow);
}
.merchant-flow-panel > svg { width: 15px; height: 15px; color: #c5cedb; }
.merchant-flow-step { min-width: 0; display: flex; align-items: center; gap: 9px; }
.merchant-flow-step > span {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 8px;
    background: #f2f4f7;
    color: #667085;
    font-size: 10px;
    font-weight: 900;
}
.merchant-flow-step.complete > span { background: #e9f8f2; color: #087a4d; }
.merchant-flow-step strong,
.merchant-flow-step small { display: block; white-space: nowrap; }
.merchant-flow-step strong { font-size: 12px; }
.merchant-flow-step small { margin-top: 2px; color: var(--muted); font-size: 10px; }

.merchant-ops-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin: 14px 0;
}
.merchant-ops-stat {
    position: relative;
    overflow: hidden;
    min-height: 102px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    padding: 16px;
    box-shadow: var(--shadow);
}
.merchant-ops-stat::after {
    content: "";
    position: absolute;
    right: -18px;
    bottom: -24px;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: var(--stat-tint, #eef5ff);
}
.merchant-ops-stat span,
.merchant-ops-stat small,
.merchant-ops-stat strong { position: relative; z-index: 1; display: block; }
.merchant-ops-stat span { color: var(--muted); font-size: 11px; font-weight: 800; }
.merchant-ops-stat strong { margin-top: 8px; font-size: 24px; letter-spacing: -.03em; }
.merchant-ops-stat small { margin-top: 5px; color: #98a2b3; font-size: 10px; }
.merchant-ops-stat.warning { --stat-tint: #fff2dc; }
.merchant-ops-stat.success { --stat-tint: #e7f8f0; }
.merchant-ops-stat.violet { --stat-tint: #f0edff; }

.job-admin-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0;
}
.job-admin-stat {
    min-height: 118px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    padding: 20px 22px;
    box-shadow: var(--shadow);
}
.job-admin-stat span,
.job-admin-stat small,
.job-admin-stat strong { display: block; }
.job-admin-stat span { color: #64748b; font-size: 13px; }
.job-admin-stat strong { margin-top: 9px; font-size: 27px; letter-spacing: -.035em; }
.job-admin-stat small { margin-top: 7px; color: #8b98aa; font-size: 11px; }

.job-admin-workspace { overflow: hidden; }
.job-admin-workspace-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 22px 15px;
}
.job-admin-workspace-head h2 { font-size: 21px; letter-spacing: -.025em; }
.job-admin-workspace-head p { margin-top: 5px; font-size: 12px; }
.job-admin-toolbar {
    display: grid;
    grid-template-columns: minmax(330px, 1fr) 160px 160px 160px;
    gap: 12px;
    padding: 0 22px 18px;
}
.job-admin-toolbar input,
.job-admin-toolbar select {
    width: 100%;
    height: 42px;
    border: 1px solid #d8e0ec;
    border-radius: 9px;
    background: #fff;
    color: var(--text);
    outline: none;
}
.job-admin-toolbar input { padding: 0 13px 0 40px; }
.job-admin-toolbar select { padding: 0 11px; }
.job-admin-toolbar input:focus,
.job-admin-toolbar select:focus {
    border-color: #9fc1fa;
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .08);
}
.job-admin-list { padding: 0 22px 20px; }
.job-admin-heading,
.job-admin-row {
    display: grid;
    grid-template-columns: minmax(205px, 1.45fr) minmax(120px, .9fr) 72px 72px 105px 88px minmax(118px, .8fr) minmax(190px, 1fr);
    align-items: center;
    gap: 12px;
}
.job-admin-heading {
    padding: 0 14px 9px;
    color: #8b98aa;
    font-size: 10px;
    font-weight: 850;
}
.job-admin-rows {
    overflow: hidden;
    border: 1px solid #dfe6f0;
    border-radius: 11px;
    background: #fff;
}
.job-admin-row {
    min-height: 72px;
    border-bottom: 1px solid #edf0f5;
    padding: 12px 14px;
    font-size: 11px;
}
.job-admin-row:last-child { border-bottom: 0; }
.job-admin-row:hover { background: #f8fbff; }
.job-admin-row > * { min-width: 0; }
.job-admin-main strong,
.job-admin-main small { display: block; }
.job-admin-main strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}
.job-admin-main small { margin-top: 4px; color: #8b98aa; font-size: 10px; }
.job-admin-cell {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.job-admin-status {
    width: fit-content;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 10px;
    font-weight: 850;
}
.job-admin-status.recruiting { background: #e9f8f2; color: #087a4d; }
.job-admin-status.draft { background: #fff7df; color: #b45309; }
.job-admin-status.offline { background: #f2f4f7; color: #667085; }
.job-admin-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    white-space: nowrap;
}
.job-admin-actions button {
    min-height: 30px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--blue);
    padding: 0 6px;
    font-size: 10px;
    font-weight: 800;
}
.job-admin-actions button:hover { background: var(--blue-soft); }
.job-admin-actions button.danger { color: var(--danger); }
.job-admin-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #edf0f5;
    padding: 12px 14px 0;
    color: #64748b;
    font-size: 11px;
}

.merchant-workspace-panel { overflow: hidden; }
.merchant-workspace-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px 14px;
}
.merchant-workspace-head p { font-size: 12px; }
.merchant-work-count {
    border-radius: 999px;
    background: #f2f4f7;
    color: #667085;
    padding: 6px 11px;
    font-size: 11px;
    font-weight: 850;
}

.merchant-stage-tabs {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    border-bottom: 1px solid var(--line);
    padding: 0 20px;
}
.merchant-stage-tabs button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #667085;
    padding: 0 10px;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 800;
}
.merchant-stage-tabs button.active { border-bottom-color: var(--blue); color: var(--blue); }
.merchant-stage-tabs button span {
    min-width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #f2f4f7;
    color: #667085;
    padding: 0 5px;
    font-size: 10px;
}
.merchant-stage-tabs button.active span { background: var(--blue-soft); color: var(--blue); }

.merchant-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 210px;
    gap: 12px;
    padding: 16px 22px 0;
}
.merchant-search-field { position: relative; display: block; }
.merchant-search-field svg {
    position: absolute;
    left: 13px;
    top: 50%;
    width: 16px;
    height: 16px;
    color: #98a2b3;
    transform: translateY(-50%);
}
.merchant-toolbar input,
.merchant-toolbar select {
    width: 100%;
    height: 42px;
    border: 1px solid #d8e0ec;
    border-radius: 9px;
    background: #fbfdff;
    color: var(--text);
    outline: none;
}
.merchant-toolbar input { padding: 0 13px 0 40px; }
.merchant-toolbar select { padding: 0 11px; }
.merchant-toolbar input:focus,
.merchant-toolbar select:focus { border-color: #9fc1fa; box-shadow: 0 0 0 3px rgba(47, 125, 246, .08); }

.merchant-order-list {
    display: block;
    padding: 16px 22px 22px;
}

.merchant-list-heading,
.merchant-order-row {
    display: grid;
    grid-template-columns: minmax(230px, 2fr) minmax(128px, .95fr) minmax(105px, .76fr) minmax(105px, .7fr) minmax(138px, 1fr) minmax(130px, .9fr) 118px;
    align-items: center;
    gap: 12px;
}

.merchant-list-heading {
    padding: 0 16px 9px;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .02em;
}

.merchant-list-rows {
    overflow: hidden;
    border: 1px solid #dfe6f0;
    border-radius: 12px;
    background: #fff;
}

.merchant-order-row {
    position: relative;
    width: 100%;
    min-height: 82px;
    border: 0;
    border-bottom: 1px solid #edf0f5;
    background: #fff;
    color: var(--text);
    padding: 13px 16px;
    cursor: pointer;
    text-align: left;
    transition: background .16s ease, box-shadow .16s ease;
}

.merchant-order-row:last-child { border-bottom: 0; }
.merchant-order-row:hover { background: #f8fbff; }
.merchant-order-row:focus-visible { z-index: 1; outline: 3px solid rgba(47, 125, 246, .18); outline-offset: -3px; }
.merchant-order-row.needs-action { box-shadow: inset 3px 0 0 #f59e0b; }
.merchant-order-row.payout-failed { box-shadow: inset 3px 0 0 var(--danger); background: #fffafa; }

.merchant-order-row > span { min-width: 0; }
.merchant-order-row strong,
.merchant-order-row small { display: block; }
.merchant-order-row small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.4; }

.merchant-row-main strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    letter-spacing: -.01em;
}

.merchant-row-main small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.merchant-row-main code { color: #667085; font-size: 10px; font-weight: 800; }
.merchant-row-stage .tag { width: fit-content; max-width: 100%; }
.merchant-row-stage small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.merchant-row-person strong,
.merchant-row-date strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.merchant-row-money strong { font-size: 15px; letter-spacing: -.025em; }

.merchant-row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
}
.merchant-row-open,
.merchant-row-delete {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #667085;
    padding: 0 7px;
    font-size: 11px;
    font-weight: 850;
}
.merchant-row-open svg { width: 15px; height: 15px; transition: transform .16s ease; }
.merchant-row-open:hover { background: var(--blue-soft); color: var(--blue); }
.merchant-row-delete { color: var(--danger); }
.merchant-row-delete:hover { background: #fff1f2; }
.merchant-order-row:hover .merchant-row-open svg { transform: translateX(2px); }

.merchant-order-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dfe6f0;
    border-radius: 13px;
    background: #fff;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.merchant-order-card:hover { border-color: #c8d8ed; box-shadow: 0 12px 26px rgba(15, 23, 42, .06); transform: translateY(-1px); }
.merchant-order-card.needs-action { border-left: 3px solid #f59e0b; }
.merchant-order-card.payout-failed { border-left: 3px solid var(--danger); }

.merchant-order-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 18px 14px;
    border-bottom: 1px solid #edf0f5;
}
.merchant-order-identity { min-width: 0; }
.merchant-order-kicker { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 7px; }
.merchant-order-kicker code { color: #667085; font-size: 10px; font-weight: 800; }
.merchant-order-titleline { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.merchant-order-titleline strong { font-size: 16px; letter-spacing: -.01em; }
.merchant-order-subtitle { margin-top: 4px; color: var(--muted); font-size: 11px; }

.merchant-order-money { flex: 0 0 auto; text-align: right; }
.merchant-order-money span,
.merchant-order-money small { display: block; color: var(--muted); font-size: 10px; }
.merchant-order-money strong { display: block; margin: 4px 0 2px; font-size: 21px; letter-spacing: -.04em; }

.merchant-order-card-body { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 16px; padding: 16px 18px; }
.merchant-order-main { min-width: 0; display: grid; gap: 11px; }
.merchant-order-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--muted); font-size: 11px; font-weight: 700; }
.merchant-order-meta span { display: inline-flex; align-items: center; gap: 5px; }

.merchant-order-brief-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.merchant-brief-block {
    min-width: 0;
    border: 1px solid #e6eaf0;
    border-radius: 9px;
    background: #fafbfc;
    padding: 11px 12px;
}
.merchant-brief-block > span { display: block; margin-bottom: 6px; color: #98a2b3; font-size: 10px; font-weight: 850; }
.merchant-brief-block p,
.merchant-order-req,
.merchant-order-note,
.merchant-order-submission p { margin: 0; color: #344054; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.merchant-brief-block p { font-size: 12px; }
.merchant-brief-block a { color: var(--blue); text-decoration: none; font-size: 12px; font-weight: 800; }

.merchant-contract-lock {
    width: fit-content;
    max-width: 100%;
    border: 1px solid #d8e0ec;
    border-radius: 999px;
    background: #f8fafc;
    color: #667085;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 800;
}

.merchant-order-side {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 10px;
    border-left: 1px solid #edf0f5;
    padding-left: 16px;
}
.merchant-order-side-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.merchant-order-side-title strong { font-size: 12px; }
.merchant-order-side-title span { color: var(--muted); font-size: 10px; }
.merchant-progress-list { display: grid; gap: 0; }
.merchant-progress-item { position: relative; display: grid; grid-template-columns: 18px 1fr; gap: 8px; min-height: 38px; }
.merchant-progress-item:not(:last-child)::after { content: ""; position: absolute; left: 6px; top: 15px; bottom: -2px; width: 1px; background: #e0e6ef; }
.merchant-progress-item > i { position: relative; z-index: 1; width: 13px; height: 13px; margin-top: 1px; border: 3px solid #fff; border-radius: 50%; background: #d5dce7; box-shadow: 0 0 0 1px #d5dce7; }
.merchant-progress-item.done > i { background: var(--green); box-shadow: 0 0 0 1px var(--green); }
.merchant-progress-item.current > i { background: var(--blue); box-shadow: 0 0 0 4px rgba(47, 125, 246, .12); }
.merchant-progress-item strong,
.merchant-progress-item span { display: block; }
.merchant-progress-item strong { font-size: 11px; }
.merchant-progress-item span { margin-top: 2px; color: var(--muted); font-size: 10px; line-height: 1.4; }

.merchant-funding-state {
    display: flex;
    align-items: center;
    gap: 7px;
    border-radius: 8px;
    background: #f8fafc;
    color: #667085;
    padding: 8px 9px;
    font-size: 10px;
    font-weight: 800;
}
.merchant-funding-state.confirmed { background: #eefbf6; color: #087a4d; }
.merchant-funding-state svg { width: 13px; height: 13px; }

.merchant-order-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-top: 1px solid #edf0f5;
    background: #fcfdff;
    padding: 11px 18px;
}
.merchant-order-card-footer > span { color: var(--muted); font-size: 10px; }
.merchant-order-actions { justify-content: flex-end; min-width: 0; }
.merchant-order-actions .primary { border-color: var(--blue); background: var(--blue); color: #fff; }

.merchant-order-submission { display: grid; gap: 6px; border: 1px solid #dbeafe; border-radius: 8px; background: #f8fafc; padding: 10px 12px; font-size: 13px; }
.merchant-order-submission strong { color: #1d4ed8; font-size: 13px; }
.merchant-order-submission a { width: fit-content; color: var(--blue); text-decoration: none; font-size: 13px; font-weight: 800; }

.merchant-version-history {
    min-width: 0;
    display: grid;
    gap: 9px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fbff;
    padding: 12px;
}

.merchant-version-heading,
.merchant-version-meta {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.merchant-version-heading strong { color: #1d4ed8; font-size: 13px; }
.merchant-version-heading span,
.merchant-version-meta span { color: var(--muted); font-size: 11px; }

.merchant-version-list {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.merchant-version-item {
    min-width: 0;
    display: grid;
    gap: 7px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    padding: 10px;
}

.merchant-version-item p {
    margin: 0;
    color: #344054;
    font-size: 13px;
    line-height: 1.6;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.merchant-version-item > a {
    width: fit-content;
    color: var(--blue);
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}

.merchant-version-review {
    border-left: 3px solid #f59e0b;
    color: #9a3412;
    padding-left: 8px;
    font-size: 12px;
    line-height: 1.55;
}

.merchant-payout-panel {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid #d8e0ec;
    border-radius: 10px;
    background: #f8fafc;
    padding: 12px 13px;
}

.merchant-payout-panel > div:first-child {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.merchant-payout-panel span,
.merchant-payout-panel em { color: var(--muted); font-size: 10px; font-style: normal; line-height: 1.45; }
.merchant-payout-panel strong { font-size: 14px; }
.merchant-payout-panel code { color: #475467; font-size: 11px; overflow-wrap: anywhere; }
.merchant-payout-panel.paid,
.merchant-payout-panel.settled { border-color: #a7f3d0; background: #f0fdf8; }
.merchant-payout-panel.payout_failed { border-color: #fecaca; background: #fffafa; }
.merchant-payout-actions { flex: 0 0 auto; }

.file-list {
    display: grid;
    gap: 6px;
}

.file-list a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    padding: 9px 11px;
    color: var(--text);
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
}

.file-list span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-list em {
    flex: 0 0 auto;
    color: var(--muted);
    font-style: normal;
    font-size: 12px;
}


.count-link {
    min-width: 34px;
    height: 30px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--blue);
    padding: 0 8px;
    border-radius: 7px;
    font-weight: 900;
}

.count-link:hover {
    border-color: #bfdbfe;
    background: #eff6ff;
}

.overview-list {
    display: grid;
    gap: 10px;
    padding: 18px 24px 24px;
}

.overview-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfdff;
}

.overview-item span {
    color: var(--muted);
    font-size: 12px;
}

.media-strip,
.generated-grid {
    display: grid;
    gap: 14px;
    padding: 18px 24px 24px;
}

.media-strip {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.generated-type-switcher {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 220px));
    gap: 12px;
    padding: 18px 24px 4px;
}

.generated-type-switcher button {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
    color: #526071;
    text-align: left;
    transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}

.generated-type-switcher button:hover {
    border-color: #b8cff4;
    background: #f5f9ff;
}

.generated-type-switcher button.active {
    border-color: var(--blue);
    background: var(--blue-soft);
    color: var(--blue);
    box-shadow: 0 6px 16px rgba(47, 125, 246, .12);
}

.generated-type-switcher button:focus-visible {
    outline: 3px solid rgba(47, 125, 246, .24);
    outline-offset: 2px;
}

.generated-type-switcher button > span:last-child {
    display: grid;
    gap: 3px;
}

.generated-type-switcher strong {
    font-size: 14px;
}

.generated-type-switcher small {
    color: var(--muted);
    font-size: 12px;
}

.generated-type-icon {
    width: 34px;
    height: 34px;
    display: grid;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 8px;
    background: #fff;
    color: currentColor;
    font-size: 15px;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, .22);
}

.generated-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.generated-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.generated-preview {
    position: relative;
    aspect-ratio: 4 / 3;
    background: #f1f5f9;
}

.generated-preview img,
.generated-preview video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.generated-media-unavailable {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    padding: 20px;
    color: var(--muted);
    font-size: 13px;
    text-align: center;
}

.generated-media-status {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(241, 245, 249, .82);
    color: var(--muted);
    font-size: 13px;
    text-align: center;
    pointer-events: none;
}

.generated-media-status[hidden] {
    display: none;
}

.generated-media-status[data-state="error"] {
    background: rgba(241, 245, 249, .94);
}

.generated-info {
    padding: 12px;
    display: grid;
    gap: 6px;
}

.generated-info strong {
    font-size: 13px;
}

.generated-info span,
.filter-label {
    color: var(--muted);
    font-size: 12px;
}

.muted {
    color: var(--muted);
    font-size: 12px;
}

.filter-label {
    padding: 14px 24px 0;
}

.generated-info a {
    color: var(--blue);
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}

.generated-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.generated-delete-btn {
    border: 0;
    border-radius: 6px;
    background: #fef2f2;
    color: var(--danger);
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.generated-delete-btn:hover {
    background: #fee2e2;
}

.generated-delete-btn:disabled {
    cursor: wait;
    opacity: .6;
}

.generated-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 24px 24px;
}

.pagination-summary {
    color: var(--muted);
    font-size: 13px;
}

.pagination-buttons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.pagination-buttons button {
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    font-weight: 700;
    cursor: pointer;
}

.pagination-buttons button:hover:not(:disabled),
.pagination-buttons button.active {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.pagination-buttons button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.pagination-ellipsis {
    min-width: 20px;
    color: var(--muted);
    text-align: center;
}

@media (max-width: 640px) {
    .generated-type-switcher {
        grid-template-columns: 1fr;
    }

    .generated-pagination {
        align-items: flex-start;
        flex-direction: column;
    }

    .pagination-buttons {
        justify-content: flex-start;
    }
}

.empty-panel {
    padding: 28px;
}

.empty-state {
    padding: 28px;
    color: var(--muted);
    text-align: center;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    background: #fbfdff;
}

.modal {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(15, 23, 42, .38);
    z-index: 50;
}

body.modal-open { overflow: hidden; }

.modal[hidden] {
    display: none;
}

.modal-card {
    width: min(430px, calc(100vw - 32px));
    position: relative;
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 30px 80px rgba(15, 23, 42, .28);
}

.modal-card.wide-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
}

.modal-close {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: var(--text);
    font-size: 22px;
}

.modal-card label {
    display: grid;
    gap: 7px;
    margin-top: 12px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.modal-field {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.field-title {
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.user-selection-title,
.user-selection-toolbar,
.user-selection-summary,
.user-selection-actions {
    display: flex;
    align-items: center;
}

.user-selection-title,
.user-selection-toolbar {
    justify-content: space-between;
    gap: 12px;
}

.user-selection-toolbar {
    align-items: flex-end;
}

.user-selection-toolbar .model-api-user-search {
    flex: 1 1 auto;
}

.user-selection-summary,
.user-selection-actions {
    gap: 7px;
}

.user-selection-actions button {
    min-height: 28px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    color: #344054;
    padding: 0 10px;
    font-size: 11px;
    font-weight: 800;
}

.user-selection-actions button:hover {
    border-color: #9ec5ff;
    color: var(--blue);
}

@media (max-width: 720px) {
    .user-selection-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
}

.choice-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    max-height: 190px;
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px;
    background: #fbfdff;
}

.choice-list label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    color: var(--text);
    font-weight: 700;
}

.choice-list input {
    width: auto;
    height: auto;
}

.modal-card input,
.modal-card select,
.modal-card textarea {
    width: 100%;
}

.modal-card textarea {
    min-height: 96px;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--text);
    font: inherit;
    resize: vertical;
}

.review-submission-list {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.review-submission-card {
    display: grid;
    gap: 9px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
    padding: 14px;
}

.review-submission-card.pending-review {
    border-color: #fdba74;
    background: #fffaf5;
}

.review-submission-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--muted);
    font-size: 12px;
}

.review-submission-head strong {
    color: var(--text);
    font-size: 14px;
}

.review-submission-card p,
.review-result {
    margin: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.review-result {
    border-left: 3px solid #f97316;
    padding-left: 10px;
    color: #9a3412;
    font-size: 13px;
}

.review-deliverables {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.review-deliverables a,
.review-deliverables span {
    border-radius: 7px;
    background: #eaf2ff;
    color: var(--blue);
    padding: 7px 10px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}

.review-submission-card > button,
.review-actions button {
    width: fit-content;
    min-height: 36px;
    border: 0;
    border-radius: 8px;
    background: var(--blue);
    color: #fff;
    padding: 0 14px;
    font-weight: 800;
}

.review-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
}

.review-actions .danger-action {
    background: var(--danger);
}

.modal-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.merchant-publish-modal {
    width: min(900px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    overflow: auto;
    padding: 0;
}

.merchant-publish-head {
    position: sticky;
    z-index: 3;
    top: 0;
    border-bottom: 1px solid var(--line);
    background: rgba(255, 255, 255, .96);
    padding: 22px 26px 18px;
    backdrop-filter: blur(12px);
}
.merchant-publish-head > span { display: block; margin-bottom: 6px; color: var(--blue); font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.merchant-publish-head h2 { font-size: 21px; }
.merchant-publish-head p { max-width: 760px; font-size: 12px; line-height: 1.65; }
.merchant-publish-sections { display: grid; gap: 14px; padding: 20px 26px 0; }

.merchant-form-section {
    display: grid;
    gap: 13px;
    border: 1px solid #e1e7f0;
    border-radius: 12px;
    background: #fbfcfe;
    padding: 16px;
}
.merchant-form-section-head { display: flex; align-items: center; gap: 10px; }
.merchant-form-section-head > span { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--blue-soft); color: var(--blue); font-size: 10px; font-weight: 900; }
.merchant-form-section-head strong,
.merchant-form-section-head small { display: block; }
.merchant-form-section-head strong { font-size: 14px; }
.merchant-form-section-head small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.merchant-form-grid { display: grid; gap: 12px; }
.merchant-form-grid.two-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.merchant-publish-modal label { margin: 0; color: #475467; font-size: 12px; }
.merchant-publish-modal label > em { color: #d92d20; font-style: normal; font-size: 10px; }
.merchant-publish-modal input,
.merchant-publish-modal textarea { margin-top: 7px; background: #fff; }

.merchant-funding-check {
    display: flex !important;
    align-items: flex-start;
    gap: 11px;
    margin: 16px 26px 0 !important;
    border: 1px solid #b9d4fb;
    border-radius: 11px;
    background: #f5f9ff;
    padding: 13px 14px;
}
.merchant-funding-check input { width: 17px !important; height: 17px !important; flex: 0 0 auto; margin: 1px 0 0 !important; accent-color: var(--blue); }
.merchant-funding-check strong,
.merchant-funding-check small { display: block; }
.merchant-funding-check strong { color: #1d4ed8; font-size: 12px; }
.merchant-funding-check small { margin-top: 4px; color: #61718a; font-size: 10px; line-height: 1.5; }
.merchant-form-section .merchant-funding-check { margin: 2px 0 0 !important; }

.merchant-order-audit {
    margin: 10px 26px 0;
    border-radius: 8px;
    background: #f2f4f7;
    color: #667085;
    padding: 9px 11px;
    font-size: 10px;
    line-height: 1.55;
}
.merchant-form-section .merchant-order-audit { margin: -4px 0 0; }
.merchant-cover-input-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px;
}
.merchant-cover-upload-btn {
    display: inline-flex;
    min-width: 116px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #b9cdf0;
    border-radius: 9px;
    background: #f5f9ff;
    color: #1d4ed8;
    padding: 0 14px;
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.merchant-cover-upload-btn:hover { border-color: var(--blue); background: #edf5ff; transform: translateY(-1px); }
.merchant-cover-upload-btn:disabled { opacity: .6; cursor: wait; transform: none; }
.merchant-cover-upload-btn svg { width: 15px; height: 15px; }
.merchant-cover-upload-status {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    border: 1px solid #cfe0f8;
    border-radius: 10px;
    background: #f7fbff;
    padding: 8px;
}
.merchant-cover-upload-status[hidden] { display: none; }
.merchant-cover-upload-status img {
    display: block;
    width: 118px;
    aspect-ratio: 16 / 9;
    border-radius: 7px;
    object-fit: cover;
}
.merchant-cover-upload-status strong,
.merchant-cover-upload-status small { display: block; }
.merchant-cover-upload-status strong { color: #1d4ed8; font-size: 11px; }
.merchant-cover-upload-status small { margin-top: 4px; color: #667085; font-size: 10px; line-height: 1.5; }
.merchant-cover-upload-status.is-error {
    grid-template-columns: 1fr;
    border-color: #fecaca;
    background: #fff7f7;
}
.merchant-cover-upload-status.is-error strong { color: var(--danger); }
.merchant-cover-picker {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}
.merchant-cover-option {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d9e0ea;
    border-radius: 10px;
    background: #fff;
    color: #344054;
    padding: 5px;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.merchant-cover-option:hover { border-color: #9dbcf0; transform: translateY(-1px); }
.merchant-cover-option.is-selected {
    border-color: var(--blue);
    box-shadow: 0 0 0 2px rgba(47, 125, 246, .13);
}
.merchant-cover-option img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 6px;
    object-fit: cover;
}
.merchant-cover-option > span {
    display: block;
    overflow: hidden;
    margin: 7px 3px 3px;
    font-size: 10px;
    font-weight: 800;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.merchant-cover-auto {
    display: flex;
    min-height: 90px;
    flex-direction: column;
    justify-content: center;
    background: linear-gradient(145deg, #f8fbff, #edf4ff);
    padding: 12px;
}
.merchant-cover-auto > span { margin: 0; color: #1d4ed8; font-size: 11px; text-align: center; }
.merchant-cover-auto > small { margin-top: 5px; color: #74839b; font-size: 9px; line-height: 1.45; }
.merchant-home-sync-note {
    margin: -2px 0 0;
    color: #667085;
    font-size: 10px;
    line-height: 1.6;
}
.merchant-publish-modal .form-message { margin: 8px 26px 0; }
.merchant-publish-actions {
    position: sticky;
    z-index: 3;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid var(--line);
    background: rgba(255, 255, 255, .97);
    padding: 14px 26px;
    backdrop-filter: blur(12px);
}
.merchant-publish-actions button { min-height: 40px; border-radius: 8px; padding: 0 16px; font-weight: 850; }
.merchant-secondary-action { border: 1px solid #d8e0ec; background: #fff; color: #475467; }
.merchant-submit-action { border: 0; background: var(--blue); color: #fff; box-shadow: 0 8px 18px rgba(47, 125, 246, .2); }
.merchant-publish-actions button:disabled { cursor: wait; opacity: .55; }

.merchant-detail-modal {
    width: min(1120px, calc(100vw - 34px));
    max-height: calc(100vh - 38px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #dce3ed;
    border-radius: 16px;
    padding: 0;
}

.merchant-detail-modal > .modal-close {
    z-index: 6;
    top: 17px;
    right: 18px;
    border-radius: 8px;
    background: #f2f4f7;
    color: #475467;
}
.merchant-detail-modal > .modal-close:focus-visible { outline: 3px solid rgba(47, 125, 246, .24); outline-offset: 1px; }

.merchant-detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
    border-bottom: 1px solid var(--line);
    background: #fff;
    padding: 22px 64px 19px 26px;
}

.merchant-detail-heading { min-width: 0; }
.merchant-detail-kicker { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 7px; }
.merchant-detail-kicker code { color: #667085; font-size: 10px; font-weight: 850; }
.merchant-detail-heading h2 { overflow-wrap: anywhere; font-size: 21px; letter-spacing: -.02em; }
.merchant-detail-heading p { margin-top: 5px; font-size: 11px; }

.merchant-detail-money { flex: 0 0 auto; min-width: 160px; padding-top: 4px; text-align: right; }
.merchant-detail-money span,
.merchant-detail-money small { display: block; color: var(--muted); font-size: 10px; }
.merchant-detail-money strong { display: block; margin: 4px 0 2px; font-size: 24px; letter-spacing: -.04em; }

.merchant-detail-content {
    min-height: 0;
    max-height: calc(100vh - 190px);
    flex: 1 1 auto;
    overflow-y: auto;
    background: #f7f9fc;
    padding: 18px 22px 22px;
}

.merchant-detail-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.merchant-detail-facts > div {
    min-width: 0;
    min-height: 76px;
    display: grid;
    align-content: center;
    gap: 4px;
    border: 1px solid #dfe6f0;
    border-radius: 10px;
    background: #fff;
    padding: 12px 13px;
}

.merchant-detail-facts span,
.merchant-detail-facts small { color: var(--muted); font-size: 10px; }
.merchant-detail-facts strong { overflow-wrap: anywhere; font-size: 12px; }

.merchant-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    align-items: start;
    gap: 14px;
}

.merchant-detail-main { min-width: 0; display: grid; gap: 12px; }
.merchant-detail-section,
.merchant-detail-side-card {
    min-width: 0;
    border: 1px solid #dfe6f0;
    border-radius: 11px;
    background: #fff;
    padding: 15px;
}

.merchant-detail-section { display: grid; gap: 12px; }
.merchant-detail-section-head { display: flex; align-items: center; gap: 10px; }
.merchant-detail-section-head > span {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 7px;
    background: var(--blue-soft);
    color: var(--blue);
    font-size: 9px;
    font-weight: 900;
}
.merchant-detail-section-head strong,
.merchant-detail-section-head small { display: block; }
.merchant-detail-section-head strong { font-size: 13px; }
.merchant-detail-section-head small { margin-top: 2px; color: var(--muted); font-size: 10px; }

.merchant-detail-brief-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.merchant-detail-reference { border-top: 1px solid #edf0f5; padding-top: 11px; }
.merchant-detail-reference > span { display: block; margin-bottom: 7px; color: #98a2b3; font-size: 10px; font-weight: 850; }
.merchant-detail-reference p { margin: 0 0 4px; color: #475467; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.merchant-detail-reference a { display: block; width: fit-content; margin-bottom: 4px; color: var(--blue); text-decoration: none; font-size: 12px; font-weight: 800; overflow-wrap: anywhere; }
.merchant-detail-empty { display: grid; place-items: center; min-height: 86px; border: 1px dashed #d8e0ec; border-radius: 9px; color: #98a2b3; font-size: 11px; }

.merchant-detail-side { min-width: 0; display: grid; gap: 12px; }
.merchant-detail-side-card { display: grid; gap: 11px; }
.merchant-detail-side-card > strong { font-size: 12px; }
.merchant-detail-audit-list { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 8px 9px; margin: 0; font-size: 10px; }
.merchant-detail-audit-list dt { color: #98a2b3; }
.merchant-detail-audit-list dd { margin: 0; color: #475467; overflow-wrap: anywhere; }

.merchant-detail-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid var(--line);
    background: rgba(255, 255, 255, .98);
    padding: 13px 22px;
}
.merchant-detail-footer > span { color: var(--muted); font-size: 10px; }
.merchant-detail-actions { justify-content: flex-end; }
.merchant-detail-actions .primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.merchant-detail-no-action { color: #98a2b3; font-size: 11px; font-weight: 750; }

.merchant-review-modal {
    width: min(680px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
}

.merchant-review-heading {
    display: grid;
    gap: 6px;
    padding-right: 28px;
}

.merchant-review-heading h2 { margin: 0; }
.merchant-review-heading p,
.merchant-review-hint { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }

.merchant-review-kicker {
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .12em;
}

.merchant-review-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.merchant-review-context > div {
    min-width: 0;
    display: grid;
    gap: 5px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #f8fafc;
    padding: 11px;
}

.merchant-review-context span { color: var(--muted); font-size: 11px; font-weight: 700; }
.merchant-review-context strong { overflow-wrap: anywhere; font-size: 14px; }
.merchant-review-hint { margin-top: 10px; }

.merchant-review-brief,
.merchant-review-delivery {
    display: grid;
    gap: 8px;
    margin-top: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
    padding: 12px;
}
.merchant-review-brief strong,
.merchant-review-delivery > strong { font-size: 12px; }
.merchant-review-brief p,
.merchant-review-delivery p { margin: 0; color: #475467; font-size: 12px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.merchant-review-brief dl { display: grid; grid-template-columns: 110px 1fr; gap: 6px 10px; margin: 0; font-size: 11px; }
.merchant-review-brief dt { color: #98a2b3; }
.merchant-review-brief dd { margin: 0; color: #344054; white-space: pre-wrap; overflow-wrap: anywhere; }
.merchant-review-delivery a { width: fit-content; color: var(--blue); text-decoration: none; font-size: 12px; font-weight: 800; }

.merchant-review-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.merchant-review-actions button {
    min-height: 40px;
    border: 0;
    border-radius: 8px;
    padding: 0 12px;
    font-weight: 850;
}

.merchant-review-actions button:disabled { cursor: not-allowed; opacity: .48; }
.merchant-review-actions .review-revision { background: #fff7ed; color: #b45309; }
.merchant-review-actions .review-terminate { background: #fef2f2; color: #b42318; }
.merchant-review-actions .review-approve { background: var(--blue); color: #fff; }

.form-message {
    min-height: 20px;
    margin: 10px 0;
    color: var(--danger);
    font-size: 13px;
}

.form-message.success {
    color: var(--green);
}

.form-message.info {
    color: var(--blue);
}

.submit {
    width: 100%;
}

/* 独立管理端认证门：默认先遮蔽后台，认证完成后才显示管理界面。 */
body.admin-auth-locked {
    overflow: hidden;
    background: #08090c;
}

body.admin-auth-locked .admin-layout {
    display: none;
}

.admin-auth-gate {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: auto;
    padding: clamp(18px, 3.5vw, 52px);
    color: #f7f8fb;
    background:
        radial-gradient(circle at 12% 14%, rgba(97, 126, 255, .16), transparent 32%),
        radial-gradient(circle at 86% 82%, rgba(71, 214, 171, .10), transparent 30%),
        linear-gradient(145deg, #08090c 0%, #101117 47%, #090a0d 100%);
    isolation: isolate;
    transition: opacity .34s ease, visibility .34s ease;
}

.admin-auth-gate::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(120deg, rgba(255,255,255,.035), transparent 28%, transparent 72%, rgba(255,255,255,.025));
}

/* During the initial session check, never paint the login form. */
.admin-auth-gate.is-checking .admin-auth-shell {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.admin-auth-gate.is-checking::after {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    width: 34px;
    height: 34px;
    margin: -17px 0 0 -17px;
    border: 2px solid rgba(255,255,255,.14);
    border-top-color: #8f9bff;
    border-radius: 50%;
    animation: admin-auth-check-spin .72s linear infinite;
}

@keyframes admin-auth-check-spin {
    to { transform: rotate(360deg); }
}

body.admin-authenticated .admin-auth-gate {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.admin-auth-ambient,
.admin-auth-grid {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
}

.admin-auth-grid {
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
    background-size: 58px 58px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 88%);
}

.admin-auth-orb {
    position: absolute;
    display: block;
    width: min(42vw, 680px);
    aspect-ratio: 1;
    border-radius: 50%;
    filter: blur(12px);
    opacity: .22;
}

.admin-auth-orb.orb-one {
    top: -30%;
    left: -12%;
    background: radial-gradient(circle, rgba(110, 128, 255, .5), transparent 68%);
}

.admin-auth-orb.orb-two {
    right: -16%;
    bottom: -34%;
    background: radial-gradient(circle, rgba(46, 204, 160, .34), transparent 70%);
}

.admin-auth-shell {
    width: min(1180px, 100%);
    min-height: min(680px, calc(100dvh - clamp(40px, 7vw, 108px)));
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.105);
    border-radius: 30px;
    background: rgba(14, 15, 20, .72);
    box-shadow: 0 44px 120px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.045);
    backdrop-filter: blur(26px) saturate(125%);
    -webkit-backdrop-filter: blur(26px) saturate(125%);
}

.admin-auth-story {
    position: relative;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(34px, 5vw, 68px);
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(81, 98, 197, .16), transparent 46%),
        linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.008));
    border-right: 1px solid rgba(255,255,255,.085);
}

.admin-auth-story::before {
    content: 'HK';
    position: absolute;
    right: -28px;
    bottom: 68px;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255,255,255,.045);
    font-size: clamp(210px, 26vw, 380px);
    font-weight: 950;
    line-height: .72;
    letter-spacing: -.1em;
    pointer-events: none;
}

.admin-auth-brand {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 13px;
}

.admin-auth-mark {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 13px;
    background: #f4f5f7;
    box-shadow: 0 12px 26px rgba(0,0,0,.3);
}

.admin-auth-mark img { width: 31px; height: 31px; object-fit: contain; }
.admin-auth-brand > span:last-child { display: grid; gap: 3px; }
.admin-auth-brand strong { font-size: 13px; letter-spacing: .12em; }
.admin-auth-brand small { color: #828896; font-size: 9px; font-weight: 800; letter-spacing: .19em; }

.admin-auth-story-copy {
    position: relative;
    z-index: 1;
    max-width: 550px;
    margin: auto 0;
    padding: 54px 0 42px;
}

.admin-auth-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #9ba4ff;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .19em;
}

.admin-auth-eyebrow i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #7e8cff;
    box-shadow: 0 0 0 5px rgba(126,140,255,.1), 0 0 22px rgba(126,140,255,.7);
}

.admin-auth-story h1 {
    margin: 21px 0 22px;
    color: #f9fafc;
    font-size: clamp(48px, 5.2vw, 76px);
    font-weight: 820;
    line-height: .98;
    letter-spacing: -.065em;
}

.admin-auth-story h1 em {
    color: transparent;
    background: linear-gradient(100deg, #cfd4ff 0%, #7d8cff 50%, #7de0c1 105%);
    -webkit-background-clip: text;
    background-clip: text;
    font-style: normal;
}

.admin-auth-story-copy p {
    max-width: 500px;
    margin: 0;
    color: #9298a7;
    font-size: 14px;
    line-height: 1.9;
}

.admin-auth-trust-row {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.admin-auth-trust-row > span {
    min-width: 0;
    display: grid;
    gap: 5px;
    min-height: 104px;
    align-content: center;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 16px;
    background: rgba(255,255,255,.026);
}

.admin-auth-trust-row svg { width: 18px; height: 18px; margin-bottom: 5px; color: #909cff; }
.admin-auth-trust-row b { overflow: hidden; color: #e7e9ef; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.admin-auth-trust-row small { overflow: hidden; color: #717785; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }

.admin-auth-story footer {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 32px;
    color: #555b69;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .17em;
}

.admin-auth-panel {
    display: grid;
    place-items: center;
    padding: clamp(28px, 4vw, 62px);
    background: rgba(7, 8, 11, .52);
}

.admin-auth-card {
    width: min(410px, 100%);
    display: grid;
    gap: 24px;
}

.admin-auth-card-head {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 6px;
}

.admin-auth-card-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(128,143,255,.25);
    border-radius: 15px;
    color: #9ca7ff;
    background: linear-gradient(145deg, rgba(119,134,255,.16), rgba(119,134,255,.045));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.admin-auth-card-icon svg { width: 23px; height: 23px; }
.admin-auth-card-head > div { min-width: 0; }
.admin-auth-card-head > div > span { color: #727988; font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.admin-auth-card-head h2 { margin: 7px 0 6px; color: #f7f8fb; font-size: 25px; letter-spacing: -.035em; }
.admin-auth-card-head p { margin: 0; color: #7f8592; font-size: 12px; }

.admin-auth-fields { display: grid; gap: 16px; }
.admin-auth-field { display: grid; gap: 9px; }
.admin-auth-field > span { color: #aeb3bd; font-size: 11px; font-weight: 750; }
.admin-auth-field > div { position: relative; }
.admin-auth-field > div > svg {
    position: absolute;
    top: 50%;
    left: 15px;
    width: 17px;
    height: 17px;
    color: #6f7582;
    transform: translateY(-50%);
    pointer-events: none;
}

.admin-auth-field input {
    width: 100%;
    height: 52px;
    border: 1px solid rgba(255,255,255,.105);
    border-radius: 14px;
    outline: none;
    padding: 0 48px 0 44px;
    color: #f5f6f8;
    caret-color: #8c98ff;
    background: rgba(255,255,255,.038);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.admin-auth-field input::placeholder { color: #555b67; }
.admin-auth-field input:focus {
    border-color: rgba(130,145,255,.64);
    background: rgba(110,125,240,.065);
    box-shadow: 0 0 0 4px rgba(112,128,255,.09), inset 0 1px 0 rgba(255,255,255,.04);
}

.admin-password-toggle {
    position: absolute;
    top: 50%;
    right: 9px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 10px;
    color: #696f7c;
    background: transparent;
    transform: translateY(-50%);
}

.admin-password-toggle:hover { color: #cbd0da; background: rgba(255,255,255,.055); }
.admin-password-toggle svg { width: 16px; height: 16px; }

.admin-auth-message {
    min-height: 39px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: -5px 0 -7px;
    padding: 9px 11px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: #8c93a0;
    font-size: 11px;
    line-height: 1.45;
}

.admin-auth-message:empty { visibility: hidden; }
.admin-auth-message svg { width: 15px; height: 15px; flex: 0 0 15px; }
.admin-auth-message.is-info { color: #9ca5ff; background: rgba(111,126,255,.07); border-color: rgba(111,126,255,.12); }
.admin-auth-message.is-error { color: #ff9f9f; background: rgba(255,91,91,.075); border-color: rgba(255,91,91,.13); }
.admin-auth-message.is-success { color: #77d9bb; background: rgba(61,207,163,.075); border-color: rgba(61,207,163,.13); }
.admin-auth-message.is-info svg { animation: admin-auth-spin 1s linear infinite; }
@keyframes admin-auth-spin { to { transform: rotate(360deg); } }

.admin-auth-submit {
    width: 100%;
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    color: #0b0c11;
    background: linear-gradient(110deg, #f4f5f8 0%, #dfe3ff 55%, #c7f0e3 112%);
    box-shadow: 0 14px 32px rgba(96,111,217,.18), inset 0 1px 0 rgba(255,255,255,.8);
    font-size: 13px;
    font-weight: 850;
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.admin-auth-submit:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 18px 40px rgba(96,111,217,.27); }
.admin-auth-submit:active:not(:disabled) { transform: translateY(0) scale(.985); }
.admin-auth-submit:disabled { cursor: wait; opacity: .48; }
.admin-auth-submit svg { width: 17px; height: 17px; }

.admin-auth-separator { display: flex; align-items: center; gap: 12px; color: #555b66; font-size: 9px; letter-spacing: .12em; }
.admin-auth-separator::before,
.admin-auth-separator::after { content: ''; height: 1px; flex: 1; background: rgba(255,255,255,.075); }

.admin-auth-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: -7px 0 0;
    color: #686f7c;
    font-size: 10px;
    line-height: 1.65;
}

.admin-auth-note svg { width: 14px; height: 14px; flex: 0 0 14px; margin-top: 1px; color: #7983d2; }
.admin-auth-back {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: -5px auto 0;
    color: #7e8592;
    text-decoration: none;
    font-size: 11px;
    font-weight: 750;
    transition: color .16s ease;
}
.admin-auth-back:hover { color: #e5e7ec; }
.admin-auth-back svg { width: 14px; height: 14px; }

.admin-session-card {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.admin-session-avatar {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(145deg, #7586ff, #4455c9);
    font-size: 12px;
    font-weight: 900;
}

.admin-session-card > span:last-child { min-width: 0; display: grid; gap: 2px; }
.admin-session-card strong { overflow: hidden; color: var(--text); font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.admin-session-card small { color: var(--muted); font-size: 9px; }

.admin-logout-btn {
    width: 100%;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-bottom: 10px;
    border: 1px solid var(--line);
    border-radius: 9px;
    color: #667085;
    background: #fff;
    font-size: 11px;
    font-weight: 800;
}

.admin-logout-btn:hover { color: #b42318; border-color: #fecaca; background: #fff7f7; }
.admin-logout-btn svg { width: 14px; height: 14px; }

@media (max-width: 900px) {
    .admin-auth-gate { padding: 18px; }
    .admin-auth-shell { grid-template-columns: 1fr; min-height: auto; }
    .admin-auth-story { min-height: 280px; padding: 30px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.085); }
    .admin-auth-story-copy { padding: 42px 0 22px; }
    .admin-auth-story h1 { margin: 14px 0; font-size: clamp(42px, 9vw, 64px); }
    .admin-auth-story-copy p { max-width: 620px; }
    .admin-auth-trust-row,
    .admin-auth-story footer { display: none; }
    .admin-auth-panel { padding: 34px 28px 38px; }
}

@media (max-width: 560px) {
    .admin-auth-gate { align-items: start; padding: 10px; }
    .admin-auth-shell { border-radius: 22px; }
    .admin-auth-story { min-height: 220px; padding: 24px; }
    .admin-auth-story-copy { padding: 32px 0 5px; }
    .admin-auth-story h1 { font-size: 42px; }
    .admin-auth-story-copy p { display: none; }
    .admin-auth-panel { padding: 28px 20px 32px; }
    .admin-auth-card { gap: 20px; }
    .admin-auth-card-head h2 { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .admin-auth-gate,
    .admin-auth-submit,
    .admin-auth-field input { transition-duration: .01ms !important; }
}

.user-api-count {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    border-radius: 999px;
    background: var(--blue-soft);
    color: var(--blue);
    padding: 0 12px;
    font-size: 12px;
    font-weight: 900;
}

.user-api-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    min-height: 610px;
}

.user-api-side {
    border-right: 1px solid var(--line);
    background: #fbfdff;
    padding: 20px;
}

.user-api-field {
    display: grid;
    gap: 8px;
    color: #55657a;
    font-size: 13px;
    font-weight: 800;
}

.user-api-field input,
.user-api-field select,
.user-api-field textarea {
    width: 100%;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    outline: none;
    font: inherit;
}

.user-api-field input,
.user-api-field select {
    height: 42px;
    padding: 0 12px;
}

.user-api-field textarea {
    min-height: 180px;
    padding: 11px 12px;
    resize: vertical;
    line-height: 1.55;
}

.user-api-field input:focus,
.user-api-field select:focus,
.user-api-field textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .1);
}

.user-api-field input:disabled,
.user-api-field textarea:disabled {
    cursor: not-allowed;
    background: #f2f4f7;
    color: #98a2b3;
}

.user-api-user-summary {
    margin-top: 12px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    padding: 12px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
}

.user-api-user-summary strong {
    display: block;
    color: var(--text);
    font-size: 14px;
}

.user-api-section-title {
    margin: 22px 2px 10px;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 900;
}

.user-api-provider-list {
    display: grid;
    gap: 8px;
}

.user-api-provider-card {
    width: 100%;
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    color: var(--text);
    padding: 10px 12px;
    text-align: left;
}

.user-api-provider-card:hover {
    border-color: #bdd4fb;
}

.user-api-provider-card.active {
    border-color: var(--blue);
    background: var(--blue-soft);
    box-shadow: inset 3px 0 0 var(--blue);
}

.user-api-provider-card.locked {
    opacity: .64;
}

.user-api-provider-card strong,
.user-api-provider-card small {
    display: block;
}

.user-api-provider-card small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
}

.user-api-provider-state {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #cbd5e1;
    box-shadow: 0 0 0 4px rgba(203, 213, 225, .2);
}

.user-api-provider-state.configured {
    background: var(--green);
    box-shadow: 0 0 0 4px rgba(19, 168, 107, .12);
}

.user-api-editor {
    min-width: 0;
    padding: 24px;
}

.user-api-editor-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}

.user-api-eyebrow {
    display: block;
    margin-bottom: 6px;
    color: var(--blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.user-api-key-status {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    border-radius: 999px;
    background: #f2f4f7;
    color: #667085;
    padding: 0 12px;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 900;
}

.user-api-key-status.configured {
    background: #e8f8f1;
    color: #087a4d;
}

.user-api-note {
    margin: 9px 0 20px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
}

.user-api-model-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 22px 0 12px;
}

.user-api-model-toolbar strong,
.user-api-model-toolbar span {
    display: block;
}

.user-api-model-toolbar strong {
    font-size: 15px;
}

.user-api-model-toolbar > div > span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
}

.user-api-fetch,
.user-api-model-add,
.user-api-model-commit,
.user-api-model-cancel,
.user-api-model-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #dbe3ee;
    border-radius: 8px;
    background: #f8fafc;
    color: #526071;
    font-weight: 800;
}

.user-api-fetch {
    min-height: 38px;
    padding: 0 13px;
    white-space: nowrap;
}

.user-api-fetch:hover,
.user-api-model-add:hover {
    border-color: #bdd4fb;
    background: var(--blue-soft);
    color: var(--blue);
}

.user-api-fetch svg,
.user-api-model-add svg,
.user-api-actions svg {
    width: 15px;
    height: 15px;
}

.user-api-model-stack {
    display: grid;
    gap: 18px;
}

.user-api-model-section {
    overflow: hidden;
    border: 1px solid #dfe6f0;
    border-radius: 12px;
    background: #fff;
}

.user-api-model-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px 14px;
    border-bottom: 1px solid #e7ebf1;
}

.user-api-model-section-head strong,
.user-api-model-section-head span {
    display: block;
}

.user-api-model-section-head strong {
    color: var(--text);
    font-size: 14px;
}

.user-api-model-section-head span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
}

.user-api-model-add {
    min-width: 70px;
    min-height: 36px;
    padding: 0 11px;
    flex: 0 0 auto;
}

.user-api-model-list {
    display: grid;
    gap: 7px;
    padding: 4px 18px 18px;
}

.user-api-model-row,
.user-api-model-add-row {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce3ed;
    border-radius: 8px;
    background: #f7f9fc;
    padding: 0 10px 0 14px;
}

.user-api-model-row:first-child,
.user-api-model-add-row:first-child {
    margin-top: 0;
}

.user-api-model-name {
    min-width: 0;
    flex: 1;
    overflow-wrap: anywhere;
    color: #25324a;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 12px;
    line-height: 1.45;
}

.user-api-model-remove,
.user-api-model-commit,
.user-api-model-cancel {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    padding: 0;
    background: transparent;
}

.user-api-model-remove {
    border-color: transparent;
    color: #98a2b3;
}

.user-api-model-remove:hover {
    background: #fee2e2;
    color: #b91c1c;
}

.user-api-model-remove svg,
.user-api-model-commit svg,
.user-api-model-cancel svg {
    width: 15px;
    height: 15px;
}

.user-api-model-add-row {
    border-color: #9fc1fa;
    background: #f6faff;
}

.user-api-model-add-row input {
    min-width: 0;
    height: 36px;
    flex: 1;
    border: 0;
    background: transparent;
    color: var(--text);
    outline: none;
    font: 12px/1.4 ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

.user-api-model-commit {
    border-color: #bfdbfe;
    background: var(--blue-soft);
    color: var(--blue);
}

.user-api-model-cancel {
    border-color: transparent;
    color: #667085;
}

.user-api-model-empty {
    display: grid;
    place-items: center;
    min-height: 62px;
    border: 1px dashed #d9e1ec;
    border-radius: 8px;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 700;
}

#userApiKeyInput {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 13px;
}

.user-api-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.user-api-actions button {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 0;
    border-radius: 8px;
    padding: 0 15px;
    font-weight: 800;
}

.user-api-save {
    background: var(--blue);
    color: #fff;
    box-shadow: 0 8px 18px rgba(47, 125, 246, .18);
}

.user-api-secondary {
    background: #eef2f7;
    color: #334155;
}

.user-api-danger {
    margin-left: auto;
    background: #fef2f2;
    color: #b91c1c;
}

.script-agent-section-title {
    margin-top: 26px;
}

.user-script-agent-card {
    width: 100%;
    min-height: 72px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 9px;
    align-items: center;
    gap: 10px;
    border: 1px solid #d6deea;
    border-radius: 11px;
    background: #fff;
    color: var(--text);
    padding: 11px 12px;
    text-align: left;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.user-script-agent-card:hover {
    border-color: #a9c8fb;
}

.user-script-agent-card.active {
    border-color: var(--blue);
    background: var(--blue-soft);
    box-shadow: inset 3px 0 0 var(--blue);
}

.user-script-agent-card:disabled {
    cursor: not-allowed;
    opacity: .56;
}

.user-script-agent-card + .user-script-agent-card {
    margin-top: 10px;
}

.user-script-agent-card-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid #dbe6f8;
    border-radius: 10px;
    background: #f5f8fe;
    color: var(--blue);
}

.user-script-agent-card-icon svg {
    width: 18px;
    height: 18px;
}

.user-script-agent-card-copy,
.user-script-agent-card-copy strong,
.user-script-agent-card-copy small {
    display: block;
    min-width: 0;
}

.user-script-agent-card-copy strong {
    font-size: 14px;
}

.user-script-agent-card-copy small {
    margin-top: 4px;
    overflow: hidden;
    color: var(--muted);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.script-agent-api-editor {
    display: grid;
    align-content: start;
    gap: 20px;
}

.script-agent-api-editor[hidden] {
    display: none;
}

.script-agent-api-head {
    margin-bottom: 0;
}

.script-agent-api-head p {
    margin-top: 7px;
}

.toonflow-config-stack {
    display: grid;
    gap: 14px;
}

.toonflow-config-block {
    position: relative;
}

.toonflow-config-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.toonflow-span-2 {
    grid-column: 1 / -1;
}

.toonflow-kind-status {
    flex: 0 0 auto;
    border-radius: 999px;
    background: #eef2f7;
    color: #64748b;
    padding: 5px 9px;
    font-size: 11px;
    font-weight: 800;
}

.toonflow-kind-status.configured {
    background: #e8f8ef;
    color: #087a4d;
}

.toonflow-clear-key {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 14px;
    border: 1px solid #f0c9c9;
    border-radius: 8px;
    background: #fff7f7;
    color: #b42318;
    padding: 0 11px;
    font-size: 11px;
    font-weight: 800;
}

.toonflow-clear-key:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.toonflow-clear-key svg {
    width: 14px;
    height: 14px;
}

.script-agent-config-block {
    border: 1px solid #dfe6f0;
    border-radius: 12px;
    background: #fff;
    padding: 18px;
}

.script-agent-config-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.script-agent-config-heading strong,
.script-agent-config-heading span {
    display: block;
}

.script-agent-config-heading strong {
    color: var(--text);
    font-size: 14px;
}

.script-agent-config-heading > div > span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
}

.script-agent-active-note {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    color: #087a4d;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.script-agent-active-note svg {
    width: 14px;
    height: 14px;
}

.script-agent-provider-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.script-agent-provider-option {
    min-height: 82px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #dce3ed;
    border-radius: 11px;
    background: #f8fafc;
    color: var(--text);
    padding: 14px;
    text-align: left;
}

.script-agent-provider-option:hover {
    border-color: #b8d1fb;
    background: #f6f9ff;
}

.script-agent-provider-option.active {
    border-color: var(--blue);
    background: var(--blue-soft);
    box-shadow: 0 0 0 2px rgba(47, 125, 246, .08);
}

.script-agent-provider-mark {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 10px;
    background: #172033;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: -.03em;
}

.script-agent-provider-option[data-script-agent-provider="volcengine"] .script-agent-provider-mark {
    background: #2169ed;
}

.script-agent-provider-option strong,
.script-agent-provider-option small {
    display: block;
}

.script-agent-provider-option strong {
    font-size: 14px;
}

.script-agent-provider-option small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 11px;
}

.script-agent-provider-check {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    margin-left: auto;
    border: 1px solid #cdd6e3;
    border-radius: 50%;
    background: #fff;
    color: transparent;
}

.script-agent-provider-option.active .script-agent-provider-check {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.script-agent-provider-check svg {
    width: 13px;
    height: 13px;
}

.script-agent-base-url {
    margin-top: 12px;
    border-radius: 8px;
    background: #f4f6fa;
    color: #667085;
    padding: 9px 11px;
    font: 11px/1.45 ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    overflow-wrap: anywhere;
}

.script-agent-model-presets {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.script-agent-model-preset {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #dbe3ee;
    border-radius: 8px;
    background: #f8fafc;
    color: #526071;
    padding: 0 11px;
    font-size: 12px;
    font-weight: 800;
}

.script-agent-model-preset.selected {
    border-color: #9fc1fa;
    background: var(--blue-soft);
    color: var(--blue);
}

.script-agent-model-preset svg {
    width: 14px;
    height: 14px;
}

.script-agent-model-list {
    display: grid;
    gap: 7px;
}

.script-agent-model-item {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce3ed;
    border-radius: 8px;
    background: #f7f9fc;
    padding: 0 8px 0 13px;
}

.script-agent-model-item code {
    min-width: 0;
    flex: 1;
    overflow-wrap: anywhere;
    color: #25324a;
    font-size: 12px;
}

.script-agent-model-item button {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #98a2b3;
}

.script-agent-model-item button:hover {
    background: #fee2e2;
    color: #b91c1c;
}

.script-agent-model-item button svg {
    width: 14px;
    height: 14px;
}

.script-agent-model-add-row {
    display: flex;
    gap: 9px;
    margin-top: 10px;
}

.script-agent-model-add-row input {
    min-width: 0;
    height: 40px;
    flex: 1;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    outline: none;
    padding: 0 12px;
    font: 12px/1.4 ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

.script-agent-model-add-row input:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .1);
}

.script-agent-model-add-row button {
    min-width: 106px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #dbe3ee;
    border-radius: 8px;
    background: #f8fafc;
    color: #526071;
    font-weight: 800;
}

.script-agent-model-add-row button:hover {
    border-color: #bdd4fb;
    background: var(--blue-soft);
    color: var(--blue);
}

.script-agent-model-add-row button svg {
    width: 15px;
    height: 15px;
}

.script-agent-default-model {
    margin-top: 14px;
}

#userScriptAgentKeyInput {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 13px;
}

@media (max-width: 920px) {
    .script-agent-provider-options {
        grid-template-columns: 1fr;
    }

    .script-agent-config-heading {
        display: grid;
    }
}

.job-post-modal,
.job-service-modal {
    width: min(860px, calc(100vw - 32px));
    max-height: calc(100vh - 28px);
    overflow: auto;
}
.job-service-modal { width: min(560px, calc(100vw - 32px)); }
.job-post-modal-head { padding-right: 34px; }
.job-post-modal-head > span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
}
.job-post-modal-head h2 { margin-top: 7px; font-size: 24px; letter-spacing: -.03em; }
.job-post-modal-head p { margin-top: 6px; color: var(--muted); line-height: 1.6; }
.job-post-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.job-post-modal label,
.job-service-modal label {
    display: grid;
    gap: 7px;
    margin-top: 15px;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
}
.job-post-modal label em { color: var(--danger); font-size: 10px; font-style: normal; }
.job-post-modal input,
.job-post-modal select,
.job-post-modal textarea,
.job-service-modal input {
    width: 100%;
    border: 1px solid #d7dfeb;
    border-radius: 8px;
    background: #fbfdff;
    color: var(--text);
    padding: 10px 12px;
    outline: none;
    font-weight: 500;
}
.job-post-modal input,
.job-post-modal select,
.job-service-modal input { min-height: 42px; }
.job-post-modal textarea { resize: vertical; line-height: 1.55; }
.job-post-modal input:focus,
.job-post-modal select:focus,
.job-post-modal textarea:focus,
.job-service-modal input:focus {
    border-color: #9fc1fa;
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .08);
}
.job-post-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
    border-top: 1px solid var(--line);
    padding-top: 16px;
}
.job-service-qr-preview {
    min-height: 180px;
    display: grid;
    place-items: center;
    margin-top: 18px;
    border: 1px dashed #cfd9e7;
    border-radius: 12px;
    background: #f8fafc;
}
.job-service-qr-preview img {
    width: 168px;
    height: 168px;
    border-radius: 10px;
    object-fit: contain;
}
.job-service-qr-empty {
    display: grid;
    justify-items: center;
    gap: 9px;
    color: #8b98aa;
    font-size: 12px;
}
.job-service-qr-empty svg { width: 42px; height: 42px; }
.job-service-enabled {
    grid-template-columns: auto 1fr !important;
    align-items: start;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
    padding: 12px;
}
.job-service-enabled input { width: 18px; min-height: 18px; margin: 2px 0 0; }
.job-service-enabled strong,
.job-service-enabled small { display: block; }
.job-service-enabled small { margin-top: 4px; color: var(--muted); font-weight: 500; }

@media (max-width: 1200px) {
    .merchant-list-heading,
    .merchant-order-row {
        grid-template-columns: minmax(220px, 2fr) minmax(122px, .95fr) minmax(100px, .75fr) minmax(100px, .7fr) minmax(132px, 1fr) 118px;
    }
    .merchant-list-heading > span:nth-child(6),
    .merchant-row-updated { display: none; }
    .job-admin-heading,
    .job-admin-row {
        grid-template-columns: minmax(190px, 1.4fr) minmax(110px, .9fr) 65px 72px 95px 86px minmax(165px, 1fr);
    }
    .job-admin-heading > span:nth-child(7),
    .job-admin-row > :nth-child(7) { display: none; }
}

@media (max-width: 1100px) {
    .merchant-list-heading { display: none; }
    .merchant-order-list { padding: 14px; }
    .merchant-order-row {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 10px 16px;
        padding: 15px;
    }
    .merchant-row-main { grid-column: 1; }
    .merchant-row-stage { grid-column: 2; grid-row: 1; }
    .merchant-row-person,
    .merchant-row-money,
    .merchant-row-date {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 100px minmax(0, 1fr);
        gap: 10px;
        border-top: 1px solid #edf0f5;
        padding-top: 9px;
    }
    .merchant-row-person::before,
    .merchant-row-money::before,
    .merchant-row-date::before {
        content: attr(data-label);
        color: #98a2b3;
        font-size: 10px;
        font-weight: 800;
    }
    .merchant-row-person strong,
    .merchant-row-money strong,
    .merchant-row-date strong { grid-column: 2; grid-row: 1; }
    .merchant-row-person small,
    .merchant-row-money small,
    .merchant-row-date small { grid-column: 2; margin-top: -4px; }
    .merchant-row-actions { grid-column: 1 / -1; justify-content: flex-end; }
    .job-admin-heading { display: none; }
    .job-admin-row {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 9px 14px;
        padding: 15px;
    }
    .job-admin-row > :nth-child(n+2):not(.job-admin-actions) {
        display: inline-flex;
        grid-column: 1;
        gap: 6px;
    }
    .job-admin-actions { grid-column: 2; grid-row: 1 / span 6; align-self: center; flex-direction: column; }
}

@media (max-width: 960px) {
    .admin-layout {
        grid-template-columns: 1fr;
    }
    .admin-sidebar {
        position: static;
        height: auto;
    }
    .admin-nav {
        grid-template-columns: repeat(2, 1fr);
    }
    .admin-header,
    .panel-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .split-grid {
        grid-template-columns: 1fr;
    }
.merchant-ops-hero {
        grid-template-columns: 1fr;
    }
    .merchant-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .merchant-job-service-status { min-width: 0; }
    .merchant-channel-switch { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .merchant-ops-guard {
        min-width: 0;
    }
    .merchant-flow-panel {
        display: flex;
        justify-content: flex-start;
        overflow-x: auto;
    }
    .merchant-flow-step {
        min-width: 150px;
    }
    .merchant-ops-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .job-admin-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .job-admin-toolbar { grid-template-columns: 1fr 1fr; }
    .merchant-toolbar,
    .merchant-order-card-body {
        grid-template-columns: 1fr;
    }
    .merchant-order-side {
        border-top: 1px solid #edf0f5;
        border-left: 0;
        padding-top: 14px;
        padding-left: 0;
    }
    .merchant-order-card-head,
    .merchant-order-card-footer,
    .merchant-workspace-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .merchant-order-money { text-align: left; }
    .merchant-order-brief-grid,
    .merchant-form-grid.two-cols {
        grid-template-columns: 1fr;
    }
    .merchant-cover-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .merchant-cover-auto { min-height: 0; }
    .merchant-order-card {
        grid-template-columns: 1fr;
    }
    .merchant-order-actions {
        justify-content: flex-start;
        min-width: 0;
    }
    .merchant-version-heading,
    .merchant-version-meta,
    .merchant-payout-panel {
        align-items: flex-start;
        flex-direction: column;
    }
    .merchant-payout-actions { flex: 0 1 auto; }
    .modal-grid {
        grid-template-columns: 1fr;
    }
    .merchant-review-context { grid-template-columns: 1fr; }
    .merchant-review-actions { grid-template-columns: 1fr; }
    .merchant-detail-modal { width: calc(100vw - 18px); max-height: calc(100vh - 18px); }
    .job-post-form-grid { grid-template-columns: 1fr; }
    .merchant-detail-head { align-items: flex-start; flex-direction: column; gap: 10px; padding: 20px 54px 16px 20px; }
    .merchant-detail-money { min-width: 0; padding: 0; text-align: left; }
    .merchant-detail-content { padding: 14px; }
    .merchant-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .merchant-detail-layout,
    .merchant-detail-brief-grid { grid-template-columns: 1fr; }
    .merchant-detail-footer { align-items: flex-start; flex-direction: column; }
    .merchant-detail-actions { justify-content: flex-start; }
    .user-api-layout {
        grid-template-columns: 1fr;
    }
    .user-api-side {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }
    .user-api-danger {
        margin-left: 0;
    }
    .toonflow-config-grid {
        grid-template-columns: 1fr;
    }
    .toonflow-span-2 {
        grid-column: auto;
    }
    .user-api-model-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    .merchant-order-row { grid-template-columns: 1fr; }
    .merchant-row-main,
    .merchant-row-stage { grid-column: 1; grid-row: auto; }
    .merchant-row-stage small { white-space: normal; }
    .merchant-detail-facts { grid-template-columns: 1fr; }
    .merchant-detail-footer { padding: 12px 14px; }
    .merchant-detail-actions { width: 100%; }
    .merchant-detail-actions button { flex: 1 1 auto; }
}

.admin-nav button {
    display: flex;
    align-items: center;
    gap: 10px;
}

.admin-nav button i {
    width: 18px;
    min-width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #7b8797;
    font-style: normal;
    font-size: 14px;
    line-height: 1;
}

.admin-nav button.active i {
    color: var(--blue);
}

@media (max-width: 640px) {
    .merchant-cover-input-row { grid-template-columns: 1fr; }
    .merchant-cover-upload-btn { width: 100%; }
    .merchant-cover-upload-status { grid-template-columns: 92px minmax(0, 1fr); }
    .merchant-cover-upload-status img { width: 92px; }
}

/* xinl1eng AI 用户配置模块 */
.user-api-provider-card.xinleng-provider strong {
    font-family: "Space Grotesk", Inter, system-ui, sans-serif;
    letter-spacing: -.02em;
}

.user-api-provider-card.xinleng-provider:not(.active) {
    border-color: #d6dce5;
    background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
}

.user-api-provider-capabilities {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
}

.user-api-provider-capabilities[hidden] {
    display: none !important;
}

.user-api-provider-capabilities span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 27px;
    padding: 0 9px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #f8fafc;
    color: var(--muted);
    font-size: 10.5px;
}

.user-api-provider-capabilities strong {
    color: var(--text);
    font-size: 11px;
}

.user-api-fixed-pill {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 0 9px;
    border: 1px solid #d8dee8;
    border-radius: 999px;
    background: #f8fafc;
    color: #475467;
    font-size: 10px;
    font-weight: 900;
}

.user-api-xinleng-fixed-model {
    border-color: #cfd7e3;
    background: linear-gradient(135deg, #fff 0%, #fafbfc 100%);
}

/* 生成计价配置 */
.pricing-panel {
    overflow: hidden;
}

.pricing-page-head {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--line);
}

.pricing-page-actions,
.pricing-page-actions button,
.pricing-overrides-head,
.pricing-rule-head,
.pricing-override-card-head,
.pricing-form-footer,
.pricing-footer-save,
.pricing-secondary-btn {
    display: flex;
    align-items: center;
}

.pricing-page-actions {
    gap: 12px;
}

.pricing-page-actions button,
.pricing-footer-save {
    justify-content: center;
    gap: 8px;
}

.pricing-page-actions button svg,
.pricing-footer-save svg,
.pricing-secondary-btn svg,
.pricing-remove-override svg {
    width: 16px;
    height: 16px;
}

.pricing-version {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #f8fafc;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.pricing-loading {
    min-height: 220px;
    display: grid;
    place-items: center;
    color: var(--muted);
    font-size: 14px;
}

#pricingForm {
    padding: 22px;
}

.pricing-default-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.pricing-rule-card,
.pricing-overrides-section {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfcfe;
}

.pricing-rule-card {
    padding: 20px;
}

.pricing-rule-head {
    gap: 12px;
    margin-bottom: 20px;
}

.pricing-rule-head h3,
.pricing-overrides-head h3 {
    margin: 0;
    color: var(--text);
    font-size: 15px;
}

.pricing-rule-head p,
.pricing-overrides-head p {
    margin-top: 4px;
    font-size: 12px;
}

.pricing-rule-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--blue);
    background: var(--blue-soft);
}

.pricing-rule-icon.video {
    color: #7c3aed;
    background: #f1eafe;
}

.pricing-rule-icon svg {
    width: 18px;
    height: 18px;
}

.pricing-primary-field,
.pricing-identity-grid label,
.pricing-override-base,
.pricing-inline-multipliers label {
    display: grid;
    gap: 7px;
    color: #475467;
    font-size: 12px;
    font-weight: 800;
}

.pricing-input-unit {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 12px;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    background: #fff;
}

.pricing-input-unit:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .10);
}

.pricing-input-unit input {
    min-width: 0;
    flex: 1;
    height: 42px;
    padding: 0 12px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-size: 17px;
    font-weight: 850;
}

.pricing-input-unit span {
    white-space: nowrap;
    color: #98a2b3;
    font-size: 11px;
}

.pricing-video-fields {
    display: grid;
    grid-template-columns: repeat(5, minmax(64px, 1fr));
    gap: 12px;
}

.pricing-subtitle {
    margin: 18px 0 9px;
    color: #475467;
    font-size: 12px;
    font-weight: 850;
}

.pricing-multiplier-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.pricing-multiplier-grid.video {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pricing-multiplier-grid label {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(48px, 1fr);
    align-items: center;
    gap: 6px;
    min-height: 38px;
    padding: 0 6px 0 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
}

.pricing-multiplier-grid input,
.pricing-identity-grid input,
.pricing-override-rule input {
    width: 100%;
    min-width: 0;
    border: 1px solid #d8dee8;
    border-radius: 6px;
    outline: 0;
    background: #fff;
    color: var(--text);
}

.pricing-multiplier-grid input {
    height: 28px;
    padding: 0 5px;
    text-align: center;
    font-size: 12px;
    font-weight: 800;
}

.pricing-multiplier-grid input:focus,
.pricing-identity-grid input:focus,
.pricing-override-rule input:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .09);
}

.pricing-model-table-section {
    margin-top: 18px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}

.pricing-model-table-head,
.pricing-table-toolbar,
.pricing-provider-filter,
.pricing-table-search,
.pricing-table-kind,
.pricing-spec-prices {
    display: flex;
    align-items: center;
}

.pricing-model-table-head {
    justify-content: space-between;
    gap: 20px;
}

.pricing-model-table-head h3 {
    margin: 0;
    color: var(--text);
    font-size: 15px;
}

.pricing-model-table-head p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.pricing-table-count {
    flex: 0 0 auto;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
    border: 1px solid #d8dee8;
    border-radius: 999px;
    background: #f8fafc;
    color: #475467;
    font-size: 11px;
    font-weight: 850;
}

.pricing-table-toolbar {
    gap: 10px;
    margin: 16px 0 12px;
}

.pricing-provider-filter {
    flex: 0 1 300px;
    min-width: 240px;
    gap: 8px;
}

.pricing-provider-filter > span {
    flex: 0 0 auto;
    color: #667085;
    font-size: 12px;
    font-weight: 850;
}

.pricing-provider-filter select {
    min-width: 0;
    flex: 1;
}

.pricing-table-search {
    min-width: 240px;
    flex: 1;
    gap: 8px;
    height: 38px;
    padding: 0 11px;
    border: 1px solid #d8dee8;
    border-radius: 7px;
    background: #fff;
}

.pricing-table-search:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .09);
}

.pricing-table-search svg {
    width: 15px;
    height: 15px;
    color: #98a2b3;
}

.pricing-table-search input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-size: 12px;
}

.pricing-table-toolbar select {
    height: 38px;
    min-width: 128px;
    padding: 0 30px 0 10px;
    border: 1px solid #d8dee8;
    border-radius: 7px;
    outline: 0;
    background: #fff;
    color: #475467;
    font-size: 12px;
    font-weight: 750;
}

.pricing-table-toolbar select:focus {
    border-color: var(--blue);
}

.pricing-table-wrap {
    overflow-x: auto;
    border: 1px solid #e2e7ef;
    border-radius: 8px;
}

.pricing-model-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    background: #fff;
}

.pricing-model-table th {
    height: 40px;
    padding: 0 14px;
    border-bottom: 1px solid #e2e7ef;
    background: #f8fafc;
    color: #667085;
    text-align: left;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .02em;
}

.pricing-model-table td {
    padding: 13px 14px;
    border-bottom: 1px solid #edf0f5;
    color: #475467;
    vertical-align: middle;
    font-size: 12px;
}

.pricing-model-table tr:last-child td {
    border-bottom: 0;
}

.pricing-model-table tbody tr:hover {
    background: #fbfcfe;
}

.pricing-table-model {
    min-width: 230px;
    display: grid;
    gap: 3px;
}

.pricing-table-model > span {
    color: #98a2b3;
    font-size: 10px;
    font-weight: 800;
}

.pricing-table-model strong {
    color: var(--text);
    font-size: 12px;
    line-height: 1.35;
}

.pricing-table-model code {
    max-width: 310px;
    overflow: hidden;
    color: #667085;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pricing-table-kind {
    min-width: 105px;
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
}

.pricing-table-kind > span,
.pricing-source-badge {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
}

.pricing-table-kind > span.image {
    background: #eaf2ff;
    color: #2563eb;
}

.pricing-table-kind > span.video {
    background: #f1eafe;
    color: #7c3aed;
}

.pricing-table-kind small {
    color: #98a2b3;
    font-size: 10px;
}

.pricing-spec-prices {
    min-width: 295px;
    flex-wrap: wrap;
    gap: 6px;
}

.pricing-spec-price {
    min-width: 74px;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 7px;
    padding: 7px 9px;
    border: 1px solid #e2e7ef;
    border-radius: 7px;
    background: #fff;
}

.pricing-spec-price small {
    grid-row: 1 / 3;
    align-self: center;
    color: #667085;
    font-size: 9px;
    font-weight: 900;
}

.pricing-spec-price strong {
    color: var(--text);
    font-size: 13px;
    line-height: 1;
}

.pricing-spec-price em {
    color: #98a2b3;
    font-size: 8px;
    font-style: normal;
}

.pricing-source-badge {
    white-space: nowrap;
    background: #f2f4f7;
    color: #667085;
}

.pricing-source-badge.override {
    background: #eaf2ff;
    color: #2563eb;
}

.pricing-table-edit {
    min-width: 76px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid #cfd7e3;
    border-radius: 7px;
    background: #fff;
    color: #344054;
    font-size: 11px;
    font-weight: 850;
}

.pricing-table-edit:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.pricing-table-empty {
    padding: 42px 20px;
    color: #98a2b3;
    text-align: center;
}

.pricing-overrides-section {
    margin-top: 18px;
    padding: 20px;
}

.pricing-overrides-head {
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}

.pricing-secondary-btn {
    min-height: 36px;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    border: 1px solid #cfd7e3;
    border-radius: 7px;
    background: #fff;
    color: #344054;
    font-size: 12px;
    font-weight: 850;
}

.pricing-secondary-btn:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.pricing-override-list {
    display: grid;
    gap: 12px;
}

.pricing-overrides-empty {
    min-height: 126px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px dashed #d8dee8;
    border-radius: 8px;
    background: #fff;
    color: #98a2b3;
    text-align: center;
}

.pricing-overrides-empty svg {
    width: 20px;
    height: 20px;
}

.pricing-overrides-empty strong {
    color: #475467;
    font-size: 13px;
}

.pricing-overrides-empty span {
    font-size: 11px;
}

.pricing-override-card {
    padding: 15px;
    border: 1px solid #dce2eb;
    border-radius: 9px;
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.pricing-override-card-highlight {
    border-color: var(--blue);
    box-shadow: 0 0 0 4px rgba(47, 125, 246, .10);
}

.pricing-override-card-head {
    justify-content: space-between;
    margin-bottom: 12px;
    color: #344054;
    font-size: 12px;
}

.pricing-remove-override {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: #fff1f2;
    color: var(--danger);
}

.pricing-identity-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.pricing-identity-grid input,
.pricing-override-rule input {
    height: 38px;
    padding: 0 10px;
    font-size: 12px;
}

.pricing-kind-switches {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 13px 0;
}

.pricing-kind-switches label {
    position: relative;
    cursor: pointer;
}

.pricing-kind-switches input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.pricing-kind-switches span {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid #d8dee8;
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
}

.pricing-kind-switches input:checked + span {
    border-color: #9ec5ff;
    background: var(--blue-soft);
    color: var(--blue);
}

.pricing-override-rule {
    display: grid;
    grid-template-columns: minmax(150px, .35fr) minmax(0, 1fr);
    gap: 10px;
    padding: 12px;
    border-top: 1px solid #edf0f5;
}

.pricing-override-rule + .pricing-override-rule {
    margin-top: 4px;
}

.pricing-inline-multipliers {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.pricing-inline-multipliers.video {
    grid-column: 1 / -1;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pricing-inline-multipliers.pricing-video-override-base {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pricing-video-rule {
    grid-template-columns: 1fr;
}

.pricing-choice-block {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
}

.pricing-choice-block > span,
.pricing-video-multiplier-row > span {
    color: #475467;
    font-size: 12px;
    font-weight: 850;
}

.pricing-segmented {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.pricing-segmented label {
    position: relative;
    cursor: pointer;
}

.pricing-segmented input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.pricing-segmented span {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    padding: 0 13px;
    border: 1px solid #d8dee8;
    border-radius: 7px;
    background: #fff;
    color: #667085;
    font-size: 11px;
    font-weight: 850;
}

.pricing-segmented input:checked + span {
    border-color: #9ec5ff;
    background: var(--blue-soft);
    color: var(--blue);
    box-shadow: 0 0 0 1px rgba(47, 125, 246, .08);
}

.pricing-segmented label:focus-within span {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.pricing-segmented label.disabled {
    cursor: not-allowed;
}

.pricing-segmented label.disabled span {
    background: #f2f4f7;
    color: #98a2b3;
}

.pricing-capability-note {
    color: #b54708;
    font-size: 11px;
    line-height: 1.45;
}

.pricing-capability-note.supported {
    color: #027a48;
}

.pricing-fixed-head,
.pricing-fixed-row {
    display: grid;
    grid-template-columns: 76px minmax(120px, .8fr) minmax(140px, 1fr) minmax(100px, .65fr) 34px;
    gap: 8px;
    align-items: center;
}

.pricing-fixed-head {
    padding: 0 6px 7px;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 850;
}

.pricing-fixed-rows {
    display: grid;
    gap: 7px;
}

.pricing-fixed-row {
    padding: 8px;
    border: 1px solid #e2e7ef;
    border-radius: 8px;
    background: #fbfcfe;
}

.pricing-fixed-row > label:not(.pricing-default-radio),
.pricing-continuous-grid label {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
}

.pricing-fixed-row > label:not(.pricing-default-radio) {
    grid-template-columns: minmax(0, 1fr) auto;
}

.pricing-fixed-row > label:not(.pricing-default-radio) > input,
.pricing-continuous-grid input {
    grid-column: 1;
}

.pricing-fixed-row > label:not(.pricing-default-radio) > span,
.pricing-continuous-grid label > span {
    grid-column: 2;
    grid-row: 1;
}

.pricing-default-radio {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #475467;
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.pricing-default-radio input {
    width: 16px;
    height: 16px;
    padding: 0;
    accent-color: var(--blue);
}

.pricing-fixed-row > button {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid #fecdd3;
    border-radius: 7px;
    background: #fff1f2;
    color: var(--danger);
}

.pricing-fixed-row > button svg,
.pricing-add-duration svg {
    width: 14px;
    height: 14px;
}

.pricing-add-duration {
    min-height: 34px;
    margin-top: 9px;
    padding: 0 11px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px dashed #b7c1d1;
    border-radius: 7px;
    background: #fff;
    color: #475467;
    font-size: 11px;
    font-weight: 850;
}

.pricing-add-duration:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.pricing-continuous-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.pricing-continuous-grid label {
    padding: 9px;
    border: 1px solid #e2e7ef;
    border-radius: 8px;
    background: #fbfcfe;
}

.pricing-video-multiplier-row {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 8px;
    margin-top: 14px;
}

.pricing-video-multiplier-row > span {
    width: 100%;
}

.pricing-video-multiplier-row label {
    display: grid;
    gap: 5px;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
}

.pricing-video-multiplier-row input,
.pricing-video-multiplier-row select {
    width: 100px;
    height: 34px;
    padding: 0 8px;
    border: 1px solid #d8dee8;
    border-radius: 7px;
    background: #fff;
    color: var(--text);
}

.pricing-video-multiplier-row .pricing-preview-resolution {
    margin-inline-start: auto;
}

.pricing-user-preview {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid #dce2eb;
    border-radius: 9px;
    background: #f8fafc;
    color: var(--text);
}

.pricing-user-preview-head,
.pricing-slider-preview-summary,
.pricing-slider-preview-scale,
.pricing-slider-preview-rate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pricing-user-preview-head {
    margin-bottom: 12px;
    color: #667085;
    font-size: 11px;
    font-weight: 850;
}

.pricing-user-preview-head em {
    padding: 3px 7px;
    border-radius: 6px;
    background: #e9eef6;
    color: #475467;
    font-size: 10px;
    font-style: normal;
}

.pricing-fixed-preview-options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
    gap: 7px;
}

.pricing-fixed-preview-options > div {
    min-height: 58px;
    display: grid;
    place-items: center;
    gap: 3px;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    background: #fff;
}

.pricing-fixed-preview-options > div.active {
    border-color: var(--blue);
    box-shadow: 0 0 0 1px var(--blue);
}

.pricing-fixed-preview-options strong,
.pricing-slider-preview-summary strong {
    font-size: 14px;
}

.pricing-fixed-preview-options span,
.pricing-slider-preview-rate span,
.pricing-slider-preview-scale {
    color: #98a2b3;
    font-size: 10px;
}

.pricing-slider-preview-summary {
    font-variant-numeric: tabular-nums;
}

.pricing-slider-preview-summary strong,
.pricing-slider-preview-summary span {
    color: var(--text);
    font-size: 15px;
    font-weight: 850;
}

.pricing-user-preview input[type="range"] {
    width: 100%;
    height: 24px;
    margin: 8px 0 0;
    accent-color: var(--blue);
}

.pricing-slider-preview-rate {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e2e7ef;
    font-size: 11px;
}

.pricing-preview-loading,
.pricing-preview-error,
.pricing-preview-inherit {
    min-height: 44px;
    display: grid;
    place-items: center;
    color: #667085;
    font-size: 11px;
    text-align: center;
}

.pricing-preview-error {
    color: var(--danger);
}

.pricing-form-footer {
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.pricing-form-footer .form-message {
    margin: 0;
}

.pricing-footer-save {
    min-height: 40px;
    padding: 0 18px;
    border: 0;
    border-radius: 8px;
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 850;
    box-shadow: 0 8px 18px rgba(47, 125, 246, .18);
}

.pricing-page-actions button:disabled,
.pricing-footer-save:disabled {
    cursor: wait;
    opacity: .6;
}

@media (max-width: 1180px) {
    .pricing-default-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
    .credit-management-hero { align-items: stretch; flex-direction: column; padding: 20px; }
    .admin-credit-bypass-badge { min-width: 0; }
    .credit-management-stats { grid-template-columns: 1fr; }
    #pricingForm { padding: 14px; }
    .pricing-page-actions,
    .pricing-model-table-head,
    .pricing-table-toolbar,
    .pricing-overrides-head,
    .pricing-form-footer { align-items: stretch; flex-direction: column; }
    .pricing-page-actions button,
    .pricing-footer-save { width: 100%; }
    .pricing-provider-filter,
    .pricing-table-search,
    .pricing-table-toolbar select { width: 100%; min-width: 0; }
    .pricing-video-fields,
    .pricing-identity-grid { grid-template-columns: 1fr; }
    .pricing-multiplier-grid.video,
    .pricing-inline-multipliers.video { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pricing-override-rule { grid-template-columns: 1fr; }
    .pricing-inline-multipliers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pricing-continuous-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pricing-fixed-head { display: none; }
    .pricing-fixed-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pricing-default-radio,
    .pricing-fixed-row > button { justify-self:start; }
    .pricing-video-multiplier-row .pricing-preview-resolution { margin-inline-start: 0; }
}

/* 模型商集中 API 管理 */
.model-api-panel {
    min-height: 680px;
}

.model-api-migration {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 18px 24px 0;
    border: 1px solid #f4d8a3;
    border-radius: 10px;
    background: #fffbeb;
    color: #92400e;
    padding: 13px 15px;
    font-size: 13px;
    line-height: 1.55;
}

.model-api-migration.is-ready {
    border-color: #a7e5ca;
    background: #ecfdf5;
    color: #08734a;
}

.model-api-migration svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin-top: 1px;
}

.model-api-migration strong {
    display: block;
    margin-bottom: 2px;
}

.model-api-layout {
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    min-height: 560px;
    margin-top: 18px;
    border-top: 1px solid var(--line);
}

.model-api-provider-side {
    border-right: 1px solid var(--line);
    background: #fbfdff;
    padding: 18px;
}

.model-api-side-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.model-api-side-heading strong {
    font-size: 14px;
}

.model-api-side-heading span {
    color: var(--muted);
    font-size: 11px;
}

.model-api-provider-list {
    display: grid;
    gap: 8px;
}

.model-api-provider-card {
    width: 100%;
    min-height: 66px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    color: var(--text);
    padding: 11px 12px;
    text-align: left;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.model-api-provider-card:hover,
.model-api-provider-card.active {
    border-color: #9ec5ff;
    background: var(--blue-soft);
}

.model-api-provider-card.active {
    box-shadow: inset 3px 0 0 var(--blue);
}

.model-api-provider-card.disabled {
    opacity: .62;
}

.model-api-provider-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.model-api-provider-copy strong,
.model-api-provider-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.model-api-provider-copy strong {
    font-size: 13px;
}

.model-api-provider-copy small {
    color: var(--muted);
    font-size: 11px;
}

.model-api-provider-badge {
    min-width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #eef2f7;
    color: #475467;
    font-size: 11px;
    font-weight: 900;
}

.model-api-provider-card.active .model-api-provider-badge {
    background: var(--blue);
    color: #fff;
}

.model-api-main {
    min-width: 0;
    padding: 22px 24px 28px;
}

.model-api-workspace-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.model-api-workspace-head p {
    line-height: 1.55;
}

.model-api-workspace-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.model-api-publish-video {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #8bbcff;
    border-radius: 8px;
    background: #eef6ff;
    color: #1769d2;
    padding: 0 14px;
    font-size: 12px;
    font-weight: 850;
    box-shadow: 0 7px 18px rgba(47, 125, 246, .12);
}

.model-api-publish-video:hover:not(:disabled) {
    border-color: var(--blue);
    background: #e2efff;
    color: #0b57b7;
}

.model-api-publish-video.is-active {
    border-color: #77d2ad;
    background: #eafaf3;
    color: #08734a;
    box-shadow: 0 7px 18px rgba(10, 145, 91, .1);
}

.model-api-publish-video svg {
    width: 15px;
    height: 15px;
}

.model-api-workspace-head button {
    flex: 0 0 auto;
}

.model-api-workspace-head button:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.model-api-credential-list {
    display: grid;
    gap: 12px;
    margin-top: 12px;
}

.model-api-credential-card {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 90px auto;
    align-items: center;
    gap: 18px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    padding: 16px;
}

.model-api-credential-card.is-disabled {
    background: #f8fafc;
}

.model-api-credential-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
}

.model-api-status-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #98a2b3;
    box-shadow: 0 0 0 4px #f2f4f7;
}

.model-api-status-dot.active {
    background: var(--green);
    box-shadow: 0 0 0 4px #dff7ec;
}

.model-api-credential-main div {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.model-api-credential-main strong,
.model-api-credential-main span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.model-api-credential-main strong {
    font-size: 14px;
}

.model-api-credential-main span {
    color: var(--muted);
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 11px;
}

.model-api-bound-count {
    display: grid;
    justify-items: center;
    gap: 2px;
    border-left: 1px solid var(--line);
}

.model-api-bound-count strong {
    font-size: 20px;
}

.model-api-bound-count span {
    color: var(--muted);
    font-size: 10px;
}

.model-api-credential-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 6px;
}

.model-api-credential-actions button {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    color: #344054;
    padding: 0 9px;
    font-size: 11px;
    font-weight: 800;
}

.model-api-credential-actions button:hover {
    border-color: #9ec5ff;
    color: var(--blue);
}

.model-api-credential-actions button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.model-api-credential-actions button.danger {
    color: var(--danger);
}

.model-api-credential-actions svg {
    width: 14px;
    height: 14px;
}

.model-api-empty-card {
    min-height: 220px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    background: #fbfdff;
    color: var(--muted);
    text-align: center;
}

.model-api-empty-card svg {
    width: 34px;
    height: 34px;
    margin-bottom: 5px;
    color: var(--blue);
}

.model-api-empty-card strong {
    color: var(--text);
}

.model-api-business-config {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 14px;
}

.model-api-business-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--panel);
    padding: 14px;
}

.model-api-business-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--blue-soft);
    color: var(--blue);
}

.model-api-business-icon svg {
    width: 20px;
    height: 20px;
}

.model-api-business-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.model-api-business-copy strong {
    font-size: 14px;
}

.model-api-business-copy span {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}

.model-api-business-card > button {
    min-height: 36px;
    border: 1px solid #b8d5ff;
    border-radius: 8px;
    background: var(--blue-soft);
    color: var(--blue);
    padding: 0 12px;
    font-size: 11px;
    font-weight: 850;
}

.model-api-business-card > button:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(15, 23, 42, .48);
    backdrop-filter: blur(3px);
}

.model-api-dialog-card {
    width: min(510px, calc(100vw - 32px));
}

.model-api-binding-card {
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
}

.model-api-business-dialog-card {
    width: min(780px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
}

.toonflow-business-dialog-card {
    width: min(920px, calc(100vw - 32px));
}

.model-api-business-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.model-api-business-fields label,
.toonflow-business-channels label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
}

.model-api-business-fields select,
.toonflow-business-channels select {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    color: var(--text);
    padding: 0 10px;
}

.model-api-business-users-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
}

.model-api-business-users-head strong {
    font-size: 13px;
}

.model-api-business-users-head span {
    color: var(--muted);
    font-size: 11px;
}

.toonflow-business-channels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.toonflow-business-channels section {
    display: grid;
    gap: 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--bg);
    padding: 12px;
}

.toonflow-business-channels section > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.toonflow-business-channels section > div strong {
    font-size: 13px;
}

.toonflow-business-channels .toonflow-provider-select {
    width: auto;
    min-width: 118px;
    max-width: 170px;
    min-height: 30px;
    padding: 0 28px 0 9px;
    font-size: 11px;
    font-weight: 800;
}

.toonflow-business-channels section > div span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 800;
}

.model-api-model-card {
    width: min(820px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
}

.model-api-model-toolbar {
    display: flex;
    align-items: flex-end;
    gap: 12px;
}

.model-api-model-toolbar .model-api-user-search {
    flex: 1 1 auto;
}

.model-api-model-bulk-actions {
    display: flex;
    gap: 7px;
    padding-bottom: 1px;
}

.model-api-model-bulk-actions button {
    min-height: 40px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: #344054;
    padding: 0 13px;
    font-size: 12px;
    font-weight: 800;
}

.model-api-model-bulk-actions button:hover:not(:disabled) {
    border-color: #9ec5ff;
    color: var(--blue);
}

.model-api-model-bulk-actions button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.model-api-model-list {
    min-height: 220px;
    max-height: min(500px, calc(100vh - 310px));
    overflow: auto;
    margin-top: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
    padding: 10px;
}

.model-api-model-name-hint {
    margin: 4px 0 0;
    color: #667085;
    font-size: 11px;
    line-height: 1.5;
}

.model-api-model-group {
    display: grid;
    gap: 6px;
}

.model-api-model-group + .model-api-model-group {
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid var(--line);
}

.model-api-model-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px 3px;
}

.model-api-model-group-head strong {
    font-size: 12px;
}

.model-api-model-group-head span {
    color: var(--muted);
    font-size: 11px;
}

.model-api-model-option {
    display: grid !important;
    grid-template-columns: auto minmax(150px, .9fr) minmax(180px, 1.1fr) auto;
    align-items: center;
    gap: 10px !important;
    margin: 0 !important;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #fff;
    padding: 10px 11px;
    color: var(--text) !important;
    cursor: pointer;
}

.model-api-model-option:hover {
    border-color: #b8d5ff;
    background: #f5f9ff;
}

.model-api-model-option input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: var(--blue);
}

.model-api-model-option .model-api-model-id {
    min-width: 0;
    overflow: hidden;
    color: #243047;
    font-family: "JetBrains Mono", Consolas, monospace;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.model-api-model-option .model-api-model-alias {
    width: 100%;
    min-width: 0;
    height: 34px;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #d8dee9;
    border-radius: 7px;
    background: #fff;
    padding: 0 10px;
    color: var(--text);
    font-size: 12px;
}

.model-api-model-option .model-api-model-alias:focus {
    border-color: #7db3ff;
    box-shadow: 0 0 0 3px rgba(47, 126, 247, .11);
    outline: 0;
}

.model-api-model-option .model-api-model-alias:disabled {
    background: #f2f4f7;
    color: #98a2b3;
}

.model-api-model-option .model-api-model-note {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.model-api-model-option small {
    border-radius: 999px;
    background: var(--blue-soft);
    color: var(--blue);
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 800;
}

.modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.modal-head > button {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    border: 0;
    border-radius: 8px;
    background: #f2f4f7;
    color: #475467;
    font-size: 22px;
    line-height: 1;
}

.modal-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 18px;
}

.modal-actions button {
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    padding: 0 16px;
    font-weight: 800;
}

.modal-actions button.primary {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.model-api-key-hint,
.model-api-binding-summary {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

.model-api-user-search {
    position: relative;
    display: block !important;
    margin-top: 16px !important;
}

.model-api-user-search svg {
    position: absolute;
    left: 12px;
    top: 12px;
    z-index: 1;
    width: 17px;
    height: 17px;
    color: #98a2b3;
}

.model-api-user-search input {
    padding-left: 38px;
}

.model-api-binding-users {
    min-height: 180px;
    max-height: min(430px, calc(100vh - 300px));
    display: grid;
    align-content: start;
    gap: 7px;
    overflow: auto;
    margin-top: 12px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fbfdff;
    padding: 9px;
}

.model-api-user-option {
    display: grid !important;
    grid-template-columns: auto 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px !important;
    margin: 0 !important;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #fff;
    padding: 10px 11px;
    color: var(--text) !important;
    cursor: pointer;
}

.model-api-user-option:hover,
.model-api-user-option.is-current {
    border-color: #b8d5ff;
    background: #f5f9ff;
}

.model-api-user-option input {
    width: 16px;
    height: 16px;
    margin: 0;
}

.model-api-user-avatar {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: var(--blue-soft);
    color: var(--blue);
    font-size: 13px;
    font-weight: 900;
}

.model-api-user-copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.model-api-user-copy strong,
.model-api-user-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.model-api-user-copy strong {
    font-size: 13px;
}

.model-api-user-copy small {
    color: var(--muted);
    font-size: 11px;
}

.model-api-user-status {
    color: var(--green);
    font-size: 11px;
    font-weight: 850;
}

.model-api-user-status.disabled {
    color: var(--danger);
}

@media (max-width: 1100px) {
    .model-api-credential-card {
        grid-template-columns: minmax(200px, 1fr) 80px;
    }

    .model-api-credential-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
        padding-top: 10px;
        border-top: 1px solid var(--line);
    }
}

@media (max-width: 760px) {
    .model-api-migration { margin: 14px 14px 0; }
    .model-api-business-config { grid-template-columns: 1fr; }
    .model-api-business-fields,
    .toonflow-business-channels { grid-template-columns: 1fr; }
    .model-api-layout { grid-template-columns: 1fr; }
    .model-api-provider-side { border-right: 0; border-bottom: 1px solid var(--line); }
    .model-api-provider-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .model-api-main { padding: 18px 14px 22px; }
    .model-api-workspace-head { align-items: flex-start; flex-direction: column; }
    .model-api-workspace-actions { width: 100%; justify-content: flex-start; }
    .model-api-model-toolbar { align-items: stretch; flex-direction: column; }
    .model-api-model-bulk-actions { padding-bottom: 0; }
    .model-api-model-bulk-actions button { flex: 1 1 0; }
    .model-api-model-option { grid-template-columns: auto minmax(0, 1fr) auto; }
    .model-api-model-option .model-api-model-alias { grid-column: 2 / -1; width: 100%; }
    .model-api-credential-card { grid-template-columns: 1fr auto; gap: 14px; }
    .model-api-bound-count { border-left: 0; }
    .model-api-user-option { grid-template-columns: auto 34px minmax(0, 1fr); }
    .model-api-user-status { display: none; }
}

@media (max-width: 480px) {
    .model-api-business-card { grid-template-columns: 42px minmax(0, 1fr); }
    .model-api-business-card > button { grid-column: 1 / -1; }
    .model-api-provider-list { grid-template-columns: 1fr; }
    .model-api-credential-card { grid-template-columns: 1fr; }
    .model-api-bound-count { justify-items: start; }
    .model-api-credential-actions button { flex: 1 1 calc(50% - 6px); justify-content: center; }
}

/* User error log console */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    clip-path: inset(50%) !important;
}

.error-log-channel-switcher {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.error-log-channel-switcher button {
    display: grid;
    gap: 5px;
    min-height: 78px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel);
    color: var(--text);
    padding: 15px 18px;
    text-align: left;
    box-shadow: 0 7px 22px rgba(15, 23, 42, .04);
}

.error-log-channel-switcher button:hover {
    border-color: #b8cff2;
    background: #fbfdff;
}

.error-log-channel-switcher button.active {
    border-color: var(--blue);
    background: linear-gradient(135deg, #f7fbff, #eef5ff);
    box-shadow: 0 0 0 1px rgba(47, 125, 246, .08), 0 10px 24px rgba(47, 125, 246, .1);
}

.error-log-channel-switcher button:focus-visible {
    outline: 3px solid rgba(47, 125, 246, .17);
    outline-offset: 2px;
}

.error-log-channel-switcher span {
    font-size: 15px;
    font-weight: 900;
}

.error-log-channel-switcher small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.error-log-channel-panel[hidden] {
    display: none;
}

.error-log-metrics .summary-card {
    min-height: 108px;
}

.generation-error-total-metric::after {
    background: #fee2e2;
}

.generation-error-image-metric::after {
    background: #dbeafe;
}

.generation-error-video-metric::after {
    background: #ede9fe;
}

.error-log-server-metric::after {
    background: #fee2e2;
}

.error-log-client-metric::after {
    background: #f3e8ff;
}

.error-log-load-status {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.error-log-filter {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) repeat(3, minmax(130px, 160px)) auto;
    align-items: center;
    gap: 10px;
}

.generation-error-filter {
    grid-template-columns: minmax(280px, 1fr) repeat(2, minmax(140px, 170px)) auto;
}

.error-log-filter label {
    margin: 0;
}

.error-log-filter input,
.error-log-filter select {
    width: 100%;
}

.error-log-filter button {
    min-height: 42px;
    border: 0;
    border-radius: 8px;
    background: var(--blue);
    color: #fff;
    padding: 0 20px;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(47, 125, 246, .16);
}

.error-log-filter input:focus,
.error-log-filter select:focus,
.error-log-filter button:focus-visible,
.error-log-detail-btn:focus-visible {
    border-color: var(--blue);
    outline: 3px solid rgba(47, 125, 246, .17);
    outline-offset: 1px;
}

.error-log-table {
    min-width: 1180px;
}

.generation-error-table {
    min-width: 1280px;
}

.error-log-table td {
    max-width: 300px;
}

.error-log-table td strong,
.error-log-table td small {
    display: block;
}

.error-log-table td small {
    max-width: 180px;
    overflow: hidden;
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.error-log-row.is-server td:first-child {
    box-shadow: inset 3px 0 0 #dc2626;
}

.error-log-row.is-request td:first-child {
    box-shadow: inset 3px 0 0 #d97706;
}

.error-log-row.is-frontend td:first-child {
    box-shadow: inset 3px 0 0 #7c3aed;
}

.generation-error-row td:first-child {
    box-shadow: inset 3px 0 0 #dc2626;
}

.error-log-time {
    width: 170px;
    color: #475467;
    white-space: nowrap;
}

.error-log-source,
.error-log-code {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: 850;
    white-space: nowrap;
}

.error-log-source {
    margin-right: 5px;
    background: #eef2f7;
    color: #475467;
}

.error-log-code.is-server {
    background: #fee2e2;
    color: #b42318;
}

.error-log-code.is-request {
    background: #fff3d6;
    color: #a15c00;
}

.error-log-code.is-frontend {
    background: #f3e8ff;
    color: #6d28d9;
}

.error-log-path,
.error-log-message,
.error-log-request-id {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.generation-error-canvas,
.generation-error-context,
.generation-error-message {
    min-width: 0;
}

.generation-error-canvas strong,
.generation-error-context small,
.generation-error-message strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.generation-error-canvas strong {
    max-width: 220px;
}

.generation-error-context {
    width: 245px;
}

.generation-error-context strong {
    margin-top: 7px;
    font-size: 12px;
}

.generation-error-context small {
    max-width: 230px !important;
}

.generation-error-type {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border-radius: 999px;
    padding: 3px 9px;
    background: #eaf2ff;
    color: #175cd3;
    font-size: 11px;
    font-weight: 850;
}

.generation-error-type.is-video {
    background: #f3e8ff;
    color: #7c3aed;
}

.generation-error-type.is-workflow {
    background: #e8f8f1;
    color: #08785a;
}

.generation-error-duration {
    color: #475467;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.generation-error-message {
    width: 310px;
}

.generation-error-message span {
    display: inline-flex;
    margin-bottom: 5px;
    border-radius: 999px;
    background: #fee2e2;
    color: #b42318;
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 850;
}

.generation-error-message strong {
    max-width: 290px;
    color: #7a271a;
    font-size: 12px;
    font-weight: 700;
}

.error-log-path,
.error-log-message {
    max-width: 300px;
}

.error-log-request-id {
    display: block;
    max-width: 150px;
    color: #475467;
    font-size: 11px;
}

.error-log-detail-btn {
    min-height: 32px;
    border: 1px solid #cfe0fb;
    border-radius: 7px;
    background: #f6f9ff;
    color: var(--blue);
    padding: 0 12px;
    font-weight: 800;
}

.error-log-detail-btn:hover {
    border-color: var(--blue);
    background: var(--blue-soft);
}

.error-log-modal {
    width: min(920px, calc(100vw - 32px)) !important;
    max-height: calc(100vh - 48px);
    overflow: auto;
}

.error-log-detail-head {
    padding-right: 38px;
}

.error-log-detail-head > span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

.error-log-detail-head h2 {
    margin-top: 7px;
}

.error-log-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 20px 0 0;
}

.error-log-detail-item {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fbfdff;
    padding: 12px 14px;
}

.error-log-detail-item.is-full {
    grid-column: 1 / -1;
}

.error-log-detail-item dt {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.error-log-detail-item dd {
    margin: 6px 0 0;
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 13px;
    line-height: 1.6;
}

.error-log-stack {
    margin-top: 14px;
}

.error-log-stack h3 {
    margin: 0 0 8px;
    font-size: 14px;
}

.error-log-stack pre {
    max-height: 300px;
    overflow: auto;
    margin: 0;
    border-radius: 9px;
    background: #111827;
    color: #dbeafe;
    padding: 15px;
    font: 12px/1.65 ui-monospace, SFMono-Regular, Consolas, monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .error-log-filter {
        grid-template-columns: minmax(250px, 1fr) repeat(2, minmax(130px, 1fr));
    }

    .error-log-filter #errorLogPeriod,
    .error-log-filter button {
        width: 100%;
    }

    .generation-error-filter {
        grid-template-columns: minmax(250px, 1fr) repeat(2, minmax(130px, 1fr));
    }

    .generation-error-filter .error-log-search {
        grid-column: 1 / -1;
    }

    .generation-error-filter button {
        grid-column: auto;
    }
}

@media (max-width: 700px) {
    .error-log-channel-switcher {
        grid-template-columns: 1fr;
    }

    .error-log-filter {
        grid-template-columns: 1fr;
    }

    .generation-error-filter button {
        grid-column: auto;
    }

    .generation-error-filter .error-log-search {
        grid-column: auto;
    }

    .error-log-detail-grid {
        grid-template-columns: 1fr;
    }

    .error-log-detail-item.is-full {
        grid-column: auto;
    }
}

/* 代理与团队：沿用管理端浅色设计变量，避免该模块成为孤立的深色页面。 */
.agent-admin-hero {
    border-color: #d9e4f4;
    background: radial-gradient(circle at 86% 14%, rgba(47,125,246,.16), transparent 34%), linear-gradient(135deg, #fff, #f5f9ff);
}
.agent-admin-hero h2,
.agent-admin-security strong { color: var(--text); }
.agent-admin-hero p,
.agent-admin-security small { color: var(--muted); }
.agent-admin-hero > div:first-child > span { color: var(--blue); }
.agent-admin-security { border-color: #cfe0f5; background: rgba(232,242,255,.75); }
.agent-admin-stats article,
.agent-application-item,
.agent-admin-card { border-color: var(--line); background: var(--panel); box-shadow: var(--shadow); }
.agent-application-item small,
.agent-application-item p,
.agent-admin-card-head small,
.agent-admin-metrics span { color: var(--muted); }
.agent-admin-avatar { background: var(--blue-soft); color: var(--blue); }
.agent-admin-metrics span { border-color: var(--line); background: #f8faff; }
.agent-admin-metrics strong { color: var(--text); }
.agent-api-form select,
.agent-api-form input { border-color: var(--line); background: #fff; color: var(--text); }
.agent-api-form button { background: var(--blue); color: #fff; }
.agent-card-actions { margin-top: 12px; }
.agent-admin-filter,
.agent-ledger-filter { margin: 0 0 16px; }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; color: var(--muted); font-size: 13px; }
.pagination > div { display: flex; gap: 8px; }
.pagination button { border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); padding: 7px 12px; }
.pagination button:disabled { cursor: not-allowed; opacity: .45; }
.agent-detail-modal { max-height: 88vh; overflow: auto; }
.agent-detail-summary { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin: 16px 0; }
.agent-detail-summary article { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #f8faff; }
.agent-detail-summary span,
.agent-detail-summary small { display: block; color: var(--muted); font-size: 12px; }
.agent-detail-summary strong { display: block; margin: 7px 0 3px; font-size: 18px; }
.agent-detail-section { margin-top: 18px; }
.agent-detail-section h3 { margin: 0 0 10px; font-size: 15px; }
.agent-detail-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.agent-detail-row,
.agent-detail-credentials article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.agent-detail-credentials small { display: block; margin-top: 4px; color: var(--muted); }
.agent-detail-credentials button { border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); padding: 7px 11px; }
.agent-team-binding-card { width: min(860px, calc(100vw - 32px)); max-height: 88vh; overflow: auto; }
.agent-team-binding-users { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; max-height: 260px; overflow: auto; margin: 12px 0; }
.agent-team-binding-user { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; }
.agent-team-binding-user input,
.agent-team-model-fieldset input { width: auto; }
.agent-team-binding-user strong,
.agent-team-binding-user small { display: block; }
.agent-team-binding-user small { color: var(--muted); }
.agent-team-binding-models { display: grid; gap: 10px; }
.agent-team-model-fieldset { border: 1px solid var(--line); border-radius: 10px; padding: 10px; }
.agent-team-model-fieldset legend { padding: 0 6px; color: var(--muted); font-size: 12px; }
.agent-team-model-fieldset > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.agent-team-model-fieldset label { display: flex; align-items: flex-start; gap: 8px; overflow-wrap: anywhere; }
@media (max-width: 720px) {
    .agent-team-binding-users,
    .agent-team-model-fieldset > div { grid-template-columns: 1fr; }
}
@media (max-width: 800px) {
    .agent-detail-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .agent-detail-columns { grid-template-columns: 1fr; }
}

/* 仪表盘用户用量：沿用现有卡片、表格和按钮体系。 */
.overview-output {
    display: grid;
    justify-items: end;
    gap: 2px;
}

.overview-output span {
    font-size: 10px;
    font-weight: 800;
}

.overview-output strong {
    font-size: 16px;
}

.user-usage-panel {
    margin-top: 20px;
}

.user-usage-head-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-usage-user-types {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #f8fafc;
    padding: 3px;
}

.user-usage-user-types button {
    min-height: 34px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--muted);
    padding: 0 14px;
    font-size: 12px;
    font-weight: 850;
}

.user-usage-user-types button.active {
    background: var(--panel);
    color: var(--blue);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
}

.user-usage-user-types button:focus-visible {
    outline: 3px solid rgba(47, 125, 246, .22);
    outline-offset: 2px;
}

.user-usage-head-actions > span {
    color: var(--muted);
    font-size: 12px;
}

.user-usage-head-actions button:disabled {
    cursor: wait;
    opacity: .55;
}

.user-usage-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 18px 24px 8px;
}

.user-usage-metrics article {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8faff;
    padding: 16px;
}

.user-usage-metrics span,
.user-usage-metrics strong {
    display: block;
}

.user-usage-metrics span {
    min-height: 34px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
}

.user-usage-metrics strong {
    margin-top: 7px;
    color: var(--text);
    font-size: 24px;
}

.user-usage-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 14px 24px 18px;
    border-bottom: 1px solid var(--line);
}

.user-usage-periods {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #f8fafc;
    padding: 3px;
}

.user-usage-periods button {
    min-height: 34px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--muted);
    padding: 0 13px;
    font-size: 12px;
    font-weight: 800;
}

.user-usage-periods button.active {
    background: var(--panel);
    color: var(--blue);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
}

.user-usage-search {
    flex: 1 1 260px;
    min-width: min(260px, 100%);
}

.user-usage-search input {
    width: 100%;
    min-height: 42px;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: var(--panel);
    color: var(--text);
    padding: 0 12px;
    outline: none;
}

.user-usage-search input:focus,
.user-usage-periods button:focus-visible,
.user-usage-table th button:focus-visible,
.user-usage-pagination button:focus-visible,
.user-usage-detail-btn:focus-visible {
    outline: 3px solid rgba(47, 125, 246, .22);
    outline-offset: 2px;
}

.user-usage-used-only {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.user-usage-used-only input {
    width: 16px;
    height: 16px;
    accent-color: var(--blue);
}

.user-usage-state {
    margin: 18px 24px;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    background: #fbfdff;
    color: var(--muted);
    padding: 24px;
    text-align: center;
}

.user-usage-state.is-error {
    border-color: #f4b4b4;
    background: #fff7f7;
    color: #b42318;
}

.user-usage-table,
.user-usage-detail-table {
    min-width: 1180px;
}

.user-usage-table th button {
    border: 0;
    background: transparent;
    color: inherit;
    padding: 0;
    font-size: inherit;
    font-weight: inherit;
}

.user-usage-table tbody tr:hover,
.user-usage-detail-table tbody tr:hover {
    background: #fbfdff;
}

.user-usage-user,
.user-usage-output,
.user-usage-available,
.user-usage-model {
    display: grid;
    gap: 4px;
}

.user-usage-user span,
.user-usage-model span,
.user-usage-inline-note,
.user-usage-muted {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
}

.user-usage-output span,
.user-usage-available span {
    color: #475467;
    font-size: 12px;
    white-space: nowrap;
}

.user-usage-source-list,
.user-usage-anomalies {
    display: flex;
    align-items: flex-start;
    gap: 5px;
    flex-wrap: wrap;
}

.user-usage-source,
.user-usage-anomalies span,
.user-usage-status,
.user-usage-ok {
    display: inline-flex;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #f8fafc;
    color: #475467;
    padding: 5px 7px;
    font-size: 11px;
    font-weight: 800;
}

.user-usage-source {
    flex-direction: column;
    gap: 2px;
}

.user-usage-source small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 600;
}

.user-usage-source.is-team {
    border-color: #c9daf5;
    background: #f5f9ff;
    color: #245caa;
}

.user-usage-source.is-admin_exempt {
    border-color: #d4d8e1;
    background: #f5f6f8;
    color: #344054;
}

.user-usage-anomalies span {
    border-color: #f3c1c1;
    background: #fff7f7;
    color: #b42318;
}

.user-usage-ok,
.user-usage-status.is-committed {
    border-color: #b7e4cf;
    background: #f1fbf6;
    color: #067647;
}

.user-usage-status.is-reserved {
    border-color: #f4d39b;
    background: #fffaeb;
    color: #b54708;
}

.user-usage-status.is-released {
    border-color: #f3c1c1;
    background: #fff7f7;
    color: #b42318;
}

.user-usage-coverage {
    min-height: 20px;
    padding: 12px 24px 4px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}

.user-usage-pagination {
    color: var(--muted);
    font-size: 12px;
}

.user-usage-pagination > div {
    display: flex;
    gap: 7px;
}

.user-usage-pagination button {
    min-height: 34px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    color: var(--text);
    padding: 0 12px;
    font-weight: 800;
}

.user-usage-pagination button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.user-usage-detail-modal {
    width: min(1180px, calc(100vw - 32px)) !important;
}

.user-usage-detail-head {
    position: relative;
    min-height: 76px;
    padding-right: 360px;
}

.user-usage-detail-head > span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

.user-usage-detail-head h2 {
    margin-top: 7px;
}

.user-usage-detail-actions {
    position: absolute;
    top: 5px;
    right: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.user-usage-detail-total {
    display: grid;
    gap: 3px;
    min-width: 112px;
    padding: 8px 11px;
    border: 1px solid #d8e0ec;
    border-radius: 8px;
    background: #f8faff;
}

.user-usage-detail-total span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.user-usage-detail-total strong {
    color: var(--text);
    font-size: 15px;
    white-space: nowrap;
}

.user-usage-detail-export {
    min-height: 38px;
    border: 1px solid #cfd7e3;
    border-radius: 8px;
    background: var(--panel);
    color: var(--blue);
    padding: 0 14px;
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}

.user-usage-detail-export:hover:not(:disabled) {
    border-color: var(--blue);
    background: var(--blue-soft);
}

.user-usage-detail-export:focus-visible {
    outline: 3px solid rgba(47, 125, 246, .22);
    outline-offset: 2px;
}

.user-usage-detail-export:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.user-usage-detail-table-wrap {
    margin-top: 18px;
    border: 1px solid var(--line);
    border-radius: 10px;
}

.user-usage-detail-table code {
    display: block;
    max-width: 190px;
    overflow: hidden;
    color: #475467;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-usage-detail-modal .user-usage-pagination {
    padding: 16px 0 0;
}

@media (max-width: 1100px) {
    .user-usage-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .user-usage-head,
    .user-usage-head-actions {
        align-items: flex-start;
    }

    .user-usage-head,
    .user-usage-head-actions,
    .user-usage-toolbar {
        flex-direction: column;
    }

    .user-usage-head-actions,
    .user-usage-user-types,
    .user-usage-search,
    .user-usage-used-only,
    .user-usage-periods {
        width: 100%;
    }

    .user-usage-user-types {
        margin-left: 0;
    }

    .user-usage-user-types button {
        flex: 1 1 0;
    }

    .user-usage-search {
        flex: 0 0 auto;
        min-width: 0;
    }

    .user-usage-head-actions button {
        width: 100%;
    }

    .user-usage-periods button {
        flex: 1 1 0;
    }

    .user-usage-metrics {
        grid-template-columns: 1fr;
    }

    .user-usage-detail-head {
        min-height: 0;
        padding-right: 40px;
    }

    .user-usage-detail-actions {
        position: static;
        align-items: stretch;
        margin-top: 14px;
    }

    .user-usage-detail-total,
    .user-usage-detail-export {
        flex: 1 1 0;
    }
}

@media (max-width: 700px) {
    .referral-admin-actions { width: 100%; justify-content: stretch; }
    .referral-admin-actions button { flex: 1 1 140px; }
    .referral-admin-filter { display: grid; grid-template-columns: 1fr; }
    .referral-admin-filter select { min-width: 0; width: 100%; }
    .referral-section-head { align-items: flex-start; flex-direction: column; gap: 6px; }
    .referral-pager { justify-content: center; }
    .referral-registration-code-head { flex-direction: column; }
    .referral-registration-code-head button { width: 100%; }
}

/* 管理端深色基础：仅覆盖现有语义颜色与本次仪表盘组件，不改变布局或交互。 */
@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --bg: #0f1420;
        --panel: #171e2b;
        --text: #eef3fb;
        --muted: #9ca9bc;
        --line: #2b3545;
        --blue: #6aa6ff;
        --blue-soft: #1c3150;
        --danger: #ff7b7b;
        --green: #5bd3a1;
        --shadow: 0 10px 28px rgba(0, 0, 0, .24);
    }

    .admin-sidebar,
    .tool-view,
    .modal-card {
        background: var(--panel);
    }

    .admin-nav button {
        color: #b7c2d3;
    }

    th,
    .user-usage-periods,
    .user-usage-user-types,
    .user-usage-state,
    .overview-item,
    .empty-state,
    .user-usage-metrics article,
    .user-usage-detail-total {
        background: #121926;
    }

    th,
    .user-usage-output span,
    .user-usage-available span,
    .user-usage-detail-table code {
        color: #aeb9ca;
    }

    .filter-row input,
    .filter-row select,
    .upload-form input,
    .modal-card input,
    .modal-card select,
    .modal-card textarea,
    .user-usage-search input,
    .user-usage-periods button.active,
    .user-usage-user-types button.active,
    .user-usage-pagination button,
    .user-usage-detail-export {
        border-color: var(--line);
        background: #1b2432;
        color: var(--text);
    }

    .user-usage-table tbody tr:hover,
    .user-usage-detail-table tbody tr:hover {
        background: #1a2230;
    }

    .user-usage-source,
    .user-usage-anomalies span,
    .user-usage-status,
    .user-usage-ok {
        border-color: #374256;
        background: #202938;
        color: #c4cede;
    }

    .user-usage-source.is-team {
        border-color: #315886;
        background: #172b44;
        color: #91bfff;
    }

    .user-usage-source.is-admin_exempt {
        border-color: #465064;
        background: #232a36;
        color: #d1d7e2;
    }

    .user-usage-anomalies span,
    .user-usage-status.is-released,
    .user-usage-state.is-error {
        border-color: #704040;
        background: #351f25;
        color: #ff9b9b;
    }

    .user-usage-ok,
    .user-usage-status.is-committed {
        border-color: #285f4b;
        background: #16342a;
        color: #75deb0;
    }

    .user-usage-status.is-reserved {
        border-color: #71572d;
        background: #342a18;
        color: #f2c66d;
    }

    .membership-confirm-button {
        border-color: #315886;
        background: #172b44;
        color: #91bfff;
    }

    .membership-confirm-button:hover { background: #1d3859; }

    .tag.member {
        background: #16342a;
        color: #75deb0;
    }

    .tag.free {
        background: #232a36;
        color: #9ca9bc;
    }

    .membership-expiry { color: #8b98ab; }

    .membership-current-grid > div,
    .membership-edit-actions button,
    .membership-duration-button {
        border-color: var(--line);
        background: #1b2432;
        color: var(--text);
    }

    .membership-edit-user > span { background: #172b44; color: #91bfff; }
    .membership-edit-lock { border-color: #315886; background: #172b44; color: #b8d6ff; }
    .membership-duration-button:hover { background: #223047; }
    .membership-edit-actions button.primary { border-color: var(--blue); background: var(--blue); color: #0b1626; }
    .membership-edit-actions button.danger { border-color: #704040; background: #351f25; color: #ff9b9b; }

    .recharge-stat,
    .referral-registration-code-panel,
    .panel-head .referral-admin-actions .secondary,
    .referral-pager button {
        border-color: var(--line);
        background: #1b2432;
        color: var(--text);
    }

    .referral-registration-code-panel { background: #151e2b; }
    .referral-registration-code-copy { border-color: var(--line); background: #1b2432; color: var(--text); }

    .referral-pending-orders {
        border-color: #6a4b28;
        background: #2b2319;
    }

    .referral-pending-title {
        border-color: #6a4b28;
        color: #f2c66d;
    }

    .referral-pending-list article {
        border-color: #4e3d28;
    }

    .referral-risk-flag {
        border-color: #71572d;
        background: #342a18;
        color: #f2c66d;
    }

    .referral-withdrawal-risk { background: #211c16; }
    .referral-withdrawal-actions button { border-color: var(--line); background: #1b2432; color: var(--text); }
    .referral-withdrawal-actions button.danger { border-color: #704040; background: #351f25; color: #ff9b9b; }
}
/* Persistent in-app messaging. */
.admin-inbox-hero {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    margin-bottom: 20px;
    padding: 24px;
    border: 1px solid var(--border, rgba(255,255,255,.1));
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(52,105,161,.12), rgba(255,255,255,.025));
}
.admin-inbox-hero span { color: var(--accent, #67b7ff); font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.admin-inbox-hero h2 { margin: 7px 0 5px; }
.admin-inbox-hero p, .admin-inbox-hero small { color: var(--muted, #8f98a7); line-height: 1.6; }
.admin-inbox-hero aside { max-width: 330px; padding: 14px 16px; border: 1px solid var(--border, rgba(255,255,255,.1)); border-radius: 13px; }
.admin-inbox-hero aside strong, .admin-inbox-hero aside small { display: block; }
.admin-inbox-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.admin-inbox-form { display: grid; align-content: start; gap: 14px; }
.admin-inbox-form label { display: grid; gap: 7px; color: var(--muted, #9aa2af); font-size: 13px; }
.admin-inbox-form input, .admin-inbox-form select, .admin-inbox-form textarea { width: 100%; }
.admin-inbox-form textarea { resize: vertical; }
.admin-inbox-form .form-message { min-height: 20px; margin: 0; color: var(--muted, #9aa2af); font-size: 13px; }
.admin-inbox-history { margin-top: 18px; }

@media (max-width: 860px) {
    .admin-inbox-hero { align-items: stretch; flex-direction: column; }
    .admin-inbox-hero aside { max-width: none; }
    .admin-inbox-grid { grid-template-columns: 1fr; }
}