* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: #fafafa;
  color: #1a1a1a;
  line-height: 1.5;
}
.nav {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  padding: 0.8rem 1.5rem;
  background: #1e1e2e;
  color: #fafafa;
  border-bottom: 1px solid #0f0f1e;
}
.nav a { color: #fafafa; text-decoration: none; }
.nav a:hover { text-decoration: underline; }
.nav .brand { font-weight: 600; margin-right: auto; }
.nav form.inline { margin: 0; display: inline; }
.linkbtn {
  background: none; border: none; color: #fafafa;
  cursor: pointer; padding: 0; font: inherit;
}
.linkbtn:hover { text-decoration: underline; }
.linkbtn.danger { color: #f97373; }

.wrap { max-width: 1100px; margin: 1.5rem auto; padding: 0 1.5rem; }
.muted { color: #777; }

h1 { margin-top: 0.5rem; }
h2 { margin-top: 2rem; border-bottom: 1px solid #ddd; padding-bottom: .3rem; }
section { margin-top: 1.5rem; }

.grid {
  width: 100%; border-collapse: collapse; background: #fff;
  margin: 1rem 0; box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.grid th, .grid td {
  padding: .5rem .8rem; text-align: left;
  border-bottom: 1px solid #eee;
  vertical-align: top;
}
.grid th { background: #f4f4f6; font-weight: 600; }
.grid.small th, .grid.small td { font-size: 0.92em; padding: .3rem .6rem; }
.grid code { background: #eef; padding: 0 .3em; border-radius: 3px; }
.wrap-text { white-space: pre-wrap; word-break: break-word; max-width: 360px; }

form.stack { display: flex; flex-direction: column; gap: .6rem;
             max-width: 560px; }
form.inline-form { display: flex; gap: .5rem; align-items: center;
                   margin: 0.5rem 0 1rem; }
form label { display: flex; flex-direction: column; font-size: .9em;
             color: #444; gap: .2rem; }
form input[type=text], form input[type=number], form textarea {
  padding: .45rem .6rem; border: 1px solid #ccc; border-radius: 4px;
  font: inherit; background: #fff;
}
form input[type=checkbox] { margin-right: .4rem; }
form button[type=submit] {
  padding: .5rem 1rem; background: #2563eb; color: #fff;
  border: none; border-radius: 4px; cursor: pointer; font-weight: 600;
  align-self: flex-start;
}
form button[type=submit]:hover { background: #1d4ed8; }

.login-box {
  max-width: 520px; margin: 3rem auto; padding: 2rem;
  background: #fff; border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.login-box h1 { text-align: center; }
.login-box hr { border: none; border-top: 1px solid #eee; margin: 1.5rem 0; }
.login-box .widget-slot { min-height: 48px; text-align: center; margin: 1rem 0; }
.login-box .steps { padding-left: 1.2rem; }
.login-box .steps li { margin-bottom: .4rem; }
.login-box code {
  background: #eef; padding: 2px 6px; border-radius: 3px;
  font-family: ui-monospace, monospace;
}
