* { box-sizing: border-box; }
body {
  font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  max-width: 960px; margin: 0 auto; padding: 16px;
  background: #f7f7f9; color: #222;
}
header {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 12px; border-bottom: 1px solid #ddd; margin-bottom: 16px;
}
h1 { margin: 0; font-size: 20px; }
h2 { margin-top: 0; font-size: 16px; color: #333; }
h3 { font-size: 14px; color: #555; margin-top: 20px; margin-bottom: 6px; }

.card {
  background: #fff; padding: 16px; border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05); margin-bottom: 16px;
}
label { display: block; margin-bottom: 8px; font-size: 14px; }
input, select {
  padding: 6px 8px; border: 1px solid #ccc; border-radius: 4px;
  font-size: 14px; margin-right: 4px; min-width: 120px;
}
button {
  padding: 6px 14px; border: 0; background: #4a90e2; color: #fff;
  border-radius: 4px; cursor: pointer; font-size: 14px; margin-right: 4px;
}
button:hover { background: #3a7bc8; }
button:disabled { background: #bbb; cursor: not-allowed; }

.row { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 8px; }
.muted { color: #888; font-size: 13px; }
pre {
  background: #f0f0f4; padding: 8px; border-radius: 4px;
  overflow-x: auto; font-size: 12px; max-height: 240px; overflow-y: auto;
}
#auth-bar { display: flex; align-items: center; gap: 8px; }
