body { font-family: system-ui, "PingFang SC", sans-serif; max-width: 860px;
       margin: 2rem auto; padding: 0 1rem; color: #222; }
h1 { font-size: 1.4rem; }
h2 { font-size: 1.1rem; margin-top: 1.5rem; }
section { border: 1px solid #ddd; border-radius: 8px; padding: 1rem; margin: 1rem 0; }
textarea, input, select { font-size: 1rem; padding: .3rem .5rem; }
textarea { width: 100%; box-sizing: border-box; }
button { font-size: 1rem; padding: .35rem .9rem; margin: .5rem .3rem 0 0;
         cursor: pointer; }
table { border-collapse: collapse; width: 100%; margin-top: .5rem; }
td, th { border: 1px solid #e5e5e5; padding: .4rem .6rem; text-align: left; }
.hidden { display: none; }
.error { color: #c00; }
.ok { color: #12805c; font-weight: 600; }
.msg { color: #c00; font-size: .85rem; }
input.invalid, select.invalid { border: 1px solid #c00; outline: none; }
#force-row { display: block; margin-top: .6rem; color: #b46a00; }
#submit-status { margin-left: .5rem; }

.overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45);
  display: flex; align-items: center; justify-content: center; z-index: 100; }
.overlay.hidden { display: none; }
.overlay .card { background: #fff; padding: 24px; border-radius: 8px;
  min-width: 280px; display: flex; flex-direction: column; gap: 10px; }
.overlay .admin-card { width: min(680px, 92vw); max-height: 85vh; overflow: auto; }
.admin-card #new-user-form { display: flex; flex-wrap: wrap; gap: 6px;
  align-items: center; }
#topbar { display: flex; gap: 12px; align-items: center;
  justify-content: flex-end; padding: 8px 0; }
#topbar .link { background: none; border: none; color: #1677ff;
  cursor: pointer; padding: 0; }
.hint { color: #888; font-size: 12px; }
.busy-card { align-items: center; text-align: center; min-width: 240px; }
.spinner { width: 42px; height: 42px; border: 4px solid #e3e6ea;
  border-top-color: #1677ff; border-radius: 50%; margin: 4px auto;
  animation: spin 0.9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
#busy-msg { font-weight: 600; margin: 4px 0 0; }
#list-controls { display: flex; gap: 10px; align-items: center; margin: 8px 0; }
#list-controls #page-info { color: #666; font-size: 13px; }