body { font: 14px/1.4 system-ui, sans-serif; margin: 0 1rem 2rem; }
header { display: flex; align-items: center; gap: 1rem; border-bottom: 1px solid #ccc; }
h1 { font-size: 1.2rem; }
h2 { font-size: 1.1rem; margin-top: 1.5rem; }
h3 { font-size: 1rem; margin: 1rem 0 0.3rem; }
#status { min-height: 1.4em; }
#status.error { color: #b00020; }
#status.ok { color: #1b5e20; }
.hint { color: #666; }
table { border-collapse: collapse; margin: 0.3rem 0; }
th, td { border: 1px solid #ddd; padding: 2px 6px; text-align: left; vertical-align: top; }
th { background: #f4f4f4; }
td.num { text-align: right; font-variant-numeric: tabular-nums; }
.forms { display: flex; flex-wrap: wrap; gap: 1rem; }
.forms form { border: 1px solid #ccc; padding: 0.5rem 0.8rem; display: flex; flex-direction: column; gap: 0.3rem; min-width: 14rem; }
.forms label { display: flex; justify-content: space-between; gap: 0.5rem; }
.forms input[type=number] { width: 8rem; }
.banned { color: #b00020; font-weight: bold; }
body.read-only .write { display: none; }
#tabs { display: flex; gap: 0.3rem; margin-top: 0.8rem; border-bottom: 1px solid #ccc; }
#tabs button { border: 1px solid #ccc; border-bottom: none; background: #f4f4f4; padding: 0.3rem 0.8rem; cursor: pointer; }
#tabs button.active { background: #fff; font-weight: bold; }
td.details { max-width: 28rem; word-break: break-all; font-family: ui-monospace, monospace; font-size: 12px; }
