*, *::before, *::after {
  box-sizing: border-box;
}


:root { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
body { margin:0; background:#f6f7fb; color:#111; }
.center { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:18px; }
.card { width:100%; max-width:380px; background:#fff; border:1px solid #e6e8f0; border-radius:14px; padding:22px; box-shadow: 0 6px 24px rgba(0,0,0,.06); }
h1 { margin:0 0 6px; font-size:24px; }
label { display:block; margin:12px 0 6px; font-weight:600; font-size:14px; }
input:not([type="hidden"]) {
  width: 100%;
  padding: 12px;
  border: 1px solid #d7dbe7;
  border-radius: 10px;
  font-size: 15px;
}
button:not(.btn-sm){
  margin-top:14px;
  width:100%;
  padding:12px;
  border:0;
  border-radius:10px;
  background:#111;
  color:#fff;
  font-weight:700;
  cursor:pointer;
}

button:hover { opacity:.92; }
.muted { color:#6b7280; }
.tiny { font-size:12px; margin-top:14px; }
.alert { background:#fff3f3; border:1px solid #ffd3d3; color:#8a1f1f; padding:10px; border-radius:10px; margin:12px 0; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; background:#fff; border-bottom:1px solid #e6e8f0; }
.wrap { padding:18px; }
.link { margin-left:12px; text-decoration:none; font-weight:700; color:#111; }
.pill { display:inline-block; margin-left:8px; padding:3px 10px; border:1px solid #e6e8f0; border-radius:999px; font-size:12px; background:#f8fafc; }

/* Fix table buttons (global button styles were overriding text color) */
button.btn-sm{
  width: auto;
  margin-top: 0;
  background: #fff;
  color: #111;         /* <-- this is the key */
  padding: 8px 12px;
  line-height: normal;
}

input:not([type="hidden"]):focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(17, 17, 17, 0.15);
}

.card input:not([type="hidden"]),
.card select,
.card textarea {
  display: block;
  max-width: 100%;
}