/* Admin page styles — single owner.
 * Loaded after desktop-shell.css. UI-only polish: contrast, type, layout.
 * Does not change business data or markup semantics.
 */

:root {
  --admin-bg: #0d1119;
  --admin-surface: #151b24;
  --admin-surface-2: #1a222d;
  --admin-border: #2d3a48;
  --admin-border-strong: #405264;
  --admin-text: #edf4f5;
  --admin-text-secondary: #c3d0d2;
  --admin-text-muted: #91a1a6;
  --admin-accent: #58dfd0;
  --admin-accent-soft: #173532;
  --admin-accent-border: #2f9f95;
  --admin-danger: #f0a398;
  --admin-font: "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --admin-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

body.desktop-light {
  --admin-bg: #eef3f1;
  --admin-surface: #ffffff;
  --admin-surface-2: #f5f8f7;
  --admin-border: #c9d5d1;
  --admin-border-strong: #aebdb8;
  --admin-text: #15201d;
  --admin-text-secondary: #3a4a46;
  --admin-text-muted: #5a6b66;
  --admin-accent: #0f8f82;
  --admin-accent-soft: #e4f5f2;
  --admin-accent-border: #1a9e90;
  --admin-danger: #c44b3c;
}

/* ── Portal / Dashboard / Payment / Access hosts ── */
#desktop-admin-portal,
#desktop-admin-dashboard,
#desktop-admin-payment-orders,
#desktop-admin-student-access,
#desktop-admin-mount-error {
  position: fixed;
  inset: 0 0 0 var(--desktop-left-width);
  z-index: 82;
  overflow-y: auto;
  box-sizing: border-box;
  background:
    radial-gradient(920px 420px at 8% -8%, rgba(61, 217, 200, .08), transparent 58%),
    linear-gradient(180deg, #0a100e 0%, var(--admin-bg) 42%);
  color: var(--admin-text);
  font-family: var(--admin-font);
  -webkit-font-smoothing: antialiased;
}
body.desktop-nav-collapsed #desktop-admin-portal,
body.desktop-nav-collapsed #desktop-admin-dashboard,
body.desktop-nav-collapsed #desktop-admin-payment-orders,
body.desktop-nav-collapsed #desktop-admin-student-access,
body.desktop-nav-collapsed #desktop-admin-mount-error { left: 0; }
body.route-has-context:not(.context-collapsed) #desktop-admin-portal,
body.route-has-context:not(.context-collapsed) #desktop-admin-dashboard,
body.route-has-context:not(.context-collapsed) #desktop-admin-payment-orders,
body.route-has-context:not(.context-collapsed) #desktop-admin-student-access,
body.route-has-context:not(.context-collapsed) #desktop-admin-mount-error { right: var(--desktop-right-width); }
body.desktop-light #desktop-admin-portal,
body.desktop-light #desktop-admin-dashboard,
body.desktop-light #desktop-admin-payment-orders,
body.desktop-light #desktop-admin-student-access,
body.desktop-light #desktop-admin-mount-error {
  background:
    radial-gradient(900px 400px at 10% -10%, rgba(15, 143, 130, .1), transparent 55%),
    linear-gradient(180deg, #f7fbfa 0%, var(--admin-bg) 40%);
  color: var(--admin-text);
}

#desktop-admin-payment-orders > div,
#desktop-admin-student-access > div {
  color: inherit;
}
#desktop-admin-payment-orders [data-payment-orders-summary],
#desktop-admin-payment-orders article {
  background: var(--admin-surface) !important;
  border-color: var(--admin-border) !important;
  color: var(--admin-text) !important;
}
#desktop-admin-payment-orders [data-payment-orders-summary] {
  border-color: rgba(217, 154, 50, .55) !important;
  background: rgba(177, 122, 22, .16) !important;
  color: #f5dfad !important;
}

#desktop-admin-payment-orders .payment-ledger-shell { width:min(1440px, calc(100% - 56px)); margin:0 auto; padding:34px 0 64px; }
#desktop-admin-payment-orders .payment-ledger-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; padding:0 0 22px; border-bottom:1px solid var(--admin-border); }
#desktop-admin-payment-orders .payment-ledger-page-head > div:first-child { max-width:760px; }
#desktop-admin-payment-orders .payment-ledger-page-head > div:first-child > span,#desktop-admin-payment-orders .payment-order-history > header span { display:block; color:#f0b84a; font-size:10px; font-weight:800; letter-spacing:.13em; }
#desktop-admin-payment-orders .payment-ledger-page-head h1 { margin:8px 0 7px; font-size:30px; letter-spacing:-.035em; }
#desktop-admin-payment-orders .payment-ledger-page-head p { margin:0; color:var(--admin-text-secondary); font-size:13px; line-height:1.65; }
#desktop-admin-payment-orders .payment-ledger-page-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
#desktop-admin-payment-orders .payment-ledger-page-actions button,#desktop-admin-payment-orders .payment-ledger-page-actions a { min-height:36px; padding:0 11px; display:inline-flex; align-items:center; border:1px solid var(--admin-border-strong); border-radius:8px; background:transparent; color:var(--admin-text-secondary); font:700 12px var(--admin-font); text-decoration:none; cursor:pointer; }
#desktop-admin-payment-orders .payment-ledger-page-actions [data-payment-orders-focus-pending] { border-color:#d9a14a; background:rgba(240,184,74,.14); color:#f5d08d; }
#desktop-admin-payment-orders .payment-ledger-page-actions a:first-of-type { border-color:var(--admin-accent-border); color:var(--admin-accent); }
#desktop-admin-payment-orders [data-payment-orders-summary] { margin-top:18px; padding:16px 18px; border-radius:12px; }
#desktop-admin-payment-orders [data-payment-orders-result] { margin-top:14px; padding:14px 16px; border:1px solid #9fd4bf; border-radius:10px; background:#e8f7f2; color:#145a40; }
#desktop-admin-payment-orders [data-payment-orders-result][hidden] { display:none; }
#desktop-admin-payment-orders .payment-ops-alerts { margin-top:18px; overflow:hidden; border:1px solid var(--admin-border); border-radius:14px; background:var(--admin-surface); }
#desktop-admin-payment-orders .payment-ops-alerts > header { display:flex; justify-content:space-between; align-items:end; gap:18px; padding:17px 20px 14px; border-bottom:1px solid var(--admin-border); background:linear-gradient(110deg,rgba(240,184,74,.08),transparent 55%); }
#desktop-admin-payment-orders .payment-ops-alerts header span { display:block; color:#f0b84a; font:800 10px/1 var(--admin-mono); letter-spacing:.12em; }
#desktop-admin-payment-orders .payment-ops-alerts h2 { margin:7px 0 0; font-size:18px; letter-spacing:-.02em; }
#desktop-admin-payment-orders .payment-ops-alerts header small { color:var(--admin-text-muted); font-size:11px; }
#desktop-admin-payment-orders .payment-ops-alert-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; background:var(--admin-border); }
#desktop-admin-payment-orders .payment-ops-alert-grid > * { min-width:0; min-height:106px; padding:15px 16px; border:0; background:var(--admin-surface-2); color:var(--admin-text); text-align:left; }
#desktop-admin-payment-orders .payment-ops-alert-grid button { cursor:pointer; transition:background .16s ease; }
#desktop-admin-payment-orders .payment-ops-alert-grid button:hover { background:#25323d; }
#desktop-admin-payment-orders .payment-ops-alert-grid b { display:block; overflow:hidden; color:var(--admin-text); font-size:22px; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
#desktop-admin-payment-orders .payment-ops-alert-grid span { display:block; margin-top:6px; color:var(--admin-text-secondary); font-size:12px; font-weight:750; }
#desktop-admin-payment-orders .payment-ops-alert-grid small { display:block; margin-top:5px; color:var(--admin-text-muted); font-size:10px; line-height:1.35; }
#desktop-admin-payment-orders .payment-ops-alert-grid .is-pending b { color:#f2c35c; }
#desktop-admin-payment-orders .payment-ops-alert-grid .is-ending b { color:#f19a83; }
#desktop-admin-payment-orders .payment-ops-alert-grid .is-new b { color:var(--admin-accent); }
#desktop-admin-payment-orders .payment-ops-alert-grid .is-ultra b { color:#f1cb78; }
#desktop-admin-payment-orders .payment-ops-usage { background:linear-gradient(135deg,rgba(67,123,176,.18),var(--admin-surface-2)); }
#desktop-admin-payment-orders .payment-workbench-tabs { display:flex; align-items:center; gap:8px; margin-top:18px; padding:7px; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-surface); }
#desktop-admin-payment-orders .payment-workbench-tabs button,#desktop-admin-payment-orders .payment-workbench-tabs a { min-height:34px; padding:0 12px; border:0; border-radius:8px; background:transparent; color:var(--admin-text-muted); font:750 12px var(--admin-font); text-decoration:none; cursor:pointer; }
#desktop-admin-payment-orders .payment-workbench-tabs button.active { background:var(--admin-accent); color:#09231f; }
#desktop-admin-payment-orders .payment-workbench-tabs a { margin-left:auto; border:1px solid #c9a24a; color:#f1c86f; }
#desktop-admin-student-access .student-access-quick-grants { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:6px 0 2px; padding:10px; border:1px solid var(--admin-border); border-radius:9px; background:var(--admin-surface-2); }
#desktop-admin-student-access .student-access-quick-grants > span { width:100%; color:var(--admin-text-muted); font-size:11px; font-weight:800; }
#desktop-admin-student-access .student-access-quick-grants button { min-height:31px; padding:0 9px; border:1px solid var(--admin-accent-border); border-radius:7px; background:transparent; color:var(--admin-accent); font:750 11px var(--admin-font); cursor:pointer; }
#desktop-admin-student-access .student-access-quick-grants button:hover { background:rgba(88,223,208,.12); }
#desktop-admin-student-access .student-access-quick-grants button.is-selected { border-color:var(--admin-accent); background:var(--admin-accent); color:#09231f; box-shadow:0 0 0 2px rgba(88,223,208,.16); }
#desktop-admin-student-access .student-access-quick-grants.is-ultra { border-color:rgba(201,162,74,.48); background:linear-gradient(110deg,rgba(201,162,74,.13),var(--admin-surface-2) 58%); }
#desktop-admin-student-access .student-access-quick-grants.is-ultra > span { color:#f1cb78; }
#desktop-admin-student-access .student-access-quick-grants.is-ultra button { border-color:#b99143; color:#f1cb78; }
#desktop-admin-student-access .student-access-quick-grants.is-ultra button:hover { background:rgba(201,162,74,.15); }
#desktop-admin-student-access .student-access-quick-grants.is-ultra button.is-selected { border-color:#e1b958; background:#c9a24a; color:#241a05; box-shadow:0 0 0 2px rgba(201,162,74,.17); }

/* Access editor is an operations workspace, not a light-theme mobile form.
 * Keep the account list visible and release the right assistant rail while
 * administrators are changing permissions. */
#desktop-admin-student-access { right: 0 !important; }
#desktop-admin-student-access > div { width:min(1480px, calc(100% - 56px)) !important; max-width:none !important; margin:0 auto !important; padding:34px 28px 58px !important; }
#desktop-admin-student-access > div > header { align-items:center !important; }
#desktop-admin-student-access > div > header h1 { color:var(--admin-text) !important; letter-spacing:-.03em; }
#desktop-admin-student-access > div > header p { max-width:720px; color:var(--admin-text-secondary) !important; line-height:1.6; }
#desktop-admin-student-access > div > section { grid-template-columns:minmax(340px,.8fr) minmax(0,1.6fr) !important; gap:16px !important; margin-top:20px !important; align-items:start; }
#desktop-admin-student-access [data-student-access-form],
#desktop-admin-student-access > div > section > section { box-sizing:border-box; border:1px solid var(--admin-border) !important; border-radius:14px !important; background:var(--admin-surface) !important; color:var(--admin-text) !important; box-shadow:0 16px 32px rgba(0,0,0,.14); }
#desktop-admin-student-access [data-student-access-form] { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0 12px; padding:20px !important; }
#desktop-admin-student-access [data-student-access-form]::before { content:"MEMBERSHIP ACTION"; grid-column:1 / -1; margin:-2px 0 8px; color:var(--admin-accent); font:800 10px/1 var(--admin-mono); letter-spacing:.12em; }
#desktop-admin-student-access [data-student-access-form] h2,
#desktop-admin-student-access [data-student-access-form] > p,
#desktop-admin-student-access [data-student-access-form] > button { grid-column:1 / -1; }
#desktop-admin-student-access [data-student-access-form] h2 { color:var(--admin-text) !important; }
#desktop-admin-student-access .student-access-flow-hint { margin:0 0 10px !important; color:var(--admin-text-muted) !important; font-size:11px; line-height:1.5; }
#desktop-admin-student-access [data-student-access-form] label { color:var(--admin-text-secondary) !important; font-size:12px; font-weight:700; }
#desktop-admin-student-access [data-student-access-form] label small { display:block; margin-top:3px; color:var(--admin-text-muted); font-size:10px; font-weight:600; line-height:1.4; }
#desktop-admin-student-access [data-student-access-form] label:first-of-type { grid-column:1 / -1; }
#desktop-admin-student-access [data-student-access-form] label:first-of-type { position:relative; }
#desktop-admin-student-access [data-student-access-form] input,
#desktop-admin-student-access [data-student-access-form] select { min-height:42px; border:1px solid var(--admin-border-strong) !important; border-radius:8px !important; background:var(--admin-surface-2) !important; color:var(--admin-text) !important; font:600 13px var(--admin-font) !important; }
#desktop-admin-student-access [data-student-access-form] input::placeholder { color:var(--admin-text-muted); }
#desktop-admin-student-access .student-access-account-picker { position:absolute; z-index:8; top:100%; right:0; left:0; max-height:244px; overflow:auto; margin-top:-2px; border:1px solid var(--admin-accent-border); border-radius:9px; background:#16212a; box-shadow:0 16px 34px rgba(0,0,0,.36); }
#desktop-admin-student-access .student-access-account-picker[hidden] { display:none; }
#desktop-admin-student-access .student-access-account-picker button { display:block; width:100%; padding:10px 12px; border:0; border-top:1px solid var(--admin-border); background:transparent; color:var(--admin-text); text-align:left; cursor:pointer; }
#desktop-admin-student-access .student-access-account-picker button:first-child { border-top:0; }
#desktop-admin-student-access .student-access-account-picker button:hover { background:rgba(88,223,208,.12); }
#desktop-admin-student-access .student-access-account-picker strong { display:block; font-size:12px; }
#desktop-admin-student-access .student-access-account-picker small { display:block; margin-top:3px; color:var(--admin-text-muted); font-size:10px; font-weight:600; }
#desktop-admin-student-access [data-student-access-form] > button { min-height:42px; border-radius:9px !important; background:var(--admin-accent) !important; color:#09231f !important; cursor:pointer; }
#desktop-admin-student-access [data-student-access-status] { color:var(--admin-text-secondary) !important; }
#desktop-admin-student-access > div > section > section { min-width:0; padding:20px !important; }
#desktop-admin-student-access > div > section > section h2 { color:var(--admin-text) !important; }
#desktop-admin-student-access > div > section > section p,
#desktop-admin-student-access [data-student-access-list] { color:var(--admin-text-secondary) !important; }
#desktop-admin-student-access [data-student-access-refresh] { min-height:36px; padding:0 12px !important; border:1px solid var(--admin-accent-border) !important; border-radius:8px !important; background:transparent !important; color:var(--admin-accent) !important; font-weight:700; cursor:pointer; }
#desktop-admin-student-access .student-access-roster-tools { display:grid; grid-template-columns:minmax(0,1fr) 122px auto; align-items:center; gap:8px; margin-top:16px; }
#desktop-admin-student-access .student-access-roster-tools input,#desktop-admin-student-access .student-access-roster-tools select { min-width:0; min-height:36px; padding:0 10px; border:1px solid var(--admin-border-strong); border-radius:8px; background:var(--admin-surface-2); color:var(--admin-text); font:600 12px var(--admin-font); }
#desktop-admin-student-access .student-access-roster-tools small { color:var(--admin-text-muted); font-size:11px; white-space:nowrap; }
#desktop-admin-student-access [data-student-access-list] { max-height:calc(100vh - 260px); overflow:auto !important; border:1px solid var(--admin-border); border-radius:10px; background:var(--admin-surface-2); }
#desktop-admin-student-access [data-student-access-list] table { min-width:760px !important; margin:0; background:var(--admin-surface-2) !important; color:var(--admin-text) !important; }
#desktop-admin-student-access [data-student-access-list] th { position:sticky; top:0; z-index:1; padding:12px 14px !important; background:#202b36 !important; color:var(--admin-text-muted) !important; font-size:11px; text-align:left; }
#desktop-admin-student-access [data-student-access-list] td { padding:13px 14px !important; border-color:var(--admin-border) !important; color:var(--admin-text-secondary) !important; }
#desktop-admin-student-access [data-student-access-list] tr { border-color:var(--admin-border) !important; }
#desktop-admin-student-access [data-student-access-list] tr:hover td { background:rgba(88,223,208,.06); }
#desktop-admin-student-access [data-student-access-list] tr.is-ultra td:first-child { box-shadow:inset 3px 0 0 #c9a24a; }
#desktop-admin-student-access [data-student-access-list] tr.is-ultra td:nth-child(2) strong { color:#f1cb78 !important; }
#desktop-admin-student-access [data-student-access-list] tr.is-ending td:nth-child(3) { color:#f3c45c !important; }
#desktop-admin-student-access [data-student-access-list] strong { color:var(--admin-text) !important; }
#desktop-admin-student-access [data-student-access-list] small { color:var(--admin-text-muted) !important; }
#desktop-admin-student-access .student-access-select { min-height:30px; padding:0 9px; border:1px solid var(--admin-accent-border); border-radius:7px; background:transparent; color:var(--admin-accent); font:700 11px var(--admin-font); white-space:nowrap; cursor:pointer; }
#desktop-admin-student-access .student-access-select:hover { background:rgba(88,223,208,.12); }
@media (max-width:1120px) {
  #desktop-admin-student-access > div > section { grid-template-columns:1fr !important; }
  #desktop-admin-student-access [data-student-access-list] { max-height:520px; }
}
@media (max-width:640px) {
  #desktop-admin-student-access > div { width:calc(100% - 28px) !important; padding:22px 0 40px !important; }
  #desktop-admin-student-access > div > header { align-items:flex-start !important; flex-direction:column; }
  #desktop-admin-student-access [data-student-access-form] { grid-template-columns:1fr; }
  #desktop-admin-student-access .student-access-roster-tools { grid-template-columns:1fr; }
}

/* Membership operations ledger: one row per student, with the payment
 * history kept as a second, auditable section below. */
#desktop-admin-payment-orders .payment-student-ledger {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: var(--admin-surface);
}
#desktop-admin-payment-orders .payment-student-ledger > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 22px;
  border-bottom: 1px solid var(--admin-border);
  background: linear-gradient(110deg, rgba(88,223,208,.10), rgba(88,223,208,0));
}
#desktop-admin-payment-orders .payment-student-ledger header span {
  display: block;
  color: var(--admin-accent);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
}
#desktop-admin-payment-orders .payment-student-ledger h2 { margin: 6px 0 4px; font-size: 19px; }
#desktop-admin-payment-orders .payment-student-ledger p { margin: 0; color: var(--admin-text-muted); font-size: 12px; }
#desktop-admin-payment-orders .payment-ledger-filters { display:flex; gap:8px; flex:0 0 auto; }
#desktop-admin-payment-orders .payment-ledger-filters input,
#desktop-admin-payment-orders .payment-ledger-filters select {
  min-height: 36px;
  border: 1px solid var(--admin-border-strong);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--admin-surface-2);
  color: var(--admin-text);
  font: 600 12px var(--admin-font);
}
#desktop-admin-payment-orders .payment-student-head,
#desktop-admin-payment-orders .payment-student-row {
  display: grid;
  grid-template-columns: minmax(146px,1.05fr) minmax(110px,.76fr) minmax(148px,.95fr) minmax(100px,.68fr) minmax(120px,.82fr) auto;
  gap: 14px;
  align-items: center;
}
#desktop-admin-payment-orders .payment-student-head { padding: 10px 22px; color: var(--admin-text-muted); font-size: 11px; font-weight: 700; }
#desktop-admin-payment-orders .payment-student-row { padding: 14px 22px; border-top: 1px solid var(--admin-border); }
#desktop-admin-payment-orders .payment-ledger-metrics { display:flex; flex-wrap:wrap; gap:8px; padding:12px 22px; border-bottom:1px solid var(--admin-border); background:rgba(0,0,0,.08); }
#desktop-admin-payment-orders .payment-ledger-metrics span { display:inline-flex; align-items:baseline; gap:5px; padding:5px 9px; border-radius:999px; background:var(--admin-surface-2); color:var(--admin-text-muted); font-size:11px; }
#desktop-admin-payment-orders .payment-ledger-metrics b { color:var(--admin-text); font-size:14px; }
#desktop-admin-payment-orders .payment-student-group > header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:13px 22px; border-top:1px solid var(--admin-border); background:rgba(88,223,208,.055); }
#desktop-admin-payment-orders .payment-student-group:first-child > header { border-top:0; }
#desktop-admin-payment-orders .payment-student-group > header strong { display:block; color:var(--admin-text); font-size:13px; }
#desktop-admin-payment-orders .payment-student-group > header small { display:block; margin-top:3px; color:var(--admin-text-muted); font-size:11px; }
#desktop-admin-payment-orders .payment-student-group > header > b { flex:0 0 auto; padding:5px 8px; border-radius:999px; background:rgba(88,223,208,.13); color:var(--admin-accent); font-size:11px; }
#desktop-admin-payment-orders .payment-student-row:hover { background: rgba(88,223,208,.045); }
#desktop-admin-payment-orders .payment-student-row.is-pending { box-shadow:inset 3px 0 0 #f2b84b; }
#desktop-admin-payment-orders .payment-student-row.is-active { box-shadow:inset 3px 0 0 #49d59e; }
#desktop-admin-payment-orders .payment-student-row.is-expired { box-shadow:inset 3px 0 0 #ee8b71; }
#desktop-admin-payment-orders .payment-student-row.is-free { box-shadow:inset 3px 0 0 #6f7e91; }
#desktop-admin-payment-orders .payment-student-row strong,
#desktop-admin-payment-orders .payment-student-row b { display:block; font-size:13px; color:var(--admin-text); }
#desktop-admin-payment-orders .payment-student-row small { display:block; margin-top:5px; color:var(--admin-text-muted); font-size:11px; line-height:1.35; }
#desktop-admin-payment-orders .payment-student-account strong { font-size:14px; }
#desktop-admin-payment-orders .payment-student-account em { display:inline-block; min-width:35px; margin-right:7px; color:var(--admin-accent); font:700 11px var(--admin-mono); font-style:normal; }
#desktop-admin-payment-orders .payment-membership-tag { width:max-content; padding:4px 8px; border-radius:999px; background:rgba(88,223,208,.14); color:var(--admin-accent) !important; font-size:11px !important; }
#desktop-admin-payment-orders .payment-membership-tag.is-free { background:rgba(145,161,166,.15); color:var(--admin-text-secondary) !important; }
#desktop-admin-payment-orders .payment-membership-tag.is-ultra { background:rgba(201,162,74,.16); color:#f1cb78 !important; }
#desktop-admin-payment-orders .payment-expiry.is-active strong { color:#54d7a2; }
#desktop-admin-payment-orders .payment-expiry.is-soon strong { color:#f4c65a; }
#desktop-admin-payment-orders .payment-expiry.is-expired strong { color:#f19a83; }
#desktop-admin-payment-orders .payment-expiry.is-empty strong { color:var(--admin-text-muted); }
#desktop-admin-payment-orders .payment-register strong { color:#c6d2dc; }
#desktop-admin-payment-orders .payment-question-usage strong { color:#9bbce1; }
#desktop-admin-payment-orders .payment-question-usage small { max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#desktop-admin-payment-orders .payment-student-actions { display:flex; gap:7px; justify-content:flex-end; }
#desktop-admin-payment-orders .payment-student-actions a,
#desktop-admin-payment-orders .payment-student-actions button { padding:7px 9px; border:1px solid var(--admin-accent-border); border-radius:7px; background:transparent; color:var(--admin-accent); font:700 12px var(--admin-font); text-decoration:none; white-space:nowrap; cursor:pointer; }
#desktop-admin-payment-orders .payment-student-actions button { border:0; background:var(--admin-accent); color:#09231f; }
#desktop-admin-payment-orders .payment-student-empty { padding:28px 22px !important; }

#desktop-admin-payment-orders .payment-order-history { overflow:hidden; border:1px solid var(--admin-border); border-radius:14px; background:var(--admin-surface); }
#desktop-admin-payment-orders .payment-order-history > header { display:flex; align-items:end; justify-content:space-between; gap:20px; padding:20px 22px; border-bottom:1px solid var(--admin-border); background:linear-gradient(110deg, rgba(240,184,74,.1), transparent 62%); }
#desktop-admin-payment-orders .payment-order-history h2 { margin:6px 0 4px; font-size:18px; }
#desktop-admin-payment-orders .payment-order-history p { margin:0; color:var(--admin-text-muted); font-size:12px; }
#desktop-admin-payment-orders .payment-order-filters { display:flex; gap:8px; }
#desktop-admin-payment-orders .payment-order-filters input,#desktop-admin-payment-orders .payment-order-filters select { min-height:36px; border:1px solid var(--admin-border-strong); border-radius:8px; padding:0 10px; background:var(--admin-surface-2); color:var(--admin-text); font:600 12px var(--admin-font); }
#desktop-admin-payment-orders .payment-order-card { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 20px; margin:0 !important; border:0 !important; border-top:1px solid var(--admin-border) !important; border-radius:0 !important; background:transparent !important; }
#desktop-admin-payment-orders .payment-order-card:first-child { border-top:0 !important; }
#desktop-admin-payment-orders .payment-order-card:hover { background:rgba(88,223,208,.045) !important; }
#desktop-admin-payment-orders .payment-order-card.is-pending_review { box-shadow:inset 3px 0 0 #f2b84b; }
#desktop-admin-payment-orders .payment-order-card.is-approved { box-shadow:inset 3px 0 0 #49d59e; }
#desktop-admin-payment-orders .payment-order-card.is-rejected,#desktop-admin-payment-orders .payment-order-card.is-revoked { box-shadow:inset 3px 0 0 #ef9076; }
#desktop-admin-payment-orders .payment-order-card-copy { min-width:0; }
#desktop-admin-payment-orders .payment-order-card-copy strong { display:block; font-size:15px; }
#desktop-admin-payment-orders .payment-order-card-copy strong small { color:var(--admin-text-muted); font-weight:600; }
#desktop-admin-payment-orders .payment-order-card-copy span { display:block; margin-top:6px; color:var(--admin-text-secondary); font-size:13px; }
#desktop-admin-payment-orders .payment-order-card-copy span i { color:#f2c35c; font-style:normal; font-weight:800; }
#desktop-admin-payment-orders .payment-order-card-copy > small { display:block; margin-top:6px; color:var(--admin-text-muted); font-size:11px; line-height:1.45; }
#desktop-admin-payment-orders .payment-order-card-actions { flex:0 0 auto; }
#desktop-admin-payment-orders .payment-order-card-actions button { font:700 12px var(--admin-font) !important; }

.payment-decision-modal { position:fixed; inset:0; z-index:2147483010; display:grid; place-items:center; padding:20px; }
.payment-decision-backdrop { position:absolute; inset:0; border:0; background:rgba(3,8,12,.76); }
.payment-decision-card { position:relative; z-index:1; width:min(520px,100%); padding:22px; border:1px solid var(--admin-border-strong); border-radius:16px; background:#131d25; color:var(--admin-text); box-shadow:0 30px 76px rgba(0,0,0,.52); }
.payment-decision-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.payment-decision-card header span { display:block; color:#f0b84a; font-size:10px; font-weight:800; letter-spacing:.12em; }
.payment-decision-card h2 { margin:7px 0 5px; font-size:21px; }
.payment-decision-card header p { margin:0; color:var(--admin-text-muted); font-size:12px; line-height:1.55; }
.payment-decision-card header button { border:0; background:transparent; color:var(--admin-text-muted); font-size:23px; cursor:pointer; }
.payment-decision-card dl { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }
.payment-decision-card dl > div { min-width:0; padding:10px; border:1px solid var(--admin-border); border-radius:9px; background:var(--admin-surface-2); }
.payment-decision-card dl > div:last-child { grid-column:1 / -1; }
.payment-decision-card dt { color:var(--admin-text-muted); font-size:10px; font-weight:700; }
.payment-decision-card dd { overflow:hidden; margin:4px 0 0; color:var(--admin-text); font-size:12px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.payment-decision-card label { display:grid; gap:7px; color:var(--admin-text-secondary); font-size:12px; font-weight:700; }
.payment-decision-card textarea { min-height:84px; resize:vertical; border:1px solid var(--admin-border-strong); border-radius:9px; padding:10px; background:var(--admin-surface-2); color:var(--admin-text); font:500 13px var(--admin-font); }
.payment-decision-card footer { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }
.payment-decision-card footer button { min-height:38px; padding:0 13px; border:1px solid var(--admin-border-strong); border-radius:8px; background:transparent; color:var(--admin-text-secondary); font:700 12px var(--admin-font); cursor:pointer; }
.payment-decision-card footer [type="submit"] { border-color:#d5a54e; background:#f0b84a; color:#1c1303; }
.payment-decision-card.is-reject footer [type="submit"] { border-color:#e29a92; background:#b9574e; color:#fff; }
.payment-decision-card.is-revoke footer [type="submit"] { border-color:#d3a56d; background:#8f592d; color:#fff; }
@media (max-width: 900px) {
  #desktop-admin-payment-orders .payment-ledger-shell { width:calc(100% - 28px); padding-top:22px; }
  #desktop-admin-payment-orders .payment-ledger-page-head,#desktop-admin-payment-orders .payment-order-history > header { align-items:flex-start; flex-direction:column; }
  #desktop-admin-payment-orders .payment-ledger-page-actions { justify-content:flex-start; }
  #desktop-admin-payment-orders .payment-order-filters { width:100%; }
  #desktop-admin-payment-orders .payment-order-filters input { flex:1; min-width:0; }
  #desktop-admin-payment-orders .payment-workbench-tabs { overflow-x:auto; }
  #desktop-admin-payment-orders .payment-workbench-tabs a { margin-left:0; white-space:nowrap; }
  #desktop-admin-payment-orders .payment-student-ledger > header { align-items:flex-start; flex-direction:column; }
  #desktop-admin-payment-orders .payment-ledger-filters { width:100%; }
  #desktop-admin-payment-orders .payment-ledger-filters input { flex:1; min-width:0; }
  #desktop-admin-payment-orders .payment-student-head { display:none; }
  #desktop-admin-payment-orders .payment-student-row { grid-template-columns:1fr 1fr; gap:13px; }
  #desktop-admin-payment-orders .payment-student-actions { justify-content:flex-start; }
  #desktop-admin-payment-orders .payment-order-card { align-items:flex-start; flex-direction:column; }
}
@media (max-width:1180px) {
  #desktop-admin-payment-orders .payment-ops-alert-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:640px) {
  #desktop-admin-payment-orders .payment-ops-alerts > header { align-items:flex-start; flex-direction:column; }
  #desktop-admin-payment-orders .payment-ops-alert-grid { grid-template-columns:1fr 1fr; }
}

.payment-grant-modal { position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:20px; }
.payment-grant-backdrop { position:absolute; inset:0; border:0; background:rgba(4,10,14,.72); cursor:default; }
.payment-grant-card { position:relative; z-index:1; width:min(460px, 100%); padding:22px; border:1px solid var(--admin-border-strong); border-radius:16px; background:#131d25; color:var(--admin-text); box-shadow:0 28px 70px rgba(0,0,0,.48); }
.payment-grant-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; }
.payment-grant-card header span { color:var(--admin-accent); font-size:10px; font-weight:800; letter-spacing:.1em; }
.payment-grant-card h2 { margin:6px 0; font-size:19px; }
.payment-grant-card p { margin:0; color:var(--admin-text-muted); font-size:12px; }
.payment-grant-card header button { border:0; background:transparent; color:var(--admin-text-muted); font-size:22px; cursor:pointer; }
.payment-grant-card label { display:grid; gap:7px; margin:14px 0; color:var(--admin-text-secondary); font-size:12px; font-weight:700; }
.payment-grant-card label small { color:var(--admin-text-muted); font-size:10px; font-weight:600; }
.payment-grant-card select,.payment-grant-card input { min-height:42px; border:1px solid var(--admin-border-strong); border-radius:8px; padding:0 10px; background:#202b36; color:var(--admin-text); font:600 13px var(--admin-font); }
.payment-grant-duration { display:flex; flex-wrap:wrap; gap:7px; margin:14px 0; padding:10px; border:1px solid var(--admin-border); border-radius:9px; background:var(--admin-surface-2); }
.payment-grant-duration > span { width:100%; color:var(--admin-text-muted); font-size:11px; font-weight:800; }
.payment-grant-duration button { min-height:30px; padding:0 9px; border:1px solid var(--admin-accent-border); border-radius:7px; background:transparent; color:var(--admin-accent); font:750 11px var(--admin-font); cursor:pointer; }
.payment-grant-duration button:hover { background:rgba(88,223,208,.12); }
.payment-grant-duration button.is-selected { border-color:var(--admin-accent); background:var(--admin-accent); color:#09231f; }
.payment-grant-card footer { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }
.payment-grant-card footer button { min-height:38px; padding:0 13px; border:1px solid var(--admin-border-strong); border-radius:8px; background:transparent; color:var(--admin-text-secondary); font:700 12px var(--admin-font); cursor:pointer; }
.payment-grant-card footer [type="submit"] { border:0; background:var(--admin-accent); color:#09231f; }
.payment-grant-card footer [disabled] { opacity:.5; cursor:not-allowed; }

/* Membership operations: make the review queue read like a focused admin
 * workbench rather than a stack of unrelated cards. */
#desktop-admin-payment-orders .payment-ledger-shell { max-width:1280px; }
#desktop-admin-payment-orders .payment-ledger-page-head { padding-bottom:18px; }
#desktop-admin-payment-orders .payment-ledger-page-head h1 { letter-spacing:-.02em; }
#desktop-admin-payment-orders .payment-ledger-page-head p { max-width:620px; line-height:1.65; }
#desktop-admin-payment-orders .payment-workbench-tabs { margin:18px 0 14px; padding:4px; border:1px solid var(--admin-border); border-radius:10px; background:rgba(17,27,35,.72); }
#desktop-admin-payment-orders .payment-workbench-tabs button { min-height:34px; padding:0 14px; border-radius:7px; color:var(--admin-text-muted); font-weight:700; }
#desktop-admin-payment-orders .payment-workbench-tabs button.active { background:rgba(88,223,208,.14); color:var(--admin-accent); }
#desktop-admin-payment-orders .payment-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:0 0 16px; }
#desktop-admin-payment-orders .payment-kpi { min-height:92px; padding:14px 16px; border:1px solid var(--admin-border); border-radius:12px; background:linear-gradient(145deg,rgba(31,45,56,.92),rgba(20,30,38,.92)); }
#desktop-admin-payment-orders .payment-kpi span,#desktop-admin-payment-orders .payment-kpi small { display:block; color:var(--admin-text-muted); font-size:11px; font-weight:700; }
#desktop-admin-payment-orders .payment-kpi strong { display:block; margin:7px 0 2px; color:var(--admin-text); font:700 26px var(--admin-mono); }
#desktop-admin-payment-orders .payment-kpi small { font-size:10px; font-weight:600; }
#desktop-admin-payment-orders .payment-kpi.is-pending { border-color:rgba(242,184,75,.42); box-shadow:inset 3px 0 #f2b84b; }
#desktop-admin-payment-orders .payment-kpi.is-pending strong { color:#f3c45c; }
#desktop-admin-payment-orders .payment-kpi.is-approved { border-color:rgba(73,213,158,.34); box-shadow:inset 3px 0 #49d59e; }
#desktop-admin-payment-orders .payment-kpi.is-approved strong { color:#54d7a2; }
#desktop-admin-payment-orders .payment-order-history > header { align-items:center; padding:16px 18px; }
#desktop-admin-payment-orders .payment-order-history > header h2 { font-size:17px; }
#desktop-admin-payment-orders .payment-order-card { min-height:72px; padding:13px 18px; }
#desktop-admin-payment-orders .payment-order-card-actions button { min-height:34px; padding:0 12px !important; border-radius:7px !important; }
#desktop-admin-payment-orders [data-payment-orders-result] { margin:0 0 14px; padding:12px 14px; border:1px solid; border-radius:10px; font-size:12px; line-height:1.55; }
@media (max-width:760px) {
  #desktop-admin-payment-orders .payment-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #desktop-admin-payment-orders .payment-order-filters { flex-wrap:wrap; }
  #desktop-admin-payment-orders .payment-order-filters input { flex-basis:100%; }
}

/* Native dashboard keeps all live controls and tabs; only its duplicated
 * mobile-style back/title rail is removed on desktop. */
body.route-admin-dashboard #app .min-h-screen > div:first-child {
  display: none !important;
}
body.route-admin-dashboard #app .min-h-screen > .px-4 {
  padding-top: 24px !important;
}

/* ── Native admin UI polish ───────────────────────────────────────────────
 * The bundled React pages remain the only source of markup, interactions and
 * data. These rules deliberately style containers only; they never replace,
 * move or disable native controls.
 */
body.route-admin-dashboard #app .min-h-screen {
  min-height: 100vh !important;
  padding-bottom: 84px !important;
  background:
    radial-gradient(900px 440px at 8% -8%, rgba(61, 217, 200, .08), transparent 56%),
    #080d0c !important;
}

body.route-admin-dashboard #app .min-h-screen > .px-4 {
  width: min(1440px, calc(100% - 56px)) !important;
  margin: 0 auto !important;
  padding-bottom: 42px !important;
}

body.route-admin-dashboard #app .min-h-screen > .px-4 > * {
  margin-bottom: 16px !important;
}

/* Native range tabs and every action button retain their event handlers. */
body.route-admin-dashboard #app .min-h-screen button {
  min-height: 36px !important;
  border-radius: 8px !important;
  transition: transform .16s ease, border-color .16s ease, background .16s ease !important;
}

body.route-admin-dashboard #app .min-h-screen button:hover {
  transform: translateY(-1px) !important;
}

/* Normalize native analytics cards without assuming their generated classes. */
body.route-admin-dashboard #app .min-h-screen [class*="rounded"],
body.route-admin-dashboard #app .min-h-screen [style*="borderRadius"] {
  border-radius: 12px !important;
}

body.route-admin-dashboard #app .min-h-screen [class*="shadow"] {
  box-shadow: 0 16px 34px rgba(0, 0, 0, .14) !important;
}

body.route-admin-dashboard #app .min-h-screen [class*="border"] {
  border-color: rgba(107, 142, 135, .28) !important;
}

body.route-admin-dashboard #app .min-h-screen svg {
  max-height: 300px !important;
}

/* The native chart still draws the bars. Only its stretched SVG text is
 * hidden and replaced by this unscaled label rail. */
body.route-admin-dashboard #app svg.admin-native-bar-chart text {
  visibility: hidden !important;
}

body.route-admin-dashboard #app .admin-native-bar-labels {
  display: grid !important;
  grid-template-columns: repeat(var(--admin-bar-count), minmax(0, 1fr)) !important;
  gap: 4px !important;
  width: 100% !important;
  margin: -1px 0 6px !important;
  color: #929ea0 !important;
  font: 600 12px/1.4 var(--admin-font) !important;
}

body.route-admin-dashboard #app .admin-native-bar-labels span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.route-admin-dashboard #app .min-h-screen table {
  overflow: hidden !important;
  border-radius: 10px !important;
}

body.route-admin-dashboard #app .min-h-screen table :is(th, td) {
  padding: 12px 14px !important;
}

/* The native management directory is similarly polished, but all its links
 * remain native anchors/routes. */
body.route-admin:not(.route-admin-dashboard) #app .min-h-screen {
  min-height: 100vh !important;
  padding-bottom: 84px !important;
  background:
    radial-gradient(820px 380px at 10% -10%, rgba(61, 217, 200, .06), transparent 58%),
    #0a0d0e !important;
}

body.route-admin:not(.route-admin-dashboard) #app .min-h-screen [class*="rounded"],
body.route-admin:not(.route-admin-dashboard) #app .min-h-screen [style*="borderRadius"] {
  border-radius: 10px !important;
}

body.route-admin:not(.route-admin-dashboard) #app .min-h-screen button,
body.route-admin:not(.route-admin-dashboard) #app .min-h-screen a {
  transition: transform .16s ease, border-color .16s ease, background .16s ease !important;
}

body.route-admin:not(.route-admin-dashboard) #app .min-h-screen :is(button, a):hover {
  transform: translateY(-1px) !important;
}

/* Native / fallback admin: payment ledger is an entry only, not an embedded page. */
.desktop-admin-native-payment-entry,
#desktop-admin-native-payment-inject,
#desktop-admin-portal .admin-portal-payment-entry {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 2px 16px !important;
  align-items: center !important;
  width: min(1100px, calc(100% - 24px)) !important;
  margin: 12px auto 18px !important;
  padding: 16px 18px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(240, 184, 74, 0.42) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(48, 38, 18, 0.96), rgba(20, 24, 28, 0.96)) !important;
  color: #f4f1ea !important;
  text-decoration: none !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22) !important;
}
#desktop-admin-portal .admin-portal-payment-entry {
  width: 100% !important;
  margin: 0 0 18px !important;
}
.desktop-admin-native-payment-entry span,
#desktop-admin-native-payment-inject span,
#desktop-admin-portal .admin-portal-payment-entry span {
  grid-column: 1 !important;
  color: #f0b84a !important;
  font: 800 11px/1.2 var(--admin-mono) !important;
  letter-spacing: .12em !important;
}
.desktop-admin-native-payment-entry strong,
#desktop-admin-native-payment-inject strong,
#desktop-admin-portal .admin-portal-payment-entry strong {
  grid-column: 1 !important;
  margin: 4px 0 0 !important;
  color: #fff8ea !important;
  font-size: 20px !important;
  font-weight: 750 !important;
}
.desktop-admin-native-payment-entry small,
#desktop-admin-native-payment-inject small,
#desktop-admin-portal .admin-portal-payment-entry small {
  grid-column: 1 !important;
  color: #d9c8a2 !important;
  font-size: 12px !important;
}
.desktop-admin-native-payment-entry b,
#desktop-admin-native-payment-inject b,
#desktop-admin-portal .admin-portal-payment-entry b {
  grid-column: 2 !important;
  grid-row: 1 / span 3 !important;
  color: #f0b84a !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
body.desktop-light .desktop-admin-native-payment-entry,
body.desktop-light #desktop-admin-native-payment-inject,
body.desktop-light #desktop-admin-portal .admin-portal-payment-entry {
  border-color: #e2c27a !important;
  background: linear-gradient(135deg, #fff9ec, #ffffff) !important;
  color: #24383d !important;
  box-shadow: 0 10px 24px rgba(70, 84, 88, 0.10) !important;
}
body.desktop-light .desktop-admin-native-payment-entry strong,
body.desktop-light #desktop-admin-native-payment-inject strong,
body.desktop-light #desktop-admin-portal .admin-portal-payment-entry strong { color: #24383d !important; }
body.desktop-light .desktop-admin-native-payment-entry small,
body.desktop-light #desktop-admin-native-payment-inject small,
body.desktop-light #desktop-admin-portal .admin-portal-payment-entry small { color: #7a6428 !important; }

#desktop-admin-portal .admin-portal-quick {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 22px !important;
}
#desktop-admin-portal .admin-portal-quick a {
  display: grid !important;
  gap: 4px !important;
  min-height: 74px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 8px !important;
  background: var(--admin-surface) !important;
  color: inherit !important;
  text-decoration: none !important;
}
#desktop-admin-portal .admin-portal-quick a strong {
  color: var(--admin-text) !important;
  font-size: 15px !important;
}
#desktop-admin-portal .admin-portal-quick a span {
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
}
#desktop-admin-portal .admin-portal-quick a:hover {
  border-color: var(--admin-accent-border) !important;
  background: var(--admin-accent-soft) !important;
}
@media (max-width: 900px) {
  #desktop-admin-portal .admin-portal-quick { grid-template-columns: 1fr 1fr !important; }
}

/* ── Portal shell ── */
#desktop-admin-portal .admin-portal-shell {
  width: min(1280px, calc(100% - 56px)) !important;
  margin: 0 auto !important;
  padding: 36px 0 72px !important;
  box-sizing: border-box;
}

#desktop-admin-portal .admin-portal-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin: 0 0 20px !important;
  padding: 0 0 20px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--admin-border) !important;
  background: transparent !important;
}

#desktop-admin-portal .admin-portal-head > div:first-child > span {
  display: block !important;
  margin: 0 !important;
  color: var(--admin-accent) !important;
  font: 700 11px/1.3 var(--admin-mono) !important;
  letter-spacing: .14em !important;
}

#desktop-admin-portal .admin-portal-head h1 {
  margin: 8px 0 8px !important;
  color: var(--admin-text) !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -.01em !important;
}

#desktop-admin-portal .admin-portal-head p {
  max-width: 520px !important;
  margin: 0 !important;
  color: var(--admin-text-secondary) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

#desktop-admin-portal .admin-portal-head-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

#desktop-admin-portal .admin-portal-head-actions a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border: 1px solid var(--admin-border-strong) !important;
  border-radius: 6px !important;
  background: var(--admin-surface) !important;
  color: var(--admin-text-secondary) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}

#desktop-admin-portal .admin-portal-head-actions a:first-child {
  border-color: var(--admin-accent-border) !important;
  background: var(--admin-accent-soft) !important;
  color: var(--admin-accent) !important;
}

#desktop-admin-portal .admin-portal-head-actions a:hover {
  border-color: var(--admin-accent) !important;
  color: var(--admin-accent) !important;
}

#desktop-admin-portal .admin-portal-summary {
  display: grid !important;
  grid-template-columns: 128px 128px 160px minmax(0, 1fr) !important;
  align-items: stretch !important;
  margin: 0 0 18px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 8px !important;
  background: var(--admin-surface) !important;
  overflow: hidden;
}

#desktop-admin-portal .admin-portal-summary > div {
  padding: 16px 18px !important;
  border-right: 1px solid var(--admin-border) !important;
}

#desktop-admin-portal .admin-portal-summary strong {
  display: block !important;
  color: var(--admin-text) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  font-variant-numeric: tabular-nums;
}

#desktop-admin-portal .admin-portal-summary span {
  display: block !important;
  margin-top: 6px !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

#desktop-admin-portal .admin-portal-summary p {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 12px 16px !important;
}

#desktop-admin-portal .admin-portal-summary p b {
  margin-right: 4px !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

#desktop-admin-portal .admin-portal-summary p a {
  padding: 7px 11px !important;
  border: 1px solid var(--admin-border-strong) !important;
  border-radius: 5px !important;
  background: var(--admin-surface-2) !important;
  color: var(--admin-accent) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

#desktop-admin-portal .admin-portal-summary p a:hover {
  border-color: var(--admin-accent) !important;
  background: var(--admin-accent-soft) !important;
}

#desktop-admin-portal .admin-portal-group {
  margin-top: 14px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 8px !important;
  background: var(--admin-surface) !important;
  overflow: hidden;
}

#desktop-admin-portal .admin-portal-group > header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--admin-border) !important;
  background: var(--admin-surface-2) !important;
}

#desktop-admin-portal .admin-portal-group header > div {
  display: flex !important;
  align-items: baseline !important;
  gap: 12px !important;
}

#desktop-admin-portal .admin-portal-group header span {
  color: var(--admin-accent) !important;
  font: 700 11px/1.2 var(--admin-mono) !important;
  letter-spacing: .1em !important;
}

#desktop-admin-portal .admin-portal-group h2 {
  margin: 0 !important;
  color: var(--admin-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

#desktop-admin-portal .admin-portal-group header small {
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

#desktop-admin-portal .admin-portal-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

#desktop-admin-portal .admin-portal-grid a {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  min-width: 0 !important;
  min-height: 78px !important;
  padding: 14px 16px !important;
  border-right: 1px solid var(--admin-border) !important;
  border-bottom: 1px solid var(--admin-border) !important;
  color: inherit !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  transition: background .15s ease;
}

#desktop-admin-portal .admin-portal-grid a:nth-child(3n) { border-right: 0 !important; }
#desktop-admin-portal .admin-portal-grid a:hover {
  background: var(--admin-accent-soft) !important;
}

/* Iconify mask icons need background-color:currentColor; draw the tile with ::before */
#desktop-admin-portal .admin-portal-grid i {
  position: relative !important;
  display: inline-block !important;
  width: 1.05em !important;
  height: 1.05em !important;
  flex: 0 0 auto !important;
  margin: 0 4px !important;
  color: var(--admin-accent) !important;
  font-size: 18px !important;
  background-color: currentColor !important;
  z-index: 1;
}
#desktop-admin-portal .admin-portal-grid i::before {
  content: "" !important;
  position: absolute !important;
  inset: -9px !important;
  z-index: -1 !important;
  border: 1px solid var(--admin-accent-border) !important;
  border-radius: 7px !important;
  background: var(--admin-accent-soft) !important;
  pointer-events: none !important;
}

#desktop-admin-portal .admin-portal-grid div { min-width: 0 !important; flex: 1 !important; }

#desktop-admin-portal .admin-portal-grid strong {
  display: block !important;
  overflow: hidden !important;
  color: var(--admin-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#desktop-admin-portal .admin-portal-grid span {
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden !important;
  margin-top: 5px !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  white-space: normal !important;
  text-overflow: unset !important;
}

#desktop-admin-portal .admin-portal-grid b {
  color: var(--admin-text-muted) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
}

@media (max-width: 1080px) {
  #desktop-admin-portal .admin-portal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #desktop-admin-portal .admin-portal-grid a:nth-child(3n) { border-right: 1px solid var(--admin-border) !important; }
  #desktop-admin-portal .admin-portal-grid a:nth-child(2n) { border-right: 0 !important; }
  #desktop-admin-portal .admin-portal-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  #desktop-admin-portal .admin-portal-summary p {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
    border-top: 1px solid var(--admin-border) !important;
  }
}

@media (max-width: 700px) {
  #desktop-admin-portal .admin-portal-shell { width: calc(100% - 28px) !important; padding-top: 24px !important; }
  #desktop-admin-portal .admin-portal-head { flex-direction: column !important; align-items: flex-start !important; }
  #desktop-admin-portal .admin-portal-grid { grid-template-columns: 1fr !important; }
  #desktop-admin-portal .admin-portal-grid a { border-right: 0 !important; }
  #desktop-admin-portal .admin-portal-summary { grid-template-columns: 1fr !important; }
  #desktop-admin-portal .admin-portal-summary > div { border-right: 0 !important; border-bottom: 1px solid var(--admin-border) !important; }
}

/* ── Dashboard ── */
#desktop-admin-dashboard .admin-dashboard-shell {
  width: min(1500px, calc(100% - 64px)) !important;
  margin: 0 auto !important;
  padding: 28px 0 80px !important;
  box-sizing: border-box;
  font-family: var(--admin-font);
}

/* A compact utility rail replaces the old page-sized title/back block. */
#desktop-admin-dashboard .admin-dashboard-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  min-height: 38px !important;
  margin: 0 0 14px !important;
}

#desktop-admin-dashboard .admin-dashboard-toolbar time {
  color: var(--admin-text-muted) !important;
  font: 600 12px/1.2 var(--admin-font) !important;
  font-variant-numeric: tabular-nums;
}

#desktop-admin-dashboard .admin-dashboard-toolbar button {
  min-height: 36px !important;
  padding: 0 14px !important;
  border: 1px solid var(--admin-accent-border) !important;
  border-radius: 8px !important;
  background: var(--admin-accent-soft) !important;
  color: var(--admin-accent) !important;
  font: 700 12px/1 var(--admin-font) !important;
  cursor: pointer !important;
  transition: background .18s ease, border-color .18s ease, transform .18s ease !important;
}

#desktop-admin-dashboard .admin-dashboard-toolbar button:hover {
  border-color: var(--admin-accent) !important;
  background: rgba(61, 217, 200, .16) !important;
  transform: translateY(-1px) !important;
}

#desktop-admin-dashboard .admin-dashboard-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin: 0 0 18px !important;
  padding: 0 0 20px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--admin-border) !important;
  background: transparent !important;
}

#desktop-admin-dashboard .admin-dashboard-head > div:first-child > span,
#desktop-admin-dashboard .admin-dashboard-head span {
  display: block !important;
  color: var(--admin-accent) !important;
  font: 700 11px/1.2 var(--admin-mono) !important;
  letter-spacing: .12em !important;
}

#desktop-admin-dashboard .admin-dashboard-head h1 {
  margin: 8px 0 8px !important;
  color: var(--admin-text) !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

#desktop-admin-dashboard .admin-dashboard-head p {
  margin: 0 !important;
  color: var(--admin-text-secondary) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

#desktop-admin-dashboard .admin-dashboard-head > div:last-child {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

#desktop-admin-dashboard .admin-dashboard-head time {
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

#desktop-admin-dashboard .admin-dashboard-head button {
  min-height: 38px !important;
  padding: 0 16px !important;
  border: 1px solid var(--admin-accent-border) !important;
  border-radius: 6px !important;
  background: var(--admin-accent-soft) !important;
  color: var(--admin-accent) !important;
  font: 700 13px/1 var(--admin-font) !important;
  cursor: pointer !important;
}

#desktop-admin-dashboard .admin-dashboard-head button:hover {
  border-color: var(--admin-accent) !important;
  color: var(--admin-text) !important;
}

#desktop-admin-dashboard .admin-dashboard-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 0 16px !important;
  padding: 4px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--admin-surface) 88%, transparent) !important;
}

#desktop-admin-dashboard .admin-dashboard-nav a {
  padding: 10px 15px !important;
  border-radius: 7px !important;
  color: var(--admin-text-muted) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  text-decoration: none !important;
}

#desktop-admin-dashboard .admin-dashboard-nav a:hover,
#desktop-admin-dashboard .admin-dashboard-nav a.active {
  background: var(--admin-accent-soft) !important;
  color: var(--admin-accent) !important;
}

#desktop-admin-dashboard .admin-dashboard-kpis {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

#desktop-admin-dashboard .admin-dashboard-kpis article {
  position: relative !important;
  min-height: 142px !important;
  padding: 20px !important;
  border: 1px solid var(--admin-border) !important;
  border-top: 1px solid var(--admin-border-strong) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, var(--admin-surface), var(--admin-surface-2)) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  transition: transform .18s ease, border-color .18s ease !important;
}

#desktop-admin-dashboard .admin-dashboard-kpis article::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42px;
  height: 3px;
  background: var(--admin-accent);
}
#desktop-admin-dashboard .admin-dashboard-kpis article:nth-child(2)::before { background: #73a7ff; }
#desktop-admin-dashboard .admin-dashboard-kpis article:nth-child(3)::before { background: #d9a85a; }
#desktop-admin-dashboard .admin-dashboard-kpis article:nth-child(4)::before { background: #b889ed; }
#desktop-admin-dashboard .admin-dashboard-kpis article:hover { transform: translateY(-2px) !important; border-color: var(--admin-border-strong) !important; }

#desktop-admin-dashboard .admin-dashboard-kpis span {
  display: block !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

#desktop-admin-dashboard .admin-dashboard-kpis strong {
  display: block !important;
  margin: 18px 0 12px !important;
  color: var(--admin-text) !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums;
}

#desktop-admin-dashboard .admin-dashboard-kpis small {
  display: block !important;
  color: var(--admin-text-secondary) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

#desktop-admin-dashboard .admin-dashboard-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, .8fr) !important;
  gap: 14px !important;
  margin-top: 14px !important;
}

#desktop-admin-dashboard .admin-dashboard-panel {
  min-width: 0 !important;
  padding: 22px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, var(--admin-surface), var(--admin-surface-2)) !important;
  box-sizing: border-box !important;
}

#desktop-admin-dashboard .admin-dashboard-panel > header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin-bottom: 18px !important;
}

#desktop-admin-dashboard .admin-dashboard-panel header span {
  display: block !important;
  color: var(--admin-accent) !important;
  font: 700 11px/1.2 var(--admin-mono) !important;
  letter-spacing: .1em !important;
}

#desktop-admin-dashboard .admin-dashboard-panel h2 {
  margin: 7px 0 0 !important;
  color: var(--admin-text) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}

#desktop-admin-dashboard .admin-dashboard-panel > header > b {
  color: var(--admin-text-muted) !important;
  font: 600 11px/1.2 var(--admin-mono) !important;
}

#desktop-admin-dashboard .admin-dashboard-activity { min-height: 310px !important; }

#desktop-admin-dashboard .admin-dashboard-bars {
  height: 204px !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 4px !important;
  padding-top: 8px !important;
  border-bottom: 1px solid var(--admin-border) !important;
}

#desktop-admin-dashboard .admin-dashboard-bars i {
  min-width: 0 !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
  height: 100% !important;
  font-style: normal !important;
}

#desktop-admin-dashboard .admin-dashboard-bars b {
  width: 100% !important;
  max-width: 26px !important;
  height: var(--bar) !important;
  min-height: 4px !important;
  border-radius: 5px 5px 1px 1px !important;
  background: linear-gradient(180deg, #5be3d4, #249e94) !important;
  box-shadow: 0 8px 18px rgba(61, 217, 200, .12) !important;
}

#desktop-admin-dashboard .admin-dashboard-bars i:nth-child(3n) b { background: linear-gradient(180deg, #78b3ff, #4b75ce) !important; }

#desktop-admin-dashboard .admin-dashboard-bars small {
  min-height: 14px !important;
  color: var(--admin-text-muted) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

#desktop-admin-dashboard .admin-dashboard-health-list {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}

#desktop-admin-dashboard .admin-dashboard-health-list div {
  min-height: 84px !important;
  padding: 14px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 6px !important;
  background: var(--admin-surface-2) !important;
}

#desktop-admin-dashboard .admin-dashboard-health-list span {
  display: block !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

#desktop-admin-dashboard .admin-dashboard-health-list strong {
  display: block !important;
  margin-top: 12px !important;
  color: var(--admin-text) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

#desktop-admin-dashboard .admin-dashboard-tokens { grid-column: 1 !important; }

#desktop-admin-dashboard .admin-dashboard-tokens > header > strong {
  color: var(--admin-accent) !important;
  font-size: 26px !important;
  text-align: right !important;
}

#desktop-admin-dashboard .admin-dashboard-tokens > header > strong small {
  display: block !important;
  margin-top: 6px !important;
  color: var(--admin-text-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

#desktop-admin-dashboard .admin-dashboard-token-summary {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 6px !important;
  background: var(--admin-surface-2) !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

#desktop-admin-dashboard .admin-dashboard-token-summary b {
  margin-left: 6px !important;
  color: var(--admin-text-secondary) !important;
  font-weight: 700 !important;
}

#desktop-admin-dashboard .admin-dashboard-token-head,
#desktop-admin-dashboard .admin-dashboard-token-row {
  display: grid !important;
  grid-template-columns: 36px minmax(100px, 1fr) 90px 90px 100px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 4px !important;
  border-bottom: 1px solid var(--admin-border) !important;
  font-size: 13px !important;
}

#desktop-admin-dashboard .admin-dashboard-token-head {
  color: var(--admin-text-muted) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
}

#desktop-admin-dashboard .admin-dashboard-token-row i {
  color: var(--admin-accent) !important;
  font-style: normal !important;
  font-weight: 600 !important;
}

#desktop-admin-dashboard .admin-dashboard-token-row strong {
  color: var(--admin-text) !important;
  font-weight: 650 !important;
}

#desktop-admin-dashboard .admin-dashboard-token-row span {
  color: var(--admin-text-secondary) !important;
}

#desktop-admin-dashboard .admin-dashboard-token-row b {
  color: var(--admin-accent) !important;
  font-weight: 700 !important;
}

#desktop-admin-dashboard .admin-dashboard-alerts { grid-column: 2 !important; grid-row: 2 !important; }

#desktop-admin-dashboard .admin-dashboard-alerts a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 14px 0 !important;
  border-top: 1px solid var(--admin-border) !important;
  color: var(--admin-text-secondary) !important;
  font-size: 13px !important;
  font-weight: 550 !important;
  text-decoration: none !important;
}

#desktop-admin-dashboard .admin-dashboard-alerts a:hover { color: var(--admin-accent) !important; }

#desktop-admin-dashboard .admin-dashboard-alerts a b {
  color: var(--admin-accent) !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

#desktop-admin-dashboard .admin-dashboard-alerts p {
  margin: 16px 0 0 !important;
  padding: 12px 14px !important;
  border-left: 3px solid var(--admin-accent-border) !important;
  border-radius: 0 6px 6px 0 !important;
  background: var(--admin-surface-2) !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  line-height: 1.65 !important;
}

#desktop-admin-dashboard .admin-dashboard-empty,
#desktop-admin-dashboard .admin-dashboard-loading,
#desktop-admin-dashboard .admin-dashboard-error {
  display: grid !important;
  place-items: center !important;
  min-height: 180px !important;
  color: var(--admin-text-muted) !important;
  font-size: 14px !important;
}

#desktop-admin-dashboard .admin-dashboard-loading,
#desktop-admin-dashboard .admin-dashboard-error { min-height: 60vh !important; }

#desktop-admin-dashboard .admin-dashboard-error {
  align-content: center !important;
  gap: 12px !important;
}

#desktop-admin-dashboard .admin-dashboard-error strong {
  color: var(--admin-text) !important;
  font-size: 20px !important;
}

#desktop-admin-dashboard .admin-dashboard-error span {
  color: var(--admin-text-secondary) !important;
}

#desktop-admin-dashboard .admin-dashboard-error button {
  padding: 10px 16px !important;
  border: 1px solid var(--admin-accent-border) !important;
  border-radius: 6px !important;
  background: var(--admin-accent-soft) !important;
  color: var(--admin-accent) !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

@media (max-width: 1050px) {
  #desktop-admin-dashboard .admin-dashboard-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #desktop-admin-dashboard .admin-dashboard-grid { grid-template-columns: 1fr !important; }
  #desktop-admin-dashboard .admin-dashboard-tokens,
  #desktop-admin-dashboard .admin-dashboard-alerts { grid-column: 1 !important; grid-row: auto !important; }
}

@media (max-width: 700px) {
  #desktop-admin-dashboard .admin-dashboard-shell { width: calc(100% - 28px) !important; padding-top: 24px !important; }
  #desktop-admin-dashboard .admin-dashboard-toolbar { justify-content: space-between !important; }
  #desktop-admin-dashboard .admin-dashboard-head { flex-direction: column !important; align-items: flex-start !important; }
  #desktop-admin-dashboard .admin-dashboard-head > div:last-child { width: 100% !important; justify-content: space-between !important; }
  #desktop-admin-dashboard .admin-dashboard-kpis { grid-template-columns: 1fr !important; }
  #desktop-admin-dashboard .admin-dashboard-token-head,
  #desktop-admin-dashboard .admin-dashboard-token-row {
    grid-template-columns: 28px minmax(90px, 1fr) 72px !important;
  }
  #desktop-admin-dashboard .admin-dashboard-token-head span,
  #desktop-admin-dashboard .admin-dashboard-token-row span { display: none !important; }
}

/* ── Operations hub (injected into people / related pages) ── */
#desktop-admin-operations {
  max-width: 1180px !important;
  margin: 0 auto 22px !important;
  padding: 20px 22px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 8px !important;
  background: var(--admin-surface) !important;
  color: var(--admin-text) !important;
  font-family: var(--admin-font);
}

#desktop-admin-operations header,
.admin-ops-section-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

#desktop-admin-operations header > div > span {
  color: var(--admin-accent) !important;
  font: 700 11px/1.2 var(--admin-mono) !important;
  letter-spacing: .1em !important;
}

#desktop-admin-operations h2 {
  margin: 6px 0 0 !important;
  color: var(--admin-text) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

#desktop-admin-operations header > a {
  color: var(--admin-accent) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  text-decoration: none !important;
}

#desktop-admin-operations nav {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 18px !important;
}

#desktop-admin-operations nav a {
  display: block !important;
  padding: 14px 14px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 7px !important;
  background: var(--admin-surface-2) !important;
  color: var(--admin-text) !important;
  text-decoration: none !important;
}

#desktop-admin-operations nav a b {
  display: block !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

#desktop-admin-operations nav a small {
  display: block !important;
  margin-top: 6px !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
}

#desktop-admin-operations nav a.active,
#desktop-admin-operations nav a:hover {
  border-color: var(--admin-accent-border) !important;
  background: var(--admin-accent-soft) !important;
}

.admin-ops-permissions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 18px 0 !important;
  padding: 16px 0 !important;
  border-top: 1px solid var(--admin-border) !important;
  border-bottom: 1px solid var(--admin-border) !important;
}

.admin-ops-permissions b {
  display: block !important;
  color: var(--admin-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.admin-ops-permissions span {
  display: block !important;
  margin-top: 6px !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}

.admin-ops-section-title strong {
  color: var(--admin-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

.admin-ops-section-title span {
  display: block !important;
  margin-top: 4px !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
}

.admin-ops-section-title button {
  min-height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid var(--admin-accent-border) !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--admin-accent) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  cursor: pointer !important;
}

.admin-ops-loading,
.admin-ops-error,
.admin-ops-token-empty {
  margin: 14px 0 0 !important;
  padding: 16px !important;
  border: 1px solid var(--admin-border) !important;
  border-radius: 6px !important;
  background: var(--admin-surface-2) !important;
  color: var(--admin-text-muted) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

.admin-ops-error { color: var(--admin-danger) !important; }

.admin-ops-token-empty strong {
  display: block !important;
  margin-bottom: 6px !important;
  color: var(--admin-text) !important;
  font-size: 14px !important;
}

.admin-ops-token-empty span {
  display: block !important;
  color: var(--admin-text-muted) !important;
  line-height: 1.55 !important;
}

.admin-ops-token-total {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.admin-ops-token-total strong {
  color: var(--admin-accent) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}

.admin-ops-token-total span {
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
}

.admin-ops-token-table {
  margin-top: 12px !important;
  border-top: 1px solid var(--admin-border) !important;
}

.admin-ops-token-row {
  display: grid !important;
  grid-template-columns: minmax(120px, 1.5fr) repeat(3, minmax(70px, 1fr)) minmax(90px, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 11px 4px !important;
  border-bottom: 1px solid var(--admin-border) !important;
  color: var(--admin-text-secondary) !important;
  font-size: 13px !important;
}

.admin-ops-token-row strong {
  overflow: hidden !important;
  color: var(--admin-text) !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-weight: 650 !important;
}

.admin-ops-token-row b { color: var(--admin-accent) !important; }
.admin-ops-token-row time { color: var(--admin-text-muted) !important; }
.admin-ops-token-head {
  color: var(--admin-text-muted) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
}

@media (max-width: 760px) {
  #desktop-admin-operations nav,
  .admin-ops-permissions { grid-template-columns: 1fr !important; }
  .admin-ops-token-row {
    grid-template-columns: minmax(90px, 1fr) repeat(3, minmax(52px, auto)) !important;
  }
  .admin-ops-token-row time { display: none !important; }
}

/* ── Taro admin pages under #app ── */
body.route-admin #app {
  font-family: var(--admin-font) !important;
  -webkit-font-smoothing: antialiased;
}

body.route-admin #app .min-h-screen {
  width: 100% !important;
  max-width: 1500px !important;
  margin: 0 auto !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
  box-sizing: border-box !important;
}

/* Raise low-contrast inline font sizes one more step */
body.route-admin #app [style*="font-size: 10px"],
body.route-admin #app [style*="font-size:10px"] { font-size: 12px !important; line-height: 1.5 !important; }
body.route-admin #app [style*="font-size: 11px"],
body.route-admin #app [style*="font-size:11px"] { font-size: 13px !important; line-height: 1.5 !important; }
body.route-admin #app [style*="font-size: 12px"],
body.route-admin #app [style*="font-size:12px"] { font-size: 14px !important; line-height: 1.55 !important; }
body.route-admin #app [style*="font-size: 13px"],
body.route-admin #app [style*="font-size:13px"] { font-size: 14px !important; line-height: 1.55 !important; }
body.route-admin #app [style*="font-size: 14px"],
body.route-admin #app [style*="font-size:14px"] { font-size: 15px !important; line-height: 1.55 !important; }

body.route-admin #app button,
body.route-admin #app taro-button-core,
body.route-admin #app input,
body.route-admin #app textarea,
body.route-admin #app select {
  min-height: 36px !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
}

/* Native admin visual system.  This is intentionally CSS-only: the bundled
 * pages keep their existing data loaders, handlers, forms and navigation. */
body.route-admin:not(.route-admin-dashboard) #app .min-h-screen {
  padding-top: 28px !important;
  padding-bottom: 96px !important;
  background: linear-gradient(180deg, #f7faf9 0%, #eef3f1 100%) !important;
  color: #182420 !important;
}
body.route-admin:not(.route-admin-dashboard).desktop-dark #app .min-h-screen {
  background: linear-gradient(180deg, #101715 0%, #0a0e0d 100%) !important;
  color: #edf5f2 !important;
}
body.route-admin #app .min-h-screen > * {
  max-width: 1360px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body.route-admin #app :is(button, a, input, textarea, select) {
  pointer-events: auto !important;
}
body.route-admin #app button,
body.route-admin #app a[class*="button"],
body.route-admin #app [role="button"] {
  cursor: pointer !important;
}
body.route-admin #app button:not(:disabled):hover,
body.route-admin #app a:hover,
body.route-admin #app [role="button"]:hover {
  filter: brightness(1.03) !important;
}
body.route-admin #app :is(input, textarea, select) {
  border: 1px solid #cbd8d3 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #17231f !important;
  outline: none !important;
  transition: border-color .16s ease, box-shadow .16s ease !important;
}
body.route-admin #app :is(input, textarea, select):focus {
  border-color: #178f83 !important;
  box-shadow: 0 0 0 3px rgba(23,143,131,.14) !important;
}
body.route-admin.desktop-dark #app :is(input, textarea, select) {
  border-color: #344541 !important;
  background: #141d1a !important;
  color: #edf5f2 !important;
}
body.route-admin #app table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
  border: 1px solid #d6e1dc !important;
  border-radius: 9px !important;
  background: #fff !important;
}
body.route-admin #app table th {
  background: #f1f6f4 !important;
  color: #52645e !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
}
body.route-admin #app table td {
  border-color: #e2eae6 !important;
  color: #26352f !important;
  font-size: 13px !important;
}
body.route-admin.desktop-dark #app table {
  border-color: #2b3935 !important;
  background: #121a17 !important;
}
body.route-admin.desktop-dark #app table th {
  background: #1b2723 !important;
  color: #b8c9c3 !important;
}
body.route-admin.desktop-dark #app table td {
  border-color: #293833 !important;
  color: #dbe7e2 !important;
}
body.route-admin #app :is(.rounded-xl, .rounded-2xl, .rounded-3xl) {
  border-radius: 10px !important;
}
body.route-admin #app :is(.shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl) {
  box-shadow: 0 10px 28px rgba(20, 49, 42, .08) !important;
}
body.route-admin.desktop-dark #app :is(.shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl) {
  box-shadow: 0 14px 32px rgba(0, 0, 0, .22) !important;
}

body.route-admin.desktop-dark #app,
body.route-admin.desktop-dark #app .taro_page,
body.route-admin.desktop-dark #app .taro_page_show,
body.route-admin.desktop-dark #app taro-page-core,
body.route-admin.desktop-dark #app page,
body.route-admin.desktop-dark #app .min-h-screen {
  background: var(--admin-bg) !important;
  background-image: none !important;
  color: var(--admin-text) !important;
}

body.route-admin.desktop-dark #app .bg-white,
body.route-admin.desktop-dark #app .bg-card,
body.route-admin.desktop-dark #app .glass-card,
body.route-admin.desktop-dark #app .glass-card-frosted,
body.route-admin.desktop-dark #app .rounded-xl,
body.route-admin.desktop-dark #app .rounded-2xl,
body.route-admin.desktop-dark #app [style*="background: #fff"],
body.route-admin.desktop-dark #app [style*="background:#fff"],
body.route-admin.desktop-dark #app [style*="background: #FFF"],
body.route-admin.desktop-dark #app [style*="background:#FFF"],
body.route-admin.desktop-dark #app [style*="background: rgb(255, 255, 255)"],
body.route-admin.desktop-dark #app [style*="background:rgba(255,255,255"],
body.route-admin.desktop-dark #app [style*="background: rgba(255,255,255"] {
  background-color: var(--admin-surface) !important;
  background-image: none !important;
  border-color: var(--admin-border) !important;
  box-shadow: none !important;
}

body.route-admin.desktop-dark #app [style*="linear-gradient"] {
  background: var(--admin-surface-2) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Muted / secondary text was too pale — force readable greys */
body.route-admin.desktop-dark #app .text-muted-foreground,
body.route-admin.desktop-dark #app .text-gray-400,
body.route-admin.desktop-dark #app .text-gray-500,
body.route-admin.desktop-dark #app .text-slate-400,
body.route-admin.desktop-dark #app .text-slate-500,
body.route-admin.desktop-dark #app .text-zinc-400,
body.route-admin.desktop-dark #app .text-zinc-500,
body.route-admin.desktop-dark #app .text-neutral-400,
body.route-admin.desktop-dark #app .text-neutral-500,
body.route-admin.desktop-dark #app [style*="color: #999"],
body.route-admin.desktop-dark #app [style*="color:#999"],
body.route-admin.desktop-dark #app [style*="color: #888"],
body.route-admin.desktop-dark #app [style*="color:#888"],
body.route-admin.desktop-dark #app [style*="color: #777"],
body.route-admin.desktop-dark #app [style*="color:#777"],
body.route-admin.desktop-dark #app [style*="color: #666"],
body.route-admin.desktop-dark #app [style*="color:#666"],
body.route-admin.desktop-dark #app [style*="color: rgba(0,0,0,0.45)"],
body.route-admin.desktop-dark #app [style*="color: rgba(0, 0, 0, 0.45)"],
body.route-admin.desktop-dark #app [style*="color:rgba(0,0,0,0.45)"],
body.route-admin.desktop-dark #app [style*="color: rgba(0,0,0,0.4)"],
body.route-admin.desktop-dark #app [style*="color: rgba(0, 0, 0, 0.4)"],
body.route-admin.desktop-dark #app [style*="opacity: 0.45"],
body.route-admin.desktop-dark #app [style*="opacity:0.45"],
body.route-admin.desktop-dark #app [style*="opacity: 0.5"],
body.route-admin.desktop-dark #app [style*="opacity:0.5"] {
  color: var(--admin-text-muted) !important;
  opacity: 1 !important;
}

body.route-admin.desktop-dark #app .text-gray-600,
body.route-admin.desktop-dark #app .text-slate-600,
body.route-admin.desktop-dark #app .text-zinc-600,
body.route-admin.desktop-dark #app [style*="color: #555"],
body.route-admin.desktop-dark #app [style*="color:#555"],
body.route-admin.desktop-dark #app [style*="color: #444"],
body.route-admin.desktop-dark #app [style*="color:#444"],
body.route-admin.desktop-dark #app [style*="color: #333"],
body.route-admin.desktop-dark #app [style*="color:#333"],
body.route-admin.desktop-dark #app [style*="color: #222"],
body.route-admin.desktop-dark #app [style*="color:#222"],
body.route-admin.desktop-dark #app [style*="color: #111"],
body.route-admin.desktop-dark #app [style*="color:#111"] {
  color: var(--admin-text-secondary) !important;
}

body.route-admin.desktop-dark #app h1,
body.route-admin.desktop-dark #app h2,
body.route-admin.desktop-dark #app h3 {
  color: var(--admin-text) !important;
  font-weight: 700 !important;
}

body.route-admin.desktop-dark #app input,
body.route-admin.desktop-dark #app textarea,
body.route-admin.desktop-dark #app select,
body.route-admin.desktop-dark #app taro-input-core,
body.route-admin.desktop-dark #app taro-textarea-core {
  background: #0c1210 !important;
  border-color: var(--admin-border-strong) !important;
  color: var(--admin-text) !important;
}

body.route-admin.desktop-dark #app input::placeholder,
body.route-admin.desktop-dark #app textarea::placeholder {
  color: var(--admin-text-muted) !important;
  opacity: 1 !important;
}

body.route-admin.desktop-dark #app table {
  width: 100% !important;
  border-collapse: collapse !important;
  color: var(--admin-text-secondary) !important;
  font-size: 13px !important;
}

body.route-admin.desktop-dark #app th {
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  border-color: var(--admin-border) !important;
}

body.route-admin.desktop-dark #app td {
  color: var(--admin-text-secondary) !important;
  border-color: var(--admin-border) !important;
}

body.route-admin.desktop-dark #app button,
body.route-admin.desktop-dark #app taro-button-core {
  border-radius: 6px !important;
}

body.route-admin #app [style*="background-clip: text"] {
  background: none !important;
  color: var(--admin-accent) !important;
  -webkit-text-fill-color: var(--admin-accent) !important;
}

body.route-admin #app [style*="#D94070"],
body.route-admin #app [style*="#7B6CF6"],
body.route-admin #app [style*="#C17AF4"],
body.route-admin #app [style*="#A77BF4"] {
  color: var(--admin-accent) !important;
}

body.route-admin #app .admin-people-summary {
  display: flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
  color: var(--admin-text-muted) !important;
}

body.route-admin #app .admin-people-summary strong {
  color: var(--admin-accent) !important;
  font-size: 24px !important;
  line-height: 1 !important;
}

body.route-admin #app .admin-people-summary span {
  color: var(--admin-text-secondary) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.route-admin #app .admin-people-summary small {
  flex-basis: 100% !important;
  color: var(--admin-text-muted) !important;
  font-size: 12px !important;
}

/* Light mode admin pages */
body.route-admin.desktop-light #app .min-h-screen {
  color: var(--admin-text) !important;
}

body.route-admin.desktop-light #app [style*="linear-gradient"] {
  background: rgba(255, 255, 255, .88) !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.route-admin.desktop-light #app .text-muted-foreground,
body.route-admin.desktop-light #app .text-gray-400,
body.route-admin.desktop-light #app .text-gray-500,
body.route-admin.desktop-light #app [style*="color: #999"],
body.route-admin.desktop-light #app [style*="color:#999"],
body.route-admin.desktop-light #app [style*="color: #888"],
body.route-admin.desktop-light #app [style*="color:#888"] {
  color: var(--admin-text-muted) !important;
}

body.desktop-light.route-admin #desktop-admin-operations {
  border-color: var(--admin-border) !important;
  background: var(--admin-surface) !important;
  color: var(--admin-text) !important;
}

body.desktop-light.route-admin #desktop-admin-operations nav a,
body.desktop-light.route-admin .admin-ops-loading,
body.desktop-light.route-admin .admin-ops-token-empty {
  border-color: var(--admin-border) !important;
  background: var(--admin-surface-2) !important;
  color: var(--admin-text-muted) !important;
}

body.desktop-light.route-admin #desktop-admin-operations nav a { color: var(--admin-text) !important; }
body.desktop-light.route-admin .admin-ops-permissions b,
body.desktop-light.route-admin .admin-ops-token-empty strong,
body.desktop-light.route-admin .admin-ops-token-row strong { color: var(--admin-text) !important; }
body.desktop-light.route-admin .admin-ops-permissions,
body.desktop-light.route-admin .admin-ops-token-table,
body.desktop-light.route-admin .admin-ops-token-row { border-color: var(--admin-border) !important; }

/* Dashboard route leftover #app polish (when custom view not mounted) */
body.route-admin-dashboard #app .min-h-screen {
  width: 100% !important;
  max-width: none !important;
  padding: 0 0 72px !important;
  background: var(--admin-bg) !important;
  color: var(--admin-text) !important;
}

/* ── Exam quality control centre ───────────────────────────────────────── */
#desktop-admin-exam-quality {
  position: fixed;
  inset: 0 0 0 var(--desktop-left-width);
  z-index: 82;
  overflow: auto;
  color: var(--admin-text);
  background: radial-gradient(900px 440px at 8% -8%, rgba(61,217,200,.11), transparent 56%), var(--admin-bg);
  font-family: var(--admin-font);
}
body.desktop-nav-collapsed #desktop-admin-exam-quality { left: 0; }
body.route-has-context:not(.context-collapsed) #desktop-admin-exam-quality { right: var(--desktop-right-width); }
#desktop-admin-exam-quality .admin-quality-shell { width:min(1380px,calc(100% - 64px)); margin:0 auto; padding:36px 0 76px; box-sizing:border-box; }
.admin-quality-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; padding-bottom:22px; border-bottom:1px solid var(--admin-border); }
.admin-quality-head span,.admin-quality-panel header span,.admin-quality-actions header span { display:block; color:var(--admin-accent); font:700 11px/1.2 var(--admin-mono); letter-spacing:.12em; }
.admin-quality-head h1 { margin:8px 0; color:var(--admin-text); font-size:32px; line-height:1.15; letter-spacing:-.02em; }
.admin-quality-head p { max-width:590px; margin:0; color:var(--admin-text-secondary); font-size:14px; line-height:1.65; }
.admin-quality-head > div:last-child { display:flex; gap:10px; flex-wrap:wrap; }
.admin-quality-head a,.admin-quality-panel footer a { color:var(--admin-accent); text-decoration:none; font-weight:700; }
.admin-quality-head > div:last-child a,.admin-quality-head > div:last-child button { display:inline-flex; align-items:center; min-height:38px; padding:0 14px; border:1px solid var(--admin-border-strong); border-radius:7px; background:var(--admin-surface); color:var(--admin-text-secondary); font:700 13px/1 var(--admin-font); cursor:pointer; }
.admin-quality-head > div:last-child a:nth-of-type(1) { border-color:var(--admin-accent-border); background:var(--admin-accent-soft); color:var(--admin-accent); }
.admin-quality-head > div:last-child button { border-color:#806a40; color:#e9c47b; }
.admin-quality-head > div:last-child button:hover { border-color:#e9c47b; background:rgba(233,196,123,.1); }
.admin-quality-loading { display:grid; place-items:center; min-height:320px; color:var(--admin-text-muted); }
.admin-quality-loading strong,.admin-quality-loading span { display:block; text-align:center; }
.admin-quality-status { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin-top:18px; overflow:hidden; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-border); }
.admin-quality-status > div { position:relative; min-height:136px; padding:19px; background:linear-gradient(140deg,var(--admin-surface),var(--admin-surface-2)); }
.admin-quality-status i { position:absolute; top:16px; right:16px; color:var(--admin-border-strong); font:700 14px/1 var(--admin-mono); }
.admin-quality-status span,.admin-quality-status small { display:block; color:var(--admin-text-muted); font-size:12px; }
.admin-quality-status strong { display:block; margin:14px 0 9px; color:var(--admin-text); font-size:25px; line-height:1; }
.admin-quality-actions { margin-top:18px; padding:20px; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-surface); }
.admin-quality-actions header,.admin-quality-panel header { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.admin-quality-actions h2,.admin-quality-panel h2 { margin:7px 0 0; color:var(--admin-text); font-size:18px; }
.admin-quality-actions header small { color:var(--admin-text-muted); font-size:12px; }
.admin-quality-action-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:17px; }
.admin-quality-action-grid a { position:relative; display:block; min-height:126px; padding:16px; border:1px solid var(--admin-border); border-radius:9px; background:var(--admin-surface-2); color:inherit; text-decoration:none; transition:.16s ease; box-sizing:border-box; }
.admin-quality-action-grid a:hover { border-color:var(--admin-accent-border); background:var(--admin-accent-soft); transform:translateY(-2px); }
.admin-quality-action-grid i { display:block; color:var(--admin-accent); font:700 11px/1 var(--admin-mono); }
.admin-quality-action-grid strong { display:block; margin-top:10px; color:var(--admin-text); font-size:15px; }
.admin-quality-action-grid b { position:absolute; right:15px; top:15px; color:var(--admin-accent); font-size:12px; }
.admin-quality-action-grid span { display:block; margin-top:8px; color:var(--admin-text-muted); font-size:12px; line-height:1.5; }
.admin-quality-batch { display:flex; align-items:center; gap:28px; margin-top:14px; padding:20px; border:1px solid var(--admin-border); border-radius:12px; background:linear-gradient(105deg,var(--admin-surface),var(--admin-surface-2)); }
.admin-quality-batch > div:first-child { width:210px; flex:0 0 auto; }
.admin-quality-batch > div:first-child span { display:block; color:var(--admin-accent); font:700 10px/1.2 var(--admin-mono); letter-spacing:.1em; }
.admin-quality-batch h2 { margin:8px 0 0; color:var(--admin-text); font-size:18px; }
.admin-quality-batch p { margin:8px 0 0; color:var(--admin-text-muted); font-size:12px; line-height:1.55; }
.admin-quality-batch-steps { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); flex:1; gap:1px; overflow:hidden; border:1px solid var(--admin-border); border-radius:8px; background:var(--admin-border); }
.admin-quality-batch-steps > div { position:relative; min-height:91px; padding:13px; background:var(--admin-surface); }
.admin-quality-batch-steps i { position:absolute; top:11px; right:11px; color:var(--admin-border-strong); font:700 10px/1 var(--admin-mono); font-style:normal; }
.admin-quality-batch-steps strong,.admin-quality-batch-steps span,.admin-quality-batch-steps small { display:block; }
.admin-quality-batch-steps strong { margin-top:13px; color:var(--admin-text); font:700 19px/1 var(--admin-mono); }
.admin-quality-batch-steps span { margin-top:7px; color:var(--admin-text-secondary); font-size:11px; font-weight:700; }
.admin-quality-batch-steps small { margin-top:4px; color:var(--admin-text-muted); font-size:10px; line-height:1.4; }
.admin-quality-batch-steps .admin-quality-batch-loading { grid-column:1 / -1; display:flex; align-items:center; color:var(--admin-text-muted); font-size:12px; }
.admin-quality-release { margin-top:14px; padding:20px; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-surface); }
.admin-quality-release header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.admin-quality-release header span { display:block; color:var(--admin-accent); font:700 10px/1.2 var(--admin-mono); letter-spacing:.1em; }
.admin-quality-release h2 { margin:8px 0 0; color:var(--admin-text); font-size:18px; }
.admin-quality-release header > b { padding:7px 10px; border:1px solid #806a40; border-radius:5px; color:#e9c47b; font:700 11px/1 var(--admin-font); }
.admin-quality-release > p { margin:10px 0 15px; color:var(--admin-text-muted); font-size:12px; }
.admin-quality-release-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.admin-quality-release-list > div { display:flex; align-items:flex-start; gap:9px; min-height:62px; padding:12px; border:1px solid var(--admin-border); border-radius:6px; background:var(--admin-surface-2); box-sizing:border-box; }
.admin-quality-release-list i { display:grid; place-items:center; width:18px; height:18px; flex:0 0 auto; border-radius:50%; font:700 12px/1 var(--admin-font); font-style:normal; }
.admin-quality-release-list .is-pass i { background:var(--admin-accent-soft); color:var(--admin-accent); }.admin-quality-release-list .is-hold i { background:rgba(233,196,123,.12); color:#e9c47b; }
.admin-quality-release-list span { min-width:0; flex:1; }.admin-quality-release-list strong,.admin-quality-release-list small { display:block; }.admin-quality-release-list strong { color:var(--admin-text-secondary); font-size:12px; }.admin-quality-release-list small { margin-top:5px; color:var(--admin-text-muted); font-size:10px; line-height:1.4; }.admin-quality-release-list b { color:var(--admin-text-muted); font-size:10px; white-space:nowrap; }
.admin-quality-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px; }
.admin-quality-panel { min-width:0; padding:20px; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-surface); box-sizing:border-box; }
.admin-quality-panel header > b { color:var(--admin-accent); font:700 12px/1 var(--admin-mono); }
.admin-quality-hint { min-height:36px; margin:12px 0 15px; color:var(--admin-text-muted); font-size:12px; line-height:1.55; }
.admin-quality-filter { display:flex; gap:6px; margin:0 0 4px; }
.admin-quality-filter button,.admin-quality-case-actions button { min-height:28px; padding:0 9px; border:1px solid var(--admin-border-strong); border-radius:5px; background:transparent; color:var(--admin-text-muted); font:650 11px/1 var(--admin-font); cursor:pointer; }
.admin-quality-filter button.active,.admin-quality-filter button:hover { border-color:var(--admin-accent-border); background:var(--admin-accent-soft); color:var(--admin-accent); }
.admin-quality-case { display:grid; grid-template-columns:33px minmax(0,1fr) auto; gap:10px; align-items:start; padding:12px 0; border-top:1px solid var(--admin-border); }
.admin-quality-case-no { display:grid; place-items:center; width:29px; height:25px; border-radius:4px; background:var(--admin-accent-soft); color:var(--admin-accent); font:700 10px/1 var(--admin-mono); }
.admin-quality-case strong { display:-webkit-box; overflow:hidden; color:var(--admin-text-secondary); font-size:13px; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.admin-quality-case p { margin:5px 0 0; color:var(--admin-text-muted); font-size:11px; line-height:1.55; }
.admin-quality-case > b { color:#e9c47b; font-size:11px; white-space:nowrap; }
.admin-quality-case-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.admin-quality-case-actions button:first-child:hover { border-color:var(--admin-accent-border); color:var(--admin-accent); }
.admin-quality-case-actions button:last-child:hover { border-color:#b98c5b; color:#e9c47b; }
.admin-quality-duplicate.is-decided { opacity:.72; }
.admin-quality-duplicate.is-decided[data-decision="recurring"] > b { color:var(--admin-accent); }
.admin-quality-empty { padding:20px 0; border-top:1px solid var(--admin-border); color:var(--admin-text-muted); font-size:13px; line-height:1.6; }
.admin-quality-panel footer { display:flex; justify-content:space-between; gap:12px; margin-top:14px; padding-top:14px; border-top:1px solid var(--admin-border); font-size:12px; }
.admin-quality-panel footer span { color:var(--admin-text-muted); text-align:right; }
.admin-quality-coverage { grid-column:1 / -1; }
.admin-quality-mapping { grid-column:1 / -1; }
.admin-quality-mapping-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 20px; }
.admin-quality-mapping-row { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:60px; border-top:1px solid var(--admin-border); }
.admin-quality-mapping-row span { min-width:0; }
.admin-quality-mapping-row strong,.admin-quality-mapping-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-quality-mapping-row strong { color:var(--admin-text-secondary); font-size:13px; }
.admin-quality-mapping-row small { margin-top:4px; color:var(--admin-text-muted); font-size:11px; }
.admin-quality-mapping-row select { width:min(56%,220px); min-height:32px; padding:0 8px; border:1px solid var(--admin-border-strong); border-radius:5px; outline:none; background:var(--admin-surface-2); color:var(--admin-text-secondary); font:600 12px/1 var(--admin-font); }
.admin-quality-mapping-row select:focus { border-color:var(--admin-accent); }
.admin-quality-migration { grid-column:1 / -1; }
.admin-quality-migration-plan { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.admin-quality-migration-plan > div { min-height:68px; padding:12px; border:1px solid var(--admin-border); border-radius:6px; background:var(--admin-surface-2); box-sizing:border-box; }
.admin-quality-migration-plan span { display:block; overflow:hidden; color:var(--admin-text-secondary); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.admin-quality-migration-plan b { display:block; margin-top:9px; color:var(--admin-accent); font:700 18px/1 var(--admin-mono); }
.admin-quality-migration-plan b small { color:var(--admin-text-muted); font:600 11px/1 var(--admin-font); }
.admin-quality-migration-plan .admin-quality-migration-empty { grid-column:1 / -1; display:flex; align-items:center; color:var(--admin-text-muted); font-size:13px; line-height:1.55; }
.admin-quality-topic-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; }
.admin-quality-topic { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid var(--admin-border); }
.admin-quality-topic span { display:flex; align-items:center; gap:9px; min-width:0; overflow:hidden; color:var(--admin-text-secondary); font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.admin-quality-topic i { color:var(--admin-text-muted); font:700 10px/1 var(--admin-mono); }
.admin-quality-topic b { display:flex; align-items:center; gap:8px; color:var(--admin-text); font:700 12px/1 var(--admin-mono); }
.admin-quality-topic em { width:94px; height:5px; border-radius:9px; background:linear-gradient(90deg,var(--admin-accent) var(--topic-bar),var(--admin-border) var(--topic-bar)); }
.admin-quality-process { display:flex; align-items:center; gap:22px; margin-top:14px; padding:18px 20px; border:1px solid var(--admin-border); border-radius:10px; background:var(--admin-surface-2); }
.admin-quality-process > span { color:var(--admin-accent); font:700 11px/1 var(--admin-mono); white-space:nowrap; }
.admin-quality-process div { display:flex; align-items:center; gap:9px; flex:1; }
.admin-quality-process b { color:var(--admin-text-secondary); font-size:12px; white-space:nowrap; }
.admin-quality-process i { color:var(--admin-accent); font-style:normal; }
.admin-quality-process p { margin:0; color:var(--admin-text-muted); font-size:12px; line-height:1.55; }
@media (max-width:1100px) { .admin-quality-status,.admin-quality-action-grid,.admin-quality-release-list { grid-template-columns:repeat(2,minmax(0,1fr)); }.admin-quality-batch { align-items:flex-start; flex-direction:column; }.admin-quality-batch-steps { width:100%; grid-template-columns:repeat(3,minmax(0,1fr)); }.admin-quality-migration-plan { grid-template-columns:repeat(3,minmax(0,1fr)); }.admin-quality-process { align-items:flex-start; flex-direction:column; }.admin-quality-process div { flex-wrap:wrap; } }
@media (max-width:700px) { #desktop-admin-exam-quality .admin-quality-shell { width:calc(100% - 28px); padding-top:24px; }.admin-quality-head { align-items:flex-start; flex-direction:column; }.admin-quality-status,.admin-quality-action-grid,.admin-quality-grid,.admin-quality-topic-list,.admin-quality-mapping-list,.admin-quality-migration-plan,.admin-quality-batch-steps,.admin-quality-release-list { grid-template-columns:1fr; }.admin-quality-coverage,.admin-quality-mapping,.admin-quality-migration { grid-column:auto; }.admin-quality-panel footer { align-items:flex-start; flex-direction:column; }.admin-quality-panel footer span { text-align:left; }.admin-quality-topic em { width:72px; } }

/* Desktop composition for the original native admin homepage. The markup and
 * inline handlers remain untouched; only the mobile card stack becomes a
 * readable operations layout on wide screens. */
@media (min-width:981px) {
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen {
    width:100% !important;
    max-width:none !important;
    min-height:100vh !important;
    padding:0 0 90px !important;
    background:linear-gradient(180deg,#f8fbfa 0%,#edf3f1 100%) !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen {
    background:linear-gradient(180deg,#111917 0%,#090d0c 100%) !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-5.pt-10.pb-6 {
    min-height:150px !important;
    padding:34px max(48px,calc((100vw - var(--desktop-left-width) - var(--desktop-right-width) - 1240px) / 2)) 28px !important;
    background:linear-gradient(115deg,#ffffff 0%,#f1f8f5 100%) !important;
    border-bottom:1px solid #d7e5df !important;
    box-sizing:border-box !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-5.pt-10.pb-6 {
    background:linear-gradient(115deg,#18221f 0%,#111816 100%) !important;
    border-bottom-color:#2d403a !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 {
    display:grid !important;
    grid-template-columns:repeat(12,minmax(0,1fr)) !important;
    gap:16px !important;
    width:min(1240px,calc(100% - 96px)) !important;
    margin:0 auto !important;
    padding:28px 0 0 !important;
    box-sizing:border-box !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div {
    min-width:0 !important;
    margin:0 !important;
    border:1px solid #d9e5e0 !important;
    border-radius:14px !important;
    background:rgba(255,255,255,.9) !important;
    box-shadow:0 8px 24px rgba(28,71,57,.07) !important;
    overflow:hidden !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div:nth-child(1) { grid-column:1 / -1 !important; }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div:nth-child(2),
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div:nth-child(3) { grid-column:span 6 !important; }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div:nth-child(n+4) { grid-column:1 / -1 !important; }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div {
    border-color:#2b3b36 !important;
    background:#141d1a !important;
    box-shadow:0 12px 30px rgba(0,0,0,.2) !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div > .grid {
    padding:8px 12px 14px !important;
    gap:4px !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div > .grid > div {
    min-height:76px !important;
    border-radius:9px !important;
    transition:background .16s ease,transform .16s ease !important;
  }
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div > .grid > div:hover {
    background:#eaf6f2 !important;
    transform:translateY(-2px) !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div > .grid > div:hover {
    background:#1c302a !important;
  }
}

@media (max-width:980px) {
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div { grid-column:1 / -1 !important; }
}

/* Native administrator homepage: follow the dark teal system used by the
 * “今天” workspace. The existing route, controls and handlers stay intact. */
body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen {
  background: linear-gradient(180deg, #111722 0%, #0d1119 100%) !important;
}
@media (min-width:981px) {
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-5.pt-10.pb-6 {
    min-height: 0 !important;
    padding-top: 20px !important;
    padding-bottom: 18px !important;
    background: #111720 !important;
    border-bottom-color: #2a3847 !important;
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.025) !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-5.pt-10.pb-6 h1 {
    margin: 0 !important;
    font-size: 24px !important;
    letter-spacing: -.02em !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-5.pt-10.pb-6 p {
    display: none !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div {
    border-color: #2d3b4a !important;
    background: #151b24 !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.24) !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div > .grid > div:hover {
    background: #1b302f !important;
  }
  /* Module glyphs, including the generation / board entry, were visually
   * undersized against the desktop cards. */
  body.route-admin:not(.route-admin-dashboard) #app .min-h-screen > .px-4.pt-4 > div > .grid > div [class*="i-mdi"] {
    font-size: 30px !important;
    color: var(--admin-accent) !important;
  }
}

/* Shared desktop treatment for every native sub-page opened from the admin
 * homepage: records, content, reviews, forms and configuration tools. */
@media (min-width:981px) {
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen {
    max-width: none !important;
    padding: 0 0 72px !important;
    background: #0d1119 !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app .min-h-screen > :first-child:not(.px-5) {
    border-bottom: 1px solid #2a3847 !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app :is(.bg-white, .bg-card, .glass-card, .glass-card-frosted, .rounded-xl, .rounded-2xl, .rounded-3xl) {
    border-color: #2d3b4a !important;
    background-color: #151b24 !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.2) !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app :is(.border, .border-gray-100, .border-gray-200, .border-slate-100, .border-slate-200) {
    border-color: #2d3b4a !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app :is(button, [role="button"], a[class*="button"]) {
    min-height: 38px !important;
    border-color: #3a4b5d !important;
    border-radius: 8px !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app :is(button, [role="button"], a[class*="button"]):not(:disabled):hover {
    border-color: #58dfd0 !important;
    box-shadow: 0 0 0 3px rgba(88,223,208,.10) !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app :is(input, textarea, select, taro-input-core, taro-textarea-core) {
    min-height: 40px !important;
    border-color: #344554 !important;
    background: #101720 !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app table {
    border-color: #2d3b4a !important;
    background: #151b24 !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app table th {
    background: #1a222d !important;
    color: #9db0b6 !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app table tr:not(:last-child) td {
    border-bottom-color: #263543 !important;
  }
  body.route-admin.desktop-dark:not(.route-admin-dashboard) #app [class*="i-mdi"] {
    color: #58dfd0;
  }
}

/* Permissions center */
#desktop-admin-permission-center {
  min-height: 100vh;
  padding: 36px 0 72px;
  box-sizing: border-box;
  background:
    radial-gradient(920px 420px at 10% -10%, rgba(88, 223, 208, .08), transparent 56%),
    linear-gradient(180deg, #0a1016 0%, #0d1119 38%, #0b0f15 100%);
  color: var(--admin-text);
  font-family: var(--admin-font);
}
body.desktop-light #desktop-admin-permission-center {
  background:
    radial-gradient(880px 380px at 10% -10%, rgba(15, 143, 130, .08), transparent 54%),
    linear-gradient(180deg, #f8fcfb 0%, #edf4f2 40%, #e8efec 100%);
}

#desktop-admin-permission-center .admin-permission-shell {
  width: min(1440px, calc(100% - 56px));
  margin: 0 auto;
}

#desktop-admin-permission-center .admin-permission-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--admin-border);
}

#desktop-admin-permission-center .admin-permission-head > div:first-child > span,
#desktop-admin-permission-center .permission-section-head > div > span {
  display: block;
  margin-bottom: 6px;
  color: var(--admin-accent);
  font: 700 11px/1.3 var(--admin-mono);
  letter-spacing: .14em;
}

#desktop-admin-permission-center .admin-permission-head h1 {
  margin: 0 0 8px;
  font-size: 30px;
  line-height: 1.18;
  letter-spacing: -.02em;
}

#desktop-admin-permission-center .admin-permission-head p {
  max-width: 640px;
  margin: 0;
  color: var(--admin-text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

#desktop-admin-permission-center .admin-permission-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#desktop-admin-permission-center .admin-permission-head-actions button,
#desktop-admin-permission-center .admin-permission-head-actions a,
#desktop-admin-permission-center .permission-section-head button,
#desktop-admin-permission-center .permission-account-empty button,
#desktop-admin-permission-center .permission-simulator button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--admin-border-strong);
  border-radius: 8px;
  background: var(--admin-surface);
  color: var(--admin-text-secondary);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

#desktop-admin-permission-center .admin-permission-head-actions button {
  border-color: var(--admin-accent-border);
  background: var(--admin-accent-soft);
  color: var(--admin-accent);
}

#desktop-admin-permission-center .admin-permission-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0 20px;
}

#desktop-admin-permission-center .admin-permission-tabs button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: var(--admin-surface);
  color: var(--admin-text-secondary);
  font-size: 13px;
  font-weight: 700;
}

#desktop-admin-permission-center .admin-permission-tabs button.active {
  border-color: var(--admin-accent-border);
  background: var(--admin-accent-soft);
  color: var(--admin-accent);
}

#desktop-admin-permission-center .admin-permission-body {
  display: grid;
  gap: 16px;
}

#desktop-admin-permission-center .permission-overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

#desktop-admin-permission-center .permission-overview-grid article,
#desktop-admin-permission-center .permission-section,
#desktop-admin-permission-center .permission-warning,
#desktop-admin-permission-center .permission-account-empty,
#desktop-admin-permission-center .permission-simulator,
#desktop-admin-permission-center .permission-role-card,
#desktop-admin-permission-center .permission-audit-row,
#desktop-admin-permission-center .permission-matrix {
  border: 1px solid var(--admin-border);
  background: color-mix(in srgb, var(--admin-surface) 92%, transparent);
  box-shadow: 0 18px 38px rgba(0, 0, 0, .08);
}

#desktop-admin-permission-center .permission-overview-grid article {
  padding: 18px;
  border-radius: 12px;
}

#desktop-admin-permission-center .permission-overview-grid article span,
#desktop-admin-permission-center .permission-overview-grid article small {
  display: block;
  color: var(--admin-text-muted);
}

#desktop-admin-permission-center .permission-overview-grid article strong {
  display: block;
  margin: 10px 0 6px;
  font-size: 28px;
  line-height: 1;
}

#desktop-admin-permission-center .permission-section {
  padding: 18px;
  border-radius: 12px;
}

#desktop-admin-permission-center .permission-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

#desktop-admin-permission-center .permission-section-head h2 {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 1.25;
}

#desktop-admin-permission-center .permission-section-head p {
  margin: 0;
  color: var(--admin-text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

#desktop-admin-permission-center .permission-quick-grid,
#desktop-admin-permission-center .permission-role-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

#desktop-admin-permission-center .permission-quick-grid button,
#desktop-admin-permission-center .permission-role-card {
  padding: 16px;
  border-radius: 10px;
  text-align: left;
}

#desktop-admin-permission-center .permission-quick-grid button strong,
#desktop-admin-permission-center .permission-role-card strong,
#desktop-admin-permission-center .permission-account-empty strong {
  display: block;
  margin: 10px 0 6px;
  font-size: 15px;
}

#desktop-admin-permission-center .permission-quick-grid button span,
#desktop-admin-permission-center .permission-role-card span,
#desktop-admin-permission-center .permission-account-empty span {
  display: block;
  color: var(--admin-text-muted);
  font-size: 12px;
  line-height: 1.55;
}

#desktop-admin-permission-center .permission-role-card {
  color: inherit;
}

#desktop-admin-permission-center .permission-role-card.active {
  border-color: var(--admin-accent-border);
  background: var(--admin-accent-soft);
}

#desktop-admin-permission-center .permission-role-card b {
  display: inline-flex;
  margin-top: 12px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(88, 223, 208, .12);
  color: var(--admin-accent);
  font-size: 12px;
}

#desktop-admin-permission-center .permission-matrix-wrap {
  overflow: auto;
}

#desktop-admin-permission-center .permission-matrix {
  width: 100%;
  min-width: 960px;
  border-collapse: collapse;
  border-radius: 12px;
  overflow: hidden;
}

#desktop-admin-permission-center .permission-matrix th,
#desktop-admin-permission-center .permission-matrix td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--admin-border);
  vertical-align: top;
}

#desktop-admin-permission-center .permission-matrix th {
  background: var(--admin-surface-2);
  color: var(--admin-text-muted);
  font-size: 12px;
  text-align: left;
}

#desktop-admin-permission-center .permission-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#desktop-admin-permission-center .permission-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--admin-border);
  border-radius: 999px;
  background: var(--admin-surface-2);
  font-size: 12px;
}

#desktop-admin-permission-center .permission-check input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--admin-accent);
}

#desktop-admin-permission-center .permission-check.risky {
  border-color: rgba(240, 163, 152, .45);
}

#desktop-admin-permission-center .permission-risk {
  color: var(--admin-danger);
}

#desktop-admin-permission-center .permission-safe {
  color: var(--admin-text-muted);
}

#desktop-admin-permission-center .permission-scope {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--admin-text-secondary);
  font-size: 13px;
}

#desktop-admin-permission-center .permission-scope select,
#desktop-admin-permission-center .permission-simulator select {
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: var(--admin-surface);
  color: var(--admin-text);
}

#desktop-admin-permission-center .permission-account-empty,
#desktop-admin-permission-center .permission-simulator {
  padding: 18px;
  border-radius: 12px;
}

#desktop-admin-permission-center .permission-account-empty {
  display: grid;
  gap: 6px;
  justify-items: start;
}

#desktop-admin-permission-center .permission-audit-list {
  display: grid;
  gap: 10px;
}

#desktop-admin-permission-center .permission-audit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 10px;
}

#desktop-admin-permission-center .permission-audit-row > div {
  flex: 1;
  min-width: 0;
}

#desktop-admin-permission-center .permission-audit-row strong,
#desktop-admin-permission-center .permission-audit-row span {
  display: block;
}

#desktop-admin-permission-center .permission-audit-row span {
  color: var(--admin-text-muted);
  font-size: 12px;
}

#desktop-admin-permission-center .permission-simulator {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

#desktop-admin-permission-center .permission-simulator label {
  display: grid;
  gap: 8px;
  color: var(--admin-text-secondary);
  font-size: 13px;
}

#desktop-admin-permission-center .permission-sim-result {
  grid-column: 1 / -1;
  padding: 14px 16px;
  border-radius: 10px;
  background: var(--admin-surface-2);
  color: var(--admin-text-secondary);
}

#desktop-admin-permission-center .permission-sim-result .allow {
  color: var(--admin-accent);
}

#desktop-admin-permission-center .permission-sim-result .deny {
  color: var(--admin-danger);
}

#desktop-admin-permission-center .permission-warning {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 16px 18px;
  border-radius: 12px;
}

#desktop-admin-permission-center .permission-warning strong {
  display: block;
  margin-bottom: 4px;
}

#desktop-admin-permission-center .permission-warning span {
  color: var(--admin-text-secondary);
  font-size: 13px;
  line-height: 1.55;
}

@media (max-width: 1180px) {
  #desktop-admin-permission-center .permission-overview-grid,
  #desktop-admin-permission-center .permission-quick-grid,
  #desktop-admin-permission-center .permission-role-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #desktop-admin-permission-center .permission-simulator {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  #desktop-admin-permission-center {
    padding: 20px 0 56px;
  }
  #desktop-admin-permission-center .admin-permission-shell {
    width: calc(100% - 24px);
  }
  #desktop-admin-permission-center .admin-permission-head,
  #desktop-admin-permission-center .permission-section-head,
  #desktop-admin-permission-center .permission-audit-row {
    align-items: flex-start;
    flex-direction: column;
  }
  #desktop-admin-permission-center .permission-overview-grid,
  #desktop-admin-permission-center .permission-quick-grid,
  #desktop-admin-permission-center .permission-role-grid,
  #desktop-admin-permission-center .permission-simulator {
    grid-template-columns: 1fr;
  }
}
