:root {
  --ink: #1b1f24;
  --muted: #57606a;
  --line: #d0d7de;
  --bg: #ffffff;
  --soft: #f6f8fa;
  --accent: #0b5cad;
  --accent-ink: #ffffff;
  --bad: #a40e26;
  --bad-bg: #ffebe9;
  --ok: #116329;
  --ok-bg: #dafbe1;
  --warn-bg: #fff8c5;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.5;
}

.wrap { max-width: 52rem; margin: 0 auto; padding: 0 1rem; }
.wrap-wide { max-width: 72rem; }
a { color: var(--accent); }

.skip { position: absolute; left: -10000px; }
.skip:focus { left: 1rem; top: 1rem; background: #fff; padding: 0.5rem; z-index: 10; }

header.site { border-bottom: 1px solid var(--line); background: var(--soft); }
header.site .wrap {
  display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between;
  padding-top: 0.75rem; padding-bottom: 0.75rem;
}
.brand { font-weight: 700; text-decoration: none; color: var(--ink); font-size: 1.15rem; }
nav a { margin-left: 1rem; }
nav a:first-child { margin-left: 0; }

.hero { padding: 2rem 0 1rem; }
.hero h1 { font-size: 2rem; line-height: 1.2; margin: 0 0 0.5rem; }
.sub { font-size: 1.15rem; color: var(--muted); margin: 0; }

.notice { border-left: 4px solid #9a6700; background: var(--warn-bg); padding: 0.75rem 1rem; margin: 1rem 0 1.5rem; }
.notice p { margin: 0; }

section { margin: 2rem 0; }
h2 { font-size: 1.4rem; margin: 0 0 0.75rem; }
.muted { color: var(--muted); }
.req { font-weight: 400; color: var(--bad); }

.field { margin: 0 0 1rem; }
label, legend { display: block; font-weight: 600; margin-bottom: 0.25rem; }
.hint { display: block; font-weight: 400; color: var(--muted); font-size: 0.9rem; }
input[type="text"], input[type="email"], select, textarea {
  width: 100%; font: inherit; padding: 0.5rem 0.6rem;
  border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink);
}
textarea { min-height: 5.5rem; resize: vertical; }
textarea.short { min-height: 3.5rem; }
[aria-invalid="true"] { border-color: var(--bad); outline: 2px solid var(--bad); }
fieldset { border: 1px solid var(--line); border-radius: 8px; padding: 0.75rem 1rem 1rem; margin: 0 0 1rem; }
.radio { display: flex; gap: 0.5rem; align-items: flex-start; font-weight: 400; margin: 0.25rem 0; }
.radio input { margin-top: 0.3rem; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }

.btn {
  display: inline-block; font: inherit; font-weight: 600; padding: 0.6rem 1rem; border-radius: 6px;
  border: 1px solid var(--accent); background: var(--accent); color: var(--accent-ink);
  text-decoration: none; cursor: pointer;
}
.btn:hover { filter: brightness(1.08); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-secondary { background: #fff; color: var(--accent); }
.actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.75rem 0; }

.errors { border: 1px solid var(--bad); background: var(--bad-bg); color: var(--bad); border-radius: 6px; padding: 0.5rem 1rem; margin: 1rem 0; }
.errors p { margin: 0.25rem 0; font-weight: 600; }
.warn { background: var(--warn-bg); border: 1px solid #d4a72c; border-radius: 6px; padding: 0.5rem 1rem; margin: 0.75rem 0; }

pre.brief {
  white-space: pre-wrap; overflow-wrap: break-word; background: var(--soft);
  border: 1px solid var(--line); border-radius: 8px; padding: 1rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.92rem;
}

.cols { columns: 2; }
.downloads { list-style: none; padding: 0; }
.downloads li { margin: 0.4rem 0; }

.status { margin-top: 0.75rem; }
.status.ok { color: var(--ok); background: var(--ok-bg); padding: 0.5rem; border-radius: 6px; }
.status.bad { color: var(--bad); background: var(--bad-bg); padding: 0.5rem; border-radius: 6px; }

.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.offscreen { position: fixed; left: -10000px; top: 0; opacity: 0; }

.log-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.9rem; }
.log-table th, .log-table td { border: 1px solid #57606a; padding: 0.3rem 0.4rem; text-align: left; vertical-align: top; }
.log-table th { background: var(--soft); }
.log-table td { height: 2.6rem; }
.log-table.compact td { height: 2rem; }
.col-num { width: 2.4rem; }
.col-when { width: 11%; }
.col-biz { width: 15%; }
.col-who { width: 12%; }
.col-outcome { width: 20%; }
.col-ref { width: 12%; }
.col-follow { width: 9%; }
.col-done { width: 8%; }

.sheet-fields { display: flex; flex-wrap: wrap; gap: 0.5rem 2rem; margin: 0.5rem 0 1rem; }
.sheet-fields span { min-width: 15rem; border-bottom: 1px solid #57606a; padding-bottom: 0.1rem; }
.lines p { border-bottom: 1px solid #57606a; height: 1.6rem; margin: 0; }
.log-page { margin: 2rem 0; }
.print-only { display: none; }

footer.site { border-top: 1px solid var(--line); margin-top: 3rem; padding: 1rem 0 2rem; color: var(--muted); font-size: 0.9rem; }
footer.site a { margin-right: 1rem; }

@media (max-width: 40rem) {
  .grid2 { grid-template-columns: 1fr; }
  .cols { columns: 1; }
  nav a { margin-left: 0.6rem; }
  .hero h1 { font-size: 1.6rem; }
}

@media print {
  @page { size: landscape; margin: 0.4in; }
  body { font-size: 10pt; color: #000; background: #fff; }
  .no-print, header.site, footer.site, .skip { display: none !important; }
  .print-only { display: block !important; }
  .wrap { max-width: none; padding: 0; }
  section { margin: 0; }
  h1 { font-size: 16pt; margin: 0 0 0.1in; }
  h2 { font-size: 12pt; margin: 0.1in 0; }
  a { color: #000; text-decoration: none; }
  pre.brief { border: none; background: #fff; padding: 0; font-size: 10pt; }
  .sheet-fields { margin: 0.05in 0 0.1in; }
  .log-sheet { break-inside: avoid; page-break-inside: avoid; }
  .log-table { font-size: 9pt; }
  .log-table th { background: #fff; }
  .log-table thead { display: table-header-group; }
  .log-table tr { break-inside: avoid; page-break-inside: avoid; }
  .log-table td { height: 0.55in; }
  .log-table.compact td { height: 0.38in; }
  .lines p { height: 0.3in; }
  .log-page { margin: 0; break-after: page; page-break-after: always; }
  .log-page:last-child { break-after: auto; page-break-after: auto; }
}
