:root {
  --svp-bg: #f4f6fb;
  --svp-surface: #ffffff;
  --svp-text: #0f172a;
  --svp-muted: #64748b;
  --svp-border: rgba(15, 23, 42, .10);
  --svp-primary: #2563eb;
  --svp-success: #059669;
  --svp-warning: #d97706;
  --svp-danger: #dc2626;
  --svp-radius: 10px;
  --svp-shadow: 0 10px 24px rgba(2, 6, 23, .07);
}

body {
  background: var(--svp-bg);
  color: var(--svp-text);
}

.card-soft {
  background: var(--svp-surface);
  border: 1px solid var(--svp-border);
  border-radius: var(--svp-radius);
  box-shadow: var(--svp-shadow);
}

.page-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.page-title {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0;
}

.page-subtitle {
  color: var(--svp-muted);
  font-size: .9rem;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}

.btn {
  border-radius: 8px;
}

.table {
  --bs-table-bg: transparent;
}

.table thead th {
  color: var(--svp-muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  border-bottom-color: var(--svp-border);
}

.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.auth-shell {
  max-width: 540px;
}

@media (max-width: 768px) {
  .page-top {
    align-items: stretch;
    flex-direction: column;
  }

  .nav-actions .btn {
    flex: 1 1 auto;
  }
}