body { margin: 24px; background: #f7f7f5; color: #171717; font: 14px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
main { max-width: 980px; }
h1 { font-size: 22px; font-weight: 600; margin-bottom: 0; }
p { margin: 10px 0; }
.muted { color: #555; font-size: 12px; }
form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 20px 0 8px; }
input, button { font: inherit; padding: 6px 8px; border: 1px solid #888; border-radius: 0; background: white; color: inherit; }
input { flex: 1; min-width: 220px; }
button { cursor: pointer; }
button:disabled { color: #777; cursor: wait; }
table { border-collapse: collapse; width: 100%; margin: 18px 0; font-variant-numeric: tabular-nums; }
caption { text-align: left; font-weight: 600; margin-bottom: 5px; }
th, td { border: 1px solid #aaa; padding: 6px 10px; text-align: left; overflow-wrap: anywhere; }
tbody th { width: 40%; font-weight: 400; background: #eee; }
hr { border: 0; border-top: 1px solid #bbb; margin-top: 24px; }
#message { white-space: pre-wrap; }
[hidden] { display: none !important; }
@media (max-width: 600px) { body { margin: 12px; } table { font-size: 12px; } th, td { padding: 5px; } input { flex-basis: 70%; } }