:root { --fg: #1b1f23; --muted: #57606a; --line: #d0d7de; --bg: #ffffff; --card: #f6f8fa; --accent: #0b5cad; --warn: #9a3412; --ok: #116329; }
@media (prefers-color-scheme: dark) { :root { --fg: #e6edf3; --muted: #9da7b3; --line: #30363d; --bg: #0d1117; --card: #161b22; --accent: #58a6ff; --warn: #f0883e; --ok: #3fb950; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 17px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
main { max-width: 44rem; margin: 0 auto; padding: 16px; }
h1 { font-size: 1.4rem; }
.banner { padding: 12px 14px; border-radius: 8px; background: var(--card); border-left: 4px solid var(--accent); margin: 12px 0; }
.progress { color: var(--muted); }
details.card { border: 1px solid var(--line); border-radius: 10px; margin: 12px 0; background: var(--card); }
details.card > summary { padding: 12px 14px; cursor: pointer; font-weight: 600; }
details.card .body { padding: 0 14px 14px; }
.crop img { max-width: 100%; height: auto; border: 1px solid var(--line); border-radius: 6px; }
.q { border-top: 1px solid var(--line); padding-top: 12px; margin-top: 12px; }
.q .why, .note, .by { color: var(--muted); font-size: 0.92rem; }
.q .new { color: var(--accent); font-weight: 700; margin-right: 6px; }
.q .error, .q .rejected { color: var(--warn); }
.q .saved { color: var(--ok); }
.q form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
button, input, select, textarea { font: inherit; }
button { padding: 10px 14px; border-radius: 8px; border: 1px solid var(--line); background: var(--bg); color: var(--fg); min-height: 44px; }
button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
input, select, textarea { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--fg); min-height: 44px; max-width: 100%; }
textarea { width: 100%; min-height: 5rem; }
table { border-collapse: collapse; width: 100%; }
td, th { border-bottom: 1px solid var(--line); padding: 6px; text-align: left; vertical-align: top; }
.downloads li { margin: 6px 0; }
[hidden] { display: none !important; }
button:disabled { opacity: 0.45; cursor: not-allowed; }
button.suggested { border-color: var(--accent); font-weight: 600; }
.submit-note { color: var(--muted); margin-top: 6px; }
.q form label.field { display: block; width: 100%; }
.q form label.field input, .q form label.field select { display: block; width: 100%; margin-top: 4px; }
a.zoomable { display: block; margin: 8px 0; }
a.zoomable img { width: 100%; height: auto; border: 1px solid var(--line); border-radius: 6px; }
.zoom { display: none; position: fixed; inset: 0; z-index: 10; background: rgba(0, 0, 0, 0.92); flex-direction: column; align-items: center; justify-content: center; padding: 12px; }
.zoom:target { display: flex; }
.zoom img { width: 100%; max-height: 85vh; object-fit: contain; background: #fff; }
.zoom .close { color: #fff; font-size: 1.1rem; align-self: flex-end; padding: 8px 4px 12px; }
/* position: a header's hidden label (.sr) is placed within its scrolling table, not the page, so a wide table never widens the page; min-width: 0 lets the table scroll inside a flex form (Blair's iPhone, 2026-10-16). */
.flights { overflow-x: auto; margin: 8px 0; position: relative; min-width: 0; max-width: 100%; }
.flights table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: 0.95rem; }
.flights th { text-align: left; font-weight: 600; color: var(--muted); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; padding: 4px 8px 4px 0; border-bottom: 1px solid var(--line); white-space: nowrap; }
.flights td { padding: 6px 8px 6px 0; border-bottom: 1px solid var(--line); white-space: nowrap; }
.flights td:first-child { color: var(--muted); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
input.exclude { appearance: none; -webkit-appearance: none; width: 2rem; height: 2rem; min-height: 0; margin: 0; padding: 0; border: none; background: none; cursor: pointer; }
input.exclude::before { content: "\2713"; color: var(--ok); font-size: 1.4rem; font-weight: 700; }
input.exclude:checked::before { content: "\2717"; color: var(--warn); }
.flights tr:has(input.exclude:checked) td:not(:has(input.exclude)) { opacity: 0.45; text-decoration: line-through; }
.flights tr.pick { display: none; }
.flights tr:has(input.exclude:checked) + tr.pick { display: table-row; }
.exc-pick { font-size: 0.9rem; min-height: 0; padding: 4px 6px; }
.flights td:has(input.exclude) { width: 2.2rem; text-align: center; }
.when-some { display: none; }
form:has(input.exclude:checked) .when-some { display: inline; }
form:has(input.exclude:checked) .when-all { display: none; }
.q form > .note, .q form > .flights { flex-basis: 100%; width: 100%; margin: 0; }
a.zoomable.sig { display: inline-block; margin: 0; }
a.zoomable.sig img { width: 7rem; max-width: none; }
.flights td.remarks { white-space: normal; min-width: 6rem; max-width: 9rem; }
/* Line shows "page 12" over "line 7", no comma, so the table is narrower in portrait (Blair, 2026-10-16). */
.flights td.line { white-space: nowrap; }
.flights td.route { white-space: normal; max-width: 5.5rem; }
/* Aircraft fits PA-28-161 and PA-28R-201 (measured, padding included); a longer name ("Redbird FMX …") wraps at its spaces (Blair, 2026-10-16). */
.flights td.aircraft { white-space: normal; min-width: 7em; max-width: 7em; }
.selected-btn { display: none; }
form:has(input.exclude:checked):has(input.exclude:not(:checked)) .selected-btn { display: inline-block; }

/* A line's labeled fields share one form: two to a row, an odd last field the full width (Blair, 2026-10-16). */
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem .75rem; margin: .5rem 0; }
.q form .fields label.field { display: flex; flex-direction: column; gap: .25rem; margin: 0; }
.q form .fields label.field span { font-weight: 600; font-size: .9rem; }
.q form .fields label.field span.prompt { flex: 1; font-weight: 400; font-size: 1rem; }
.q form .fields label.field input { width: 100%; box-sizing: border-box; }
.q form .fields label.field:last-child:nth-child(odd) { grid-column: 1 / -1; }
.banner.saved { border-left-color: var(--ok); }
.q form .fields label.field .alt { display: flex; align-items: center; gap: .4rem; font-weight: 400; font-size: .95rem; }
.q form .fields label.field .alt input { width: auto; margin: 0; }
.q form label.or { flex-basis: 100%; margin: 4px 0 0; font-size: .95rem; color: var(--muted); }
.q.decision .prompt { font-weight: 600; }
.q.decision ul.grounds, .q.decision ul.by-row { margin: 6px 0; padding-left: 20px; color: var(--muted); font-size: 0.92rem; }
.q.decision .stands { color: var(--ok); }
.q.decision details.challenge > summary { cursor: pointer; color: var(--accent); margin-top: 8px; }
/* Contract v8 (logbook-service v8 spec §5): listings as compact lines, the free-text box, "I don't know", pages to rescan, the price. */
ul.listings { list-style: none; padding: 0; margin: 8px 0; }
ul.listings li.listing.q { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; border-top: 1px solid var(--line); padding: 8px 0 0; margin: 8px 0 0; }
ul.listings li.listing details.report.quiet { margin-left: auto; }
details.report > summary { cursor: pointer; color: var(--accent); margin-top: 8px; font-size: 0.92rem; }
details.report.quiet > summary { list-style: none; color: var(--muted); margin: 0; padding: 0 6px; font-size: 1.1rem; line-height: 1; }
details.report.quiet > summary::-webkit-details-marker { display: none; }
details.report.quiet[open] { flex-basis: 100%; margin-left: 0; }
details.report form.report { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
details.report textarea { width: 100%; min-height: 4.5em; }
.reported { margin-top: 8px; padding: 6px 10px; border-left: 3px solid var(--line); }
.reported p { margin: 2px 0; }
.dont-know { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; flex-basis: 100%; margin: 6px 0 0; }
.with-reviewer { border-left: 3px solid var(--accent); padding-left: 8px; }
section.retakes { border: 1px solid var(--warn); border-radius: 10px; padding: 4px 14px; margin: 12px 0; }
section.retakes ul { list-style: none; padding: 0; }
section.retakes img { max-width: 100%; height: auto; }
.price { font-weight: 600; }
ul.changes { color: var(--muted); font-size: 0.92rem; }
/* Sign-up and sign-in (intake Task 6). */
form.account { display: flex; flex-direction: column; gap: 12px; margin: 12px 0; }
form.account label.field { display: flex; flex-direction: column; gap: 4px; }
form.account label.field span { font-weight: 600; font-size: .95rem; }
form.account label.check { display: flex; gap: 8px; align-items: flex-start; }
form.account label.check input { min-height: 0; margin-top: 4px; }
p.error { color: var(--warn); }

/* The upload page (intake Task 9). */
form.account fieldset.which { border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; margin: 0; display: flex; flex-direction: column; gap: 8px; }
form.account fieldset.which legend { font-weight: 600; font-size: .95rem; padding: 0 4px; }
form.account progress { width: 100%; height: 12px; }
.check-image { display: block; max-width: 100%; height: auto; margin: 8px 0; border: 1px solid var(--line); border-radius: 6px; }
ul.pages { list-style: none; padding: 0; }
ul.pages li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0; }
