:root {
  --surety-bg: #f6f7f9;
  --surety-surface: #ffffff;
  --surety-surface-2: #eef1f5;
  --surety-text: #111827;
  --surety-muted: #64748b;
  --surety-border: #dbe1ea;
  --surety-brand: #111827;
  --surety-accent: #2563eb;
  --surety-success: #047857;
  --surety-warning: #b45309;
  --surety-danger: #b91c1c;
  --surety-radius: 18px;
  --surety-shadow: 0 18px 50px rgba(15, 23, 42, .08);
  --surety-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
[data-surety-theme="dark"], .surety-shell[data-surety-theme="dark"] {
  --surety-bg: #0b0f17;
  --surety-surface: #111827;
  --surety-surface-2: #1f2937;
  --surety-text: #f8fafc;
  --surety-muted: #9aa7b8;
  --surety-border: #293446;
  --surety-brand: #f8fafc;
  --surety-accent: #60a5fa;
  --surety-success: #34d399;
  --surety-warning: #f59e0b;
  --surety-danger: #f87171;
  --surety-shadow: 0 20px 70px rgba(0, 0, 0, .32);
}
.surety-shell, .surety-admin {
  font-family: var(--surety-font);
  color: var(--surety-text);
}
.surety-shell {
  background: var(--surety-bg);
  border: 1px solid var(--surety-border);
  border-radius: 28px;
  padding: clamp(18px, 3vw, 34px);
  margin: 24px auto;
  max-width: 1180px;
  box-shadow: var(--surety-shadow);
}
.surety-topbar { display:flex; justify-content:space-between; gap:18px; align-items:center; margin-bottom:22px; }
.surety-topbar h1, .surety-admin h1 { margin:0; font-size:clamp(28px, 4vw, 48px); letter-spacing:-.04em; line-height:1; }
.surety-eyebrow { text-transform:uppercase; letter-spacing:.12em; color:var(--surety-muted); font-size:12px; font-weight:800; margin:0 0 8px; }
.surety-nav { display:flex; gap:8px; overflow:auto; padding:8px; border:1px solid var(--surety-border); border-radius:999px; background:var(--surety-surface); margin-bottom:22px; }
.surety-nav button { border:0; background:transparent; color:var(--surety-muted); padding:10px 14px; border-radius:999px; font-weight:700; white-space:nowrap; cursor:pointer; }
.surety-nav button.is-active, .surety-nav button:hover { color:var(--surety-text); background:var(--surety-surface-2); }
.surety-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:16px; }
.surety-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.surety-card { background:var(--surety-surface); border:1px solid var(--surety-border); border-radius:var(--surety-radius); padding:20px; box-shadow:0 1px 0 rgba(15,23,42,.03); }
.surety-card h2, .surety-card h3 { margin:0 0 10px; letter-spacing:-.02em; }
.surety-card p { color:var(--surety-muted); line-height:1.55; }
.surety-button, .surety-shell button.surety-button, .surety-form button { appearance:none; border:1px solid var(--surety-brand); background:var(--surety-brand); color:var(--surety-bg); border-radius:12px; padding:11px 14px; font-weight:800; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; }
.surety-button-secondary, .surety-shell button.surety-button-secondary { background:var(--surety-surface); color:var(--surety-text); border-color:var(--surety-border); }
.surety-button:disabled { opacity:.55; cursor:not-allowed; }
.surety-badge { display:inline-flex; align-items:center; border-radius:999px; border:1px solid var(--surety-border); background:var(--surety-surface-2); padding:5px 9px; font-size:12px; font-weight:800; color:var(--surety-text); }
.surety-badge.success { color:var(--surety-success); } .surety-badge.warning { color:var(--surety-warning); } .surety-badge.danger { color:var(--surety-danger); }
.surety-form { display:grid; gap:12px; }
.surety-form label { display:grid; gap:6px; font-weight:700; }
.surety-form input, .surety-form select, .surety-form textarea { width:100%; box-sizing:border-box; border:1px solid var(--surety-border); background:var(--surety-surface); color:var(--surety-text); border-radius:12px; padding:12px 13px; min-height:44px; }
.surety-form textarea { min-height:120px; }
.surety-table-wrap { overflow:auto; border:1px solid var(--surety-border); border-radius:16px; background:var(--surety-surface); }
.surety-table { width:100%; border-collapse:collapse; min-width:720px; }
.surety-table th, .surety-table td { padding:13px 14px; border-bottom:1px solid var(--surety-border); text-align:left; }
.surety-table th { font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--surety-muted); }
.surety-alert { border:1px solid var(--surety-border); border-left:4px solid var(--surety-accent); border-radius:16px; background:var(--surety-surface); padding:14px; margin:14px 0; }
.surety-alert.warning { border-left-color:var(--surety-warning); } .surety-alert.danger { border-left-color:var(--surety-danger); } .surety-alert.success { border-left-color:var(--surety-success); }
.surety-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.surety-loading { padding:28px; border:1px dashed var(--surety-border); border-radius:18px; color:var(--surety-muted); background:var(--surety-surface); }
.surety-kpi { font-size:34px; font-weight:900; letter-spacing:-.04em; color:var(--surety-text); }
.surety-muted { color:var(--surety-muted); }
.surety-list { display:grid; gap:10px; padding:0; margin:0; list-style:none; }
.surety-list li { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--surety-border); padding:10px 0; }
.surety-admin .surety-card { max-width: none; }
@media (max-width: 760px) {
  .surety-shell { border-radius:18px; margin:12px auto; padding:14px; }
  .surety-topbar { align-items:flex-start; flex-direction:column; }
  .surety-grid, .surety-grid-3 { grid-template-columns:1fr; }
  .surety-nav { border-radius:18px; flex-wrap:nowrap; }
  .surety-card { padding:16px; }
  .surety-list li { flex-direction:column; }
}
