:root { --fg: #1a1a1a; --muted: #555; --accent: #0b5cad; --bg: #fff; --line: #ccc; --ok: #e7f5e9; --bad: #fdecea; }
* { box-sizing: border-box; }
body { font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--fg); background: var(--bg); margin: 0; }
main { max-width: 1200px; margin: 0 auto; padding: 1rem; }
header { background: #f2f4f7; border-bottom: 1px solid var(--line); }
nav { max-width: 1200px; margin: 0 auto; padding: .5rem 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; justify-content: space-between; }
nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
a { color: var(--accent); }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 1rem; top: 1rem; background: #fff; padding: .5rem; }
footer { max-width: 1200px; margin: 2rem auto; padding: 0 1rem; color: var(--muted); font-size: .9rem; }
table { border-collapse: collapse; width: 100%; margin: 1rem 0; }
th, td { border: 1px solid var(--line); padding: .35rem .5rem; text-align: left; vertical-align: top; }
th { background: #f7f7f7; }
.stack { display: flex; flex-direction: column; gap: .4rem; max-width: 900px; margin: 1rem 0; }
.narrow { max-width: 420px; }
.grid-form { display: grid; grid-template-columns: max-content 1fr; gap: .4rem .8rem; max-width: 900px; align-items: start; }
.grid-form button { grid-column: 2; justify-self: start; }
.filters { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; }
input, select, textarea, button { font: inherit; padding: .35rem .5rem; }
textarea { width: 100%; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .9rem; }
button { cursor: pointer; background: var(--accent); color: #fff; border: 0; border-radius: 4px; padding: .5rem 1rem; }
.logout button { background: #555; }
fieldset { border: 1px solid var(--line); }
.notice { background: var(--ok); border: 1px solid #9fd3a8; padding: .5rem 1rem; }
.errors, .error { background: var(--bad); border: 1px solid #f0a8a0; padding: .5rem 1rem; }
.counts { display: flex; flex-wrap: wrap; gap: 1rem; }
.counts div { border: 1px solid var(--line); padding: .5rem 1rem; min-width: 10rem; }
.counts dd { font-size: 1.6rem; margin: 0; }
.details { display: grid; grid-template-columns: max-content 1fr; gap: .2rem 1rem; }
.details dt { font-weight: 600; }
.details dd { margin: 0; white-space: pre-wrap; }
.status { font-weight: 600; }
.status-unreported { color: #0b6b2b; } .status-reported { color: #0b5cad; } .status-rejected, .status-closed { color: #9b1c1c; } .status-archived { color: var(--muted); }
pre { background: #f7f7f7; padding: .75rem; overflow: auto; white-space: pre-wrap; }
.lead { font-size: 1.15rem; color: var(--muted); }
#report-items h2 { font-size: 1.1rem; margin: .8rem 0 .2rem; }