:root {
  font-family: "Microsoft YaHei UI", "Segoe UI", sans-serif;
  color: #0f172a;
  background: #eef2f7;
  font-synthesis: none;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top right, rgba(37,99,235,.08), transparent 32rem), #eef2f7; }
button, input, select, textarea { font: inherit; }
button { border: 0; }
.hidden { display: none !important; }
.app-shell { width: min(1220px, calc(100% - 32px)); margin: 0 auto; padding: 28px 0 60px; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:26px; padding:24px 28px; color:#fff; background:#0f172a; border-radius:18px; box-shadow:0 18px 42px rgba(15,23,42,.15); }
.topbar h1,.panel h2,.dialog-card h2 { margin:0; }
.eyebrow,.section-label { margin:0 0 6px; color:#60a5fa; font-size:12px; font-weight:800; letter-spacing:.14em; }
.topbar-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.panel { margin-bottom:22px; padding:28px; background:#fff; border:1px solid #dbe3ef; border-radius:18px; box-shadow:0 10px 28px rgba(15,23,42,.06); }
.login-panel { width:min(560px,100%); margin:50px auto; }
.panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:24px; }
.muted { margin:8px 0 0; color:#64748b; line-height:1.65; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.single-column { grid-template-columns:1fr; }
.field { display:flex; flex-direction:column; gap:8px; }
.field > span { font-weight:700; color:#334155; }
.field-wide { grid-column:1/-1; }
input,select,textarea { width:100%; color:#0f172a; background:#fff; border:1px solid #cbd5e1; border-radius:10px; outline:none; transition:border-color .15s, box-shadow .15s; }
input,select { min-height:46px; padding:0 13px; }
textarea { padding:12px 13px; resize:vertical; }
input:focus,select:focus,textarea:focus { border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.check-row { display:flex; align-items:center; gap:9px; color:#475569; }
.check-row input { width:17px; min-height:auto; height:17px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 16px; border-radius:10px; cursor:pointer; font-weight:800; transition:transform .12s, opacity .12s, background .12s; }
.button:hover { transform:translateY(-1px); }
.button:disabled { cursor:not-allowed; opacity:.55; transform:none; }
.button-large { min-height:48px; }
.button-primary { color:#fff; background:#2563eb; }
.button-primary:hover { background:#1d4ed8; }
.button-secondary { color:#1e293b; background:#e2e8f0; }
.topbar .button-secondary { color:#fff; background:rgba(255,255,255,.14); }
.button-danger { color:#fff; background:#b91c1c; }
.button-warning { color:#78350f; background:#fde68a; }
.button-success { color:#14532d; background:#bbf7d0; }
.button-outline-danger { color:#b91c1c; background:#fff; border:1px solid #ef4444; }
.badge { display:inline-flex; padding:7px 11px; border-radius:999px; font-size:12px; font-weight:800; }
.badge-muted { color:#cbd5e1; background:rgba(255,255,255,.1); }
.badge-success { color:#dcfce7; background:rgba(22,163,74,.3); }
.badge-error { color:#fee2e2; background:rgba(220,38,38,.32); }
.summary-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:16px; margin-bottom:22px; }
.summary-card { padding:22px; background:#fff; border:1px solid #dbe3ef; border-radius:16px; }
.summary-card span { display:block; margin-bottom:8px; color:#64748b; font-size:13px; font-weight:700; }
.summary-card strong { font-size:22px; }
.message { margin-top:18px; padding:12px 14px; border-radius:10px; line-height:1.55; white-space:pre-wrap; }
.message-info { color:#1e3a8a; background:#dbeafe; }
.message-success { color:#14532d; background:#dcfce7; }
.message-error { color:#7f1d1d; background:#fee2e2; }
.code-box { display:flex; align-items:center; gap:14px; padding:18px; background:#f8fafc; border:1px dashed #94a3b8; border-radius:13px; }
.code-box code { flex:1; font-family:Consolas,"Courier New",monospace; font-size:20px; font-weight:800; word-break:break-all; }
.detail-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:20px 0 0; }
.detail-grid > div { padding:14px; background:#f8fafc; border-radius:10px; }
.detail-wide { grid-column:1/-1; }
dt { margin-bottom:5px; color:#64748b; font-size:12px; font-weight:800; }
dd { margin:0; font-weight:700; }
.break-all { word-break:break-all; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th,td { padding:13px 12px; text-align:left; border-bottom:1px solid #e2e8f0; vertical-align:top; }
th { color:#475569; background:#f8fafc; font-size:13px; white-space:nowrap; }
.empty-cell { color:#94a3b8; text-align:center; }
.status-active { color:#166534; font-weight:800; }
.status-other { color:#92400e; font-weight:800; }
.status-badge { display:inline-flex; align-items:center; padding:5px 9px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; }
.status-ready { color:#1e40af; background:#dbeafe; }
.status-activated { color:#166534; background:#dcfce7; }
.status-disabled { color:#92400e; background:#fef3c7; }
.status-revoked { color:#991b1b; background:#fee2e2; }
.status-pending,.status-preparing { color:#5b21b6; background:#ede9fe; }
.toolbar-grid { display:grid; grid-template-columns:minmax(280px,2fr) minmax(150px,1fr) minmax(150px,1fr) auto; align-items:end; gap:14px; }
.toolbar-action { display:flex; align-items:flex-end; }
.management-table-wrap { margin-top:18px; }
.management-table { min-width:1080px; }
.table-primary { font-weight:800; color:#0f172a; }
.table-secondary { margin-top:4px; color:#64748b; font-size:12px; }
.table-code { font-family:Consolas,"Courier New",monospace; }
.pagination { display:flex; justify-content:center; align-items:center; gap:14px; margin-top:18px; }
.verification-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.verification-card { padding:20px; border:1px solid #dbe3ef; border-radius:14px; background:#f8fafc; }
.verification-card h3,.log-section h3 { margin:0 0 8px; }
.verification-card .button { margin-top:14px; }
.verification-result { margin-top:16px; padding:15px; border-radius:10px; line-height:1.65; }
.verification-valid { color:#14532d; background:#dcfce7; }
.verification-invalid { color:#7f1d1d; background:#fee2e2; }
.verification-result strong { display:block; margin-bottom:5px; }
dialog { width:min(600px,calc(100% - 28px)); padding:0; border:0; border-radius:18px; box-shadow:0 24px 70px rgba(15,23,42,.28); }
dialog::backdrop { background:rgba(15,23,42,.58); }
.detail-dialog { width:min(1060px,calc(100% - 28px)); }
.dialog-card { display:flex; flex-direction:column; gap:18px; padding:26px; }
.detail-dialog-card { max-height:calc(100vh - 36px); overflow:auto; }
.dialog-heading { display:flex; justify-content:space-between; gap:14px; }
.icon-button { width:38px; height:38px; color:#475569; background:#e2e8f0; border-radius:50%; cursor:pointer; font-size:24px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; }
.notice { margin:0; padding:12px 14px; color:#475569; background:#f1f5f9; border-radius:10px; line-height:1.6; }
.detail-status-line { display:flex; align-items:center; flex-wrap:wrap; gap:12px; color:#475569; }
.detail-data-grid { margin-top:0; }
.management-actions { display:flex; flex-wrap:wrap; gap:10px; padding:16px; background:#f8fafc; border-radius:12px; }
.log-section { padding-top:4px; }
.log-table-wrap { max-height:360px; }
.log-table-wrap table { min-width:900px; }
.log-success { color:#166534; font-weight:800; }
.log-failed { color:#b91c1c; font-weight:800; }
@media (max-width:800px) {
  .app-shell { width:min(100% - 18px,1220px); padding-top:10px; }
  .topbar,.panel-heading,.code-box { align-items:stretch; flex-direction:column; }
  .form-grid,.detail-grid,.verification-grid,.toolbar-grid { grid-template-columns:1fr; }
  .field-wide,.detail-wide { grid-column:auto; }
  .panel,.topbar { padding:20px; border-radius:14px; }
  .toolbar-action .button { width:100%; }
}

.ip-location{margin-top:4px;color:#2563eb;font-size:12px;font-weight:700;line-height:1.45}.ip-location-muted{color:#94a3b8}