:root {
  --bg: #f4f7f9;
  --paper: #ffffff;
  --ink: #17232d;
  --ink2: #3c4d5a;
  --line: #c9d5de;
  --line2: #e3eaef;
  --blue: #1d5a8f;
  --blue-ink: #ffffff;
  --blue-soft: #e2edf6;
  --rust: #9a3412;
  --rust-soft: #fbe9df;
  --amber: #7a4a00;
  --amber-soft: #fbf0d5;
  --green: #2f6b36;
  --green-soft: #e3f1e4;
  --focus: #e08a1e;
  --head: "Seravek", "Gill Sans Nova", "Gill Sans", "Ubuntu", "Calibri", "Trebuchet MS", sans-serif;
  --body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --num: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --r: 6px;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121a21;
    --paper: #1a242d;
    --ink: #e8eef3;
    --ink2: #b9c7d2;
    --line: #3a4a58;
    --line2: #26333e;
    --blue: #7fb6e6;
    --blue-ink: #0e1a24;
    --blue-soft: #1d3346;
    --rust: #ffa27a;
    --rust-soft: #3d2117;
    --amber: #f2c46d;
    --amber-soft: #33290f;
    --green: #8fd197;
    --green-soft: #18311c;
    --focus: #f2a541;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 17px/1.5 var(--body); }
.wrap { max-width: 920px; margin: 0 auto; padding: 0 16px; }
h1, h2, h3 { font-family: var(--head); line-height: 1.2; }
h1 { font-size: clamp(1.6rem, 4.6vw, 2.3rem); margin: 0 0 .4rem; letter-spacing: -.01em; }
h2 { font-size: 1.45rem; margin: 2rem 0 .6rem; }
h3 { font-size: 1.15rem; margin: 1.4rem 0 .4rem; }
a { color: var(--blue); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 8px; top: 8px; background: var(--paper); padding: 8px 12px; z-index: 10; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

.top { border-bottom: 4px solid var(--blue); background: var(--paper); padding: 20px 0 16px; }
.lede { margin: 0; max-width: 62ch; color: var(--ink2); }

.tool { padding-top: 16px; padding-bottom: 8px; }
.tool:focus { outline: none; }
.note, .banner { background: var(--amber-soft); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r); padding: 10px 14px; margin: 0 0 12px; overflow-wrap: anywhere; }
.note p, .banner p { margin: 0 0 8px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 8px 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); color: var(--ink); font: 600 1rem/1.2 var(--body); text-decoration: none; cursor: pointer; }
.btn:hover { border-color: var(--blue); }
.btn.primary { background: var(--blue); border-color: var(--blue); color: var(--blue-ink); }
.btn.danger { color: var(--rust); border-color: var(--rust); }
.btn.small { min-height: 44px; padding: 6px 12px; font-size: 1rem; }
.btn.sq { width: 48px; padding: 0; font-size: 1.4rem; }
.btn:disabled { opacity: .45; cursor: default; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; align-items: center; }

.fld { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 1rem; min-width: 0; }
input, select, textarea { font: 16px/1.3 var(--body); color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: 10px 10px; min-height: 44px; width: 100%; min-width: 0; }
input:disabled { opacity: .5; }
input[type="checkbox"], input[type="radio"] { width: 22px; height: 22px; min-height: 0; margin: 0; accent-color: var(--blue); }
.tick { display: flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 500; }
.ticks { display: flex; flex-wrap: wrap; column-gap: 24px; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 10px 0; align-items: end; }
.hint { color: var(--ink2); margin: 0 0 6px; }
.fld .hint { font-weight: 400; margin: 0; }
.fld-wide { grid-column: 1 / -1; }
.fld-wide input { max-width: 14rem; }
.msg { color: var(--rust); font-weight: 600; margin: 8px 0 0; min-height: 0; }
.msg:empty { display: none; }

.setup { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: 4px 16px 8px; }
.setup h2 { margin-top: 12px; }
.setup-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.walkbar { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: end; margin-bottom: 10px; }
.walk-date { width: 12.5rem; }
.sheetbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; margin: 14px 0 0; }
.sheetbar .fld { width: 12.5rem; }
.walk-sum { margin: 0 0 10px; font-weight: 600; }

.boxes { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.box-li { border-bottom: 1px solid var(--line); }
.box { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "tag st" "tag flags"; column-gap: 12px; width: 100%; padding: 10px 4px; background: none; border: 0; color: inherit; text-align: left; font: inherit; cursor: pointer; min-height: 56px; }
.box:hover .tag { border-color: var(--blue); }
.tag { grid-area: tag; align-self: start; min-width: 3rem; height: 3rem; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--ink2); border-radius: 4px; font: 700 1.15rem/1 var(--num); background: var(--paper); max-width: 7.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.box-li.shut .tag { border-color: var(--rust); color: var(--rust); }
.box-li.open > .box { background: var(--blue-soft); }
.st { grid-area: st; min-width: 0; overflow-wrap: anywhere; }
.st-t { display: block; }
.where { display: block; color: var(--ink2); font-size: 1rem; }
.flags { grid-area: flags; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.flags:empty { display: none; }
.flag { font-size: 1rem; font-weight: 700; padding: 1px 8px; border-radius: 3px; background: var(--line2); color: var(--ink); }
.flag.no { background: var(--rust); color: var(--paper); }
.flag.warn { background: var(--amber-soft); color: var(--amber); border: 1px solid var(--amber); }
.flag.due { background: var(--blue-soft); color: var(--blue); }
.flag.ok { background: var(--green-soft); color: var(--green); }
.after-list { margin-top: 14px; }

.check { background: var(--paper); border: 2px solid var(--blue); border-radius: var(--r); padding: 6px 14px 4px; margin: 0 0 12px; box-shadow: 0 2px 10px rgba(16, 40, 60, .12); }
.check-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.check-head h3 { margin: 8px 0 4px; font-size: 1.3rem; overflow-wrap: anywhere; }
.check-head h3:focus { outline: none; }
.check-status { margin: 4px 0 8px; padding: 8px 10px; background: var(--blue-soft); border-radius: var(--r); overflow-wrap: anywhere; }
.check-status.shut { background: var(--rust-soft); border: 2px solid var(--rust); }
.check-status .dates { display: block; color: var(--ink2); font-size: 1rem; margin-top: 2px; }
.opts { border: 0; padding: 0; margin: 0 0 8px; min-width: 0; }
.opts legend { font-weight: 600; padding: 0; margin-bottom: 2px; }
.opts .tick { align-items: flex-start; padding-top: 10px; }
.opts .tick input { margin-top: 1px; flex: none; }
.earlier-checks { margin-top: 14px; border-top: 1px solid var(--line); }
.earlier-checks > summary { cursor: pointer; font-weight: 700; min-height: 44px; display: flex; align-items: center; }
.history { list-style: none; margin: 0 0 6px; padding: 0; font-size: 1rem; }
.history li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px dashed var(--line); overflow-wrap: anywhere; }
.history li.editing { background: var(--amber-soft); }
.history .h-act { display: flex; gap: 20px; flex: none; }
.history .more-h { justify-content: flex-start; border: 0; }
.seg { border: 0; margin: 10px 0 4px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.seg legend { font-weight: 600; font-size: 1rem; padding: 0; margin-bottom: 4px; }
.seg label { position: relative; }
.seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.seg span { display: flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid var(--line); margin-left: -1px; background: var(--paper); font-weight: 600; }
.seg label:first-of-type span { border-radius: var(--r) 0 0 var(--r); margin-left: 0; }
.seg label:last-of-type span { border-radius: 0 var(--r) var(--r) 0; }
.seg input:checked + span { background: var(--blue); color: var(--blue-ink); border-color: var(--blue); }
.seg input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 1px; position: relative; z-index: 1; }
.counts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 6px 0; }

.stepper label { font-weight: 600; font-size: 1rem; display: block; margin-bottom: 4px; }
.step { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; gap: 6px; }
.step input { text-align: center; font: 700 1.3rem/1 var(--num); padding: 6px 2px; }

.report { margin-top: 26px; }
.report h2 { margin-top: 0; }
.missed { padding-left: 1.2em; }
.missed li { margin: 0 0 6px; }
.report-form { max-width: 26rem; }
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; }
.sum, .timings { width: 100%; background: var(--paper); font-variant-numeric: tabular-nums; }
.sum th, .sum td, .timings th, .timings td { border-bottom: 1px solid var(--line); padding: 8px 8px; text-align: right; }
.sum th[scope="row"], .sum thead th:first-child, .timings th[scope="row"], .timings thead th:first-child { text-align: left; }
.timings caption { text-align: left; font-weight: 700; padding: 0 0 6px; }

.more { margin: 18px 0; border-top: 1px solid var(--line); padding-top: 4px; }
.more > summary { cursor: pointer; font: 700 1.15rem/1.3 var(--head); padding: 10px 0; min-height: 44px; }
.rules { display: grid; gap: 8px; }
.rule { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--line2); }
.rule small { display: block; color: var(--ink2); font-size: 1rem; font-weight: 400; }
.rule-in { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.rule-in input { width: 4.6rem; text-align: center; }
.s-boxes { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.s-boxes li { display: grid; grid-template-columns: 6rem minmax(0, 1fr) 48px 48px; gap: 6px; }
.file-btn { position: relative; overflow: hidden; }
.file-btn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; min-height: 0; }
.earlier { list-style: none; padding: 0; margin: 0; }
.earlier li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line2); }

.info { padding-bottom: 24px; }
.info p, .info li { max-width: 70ch; }
.small-print { color: var(--ink2); font-size: 1rem; }
.faq h3 { font-size: 1.1rem; }
.faq p { margin-top: 0; }
.sources { padding-left: 1.2rem; }

.confirm { position: fixed; inset: 0; background: rgba(8, 16, 24, .55); display: flex; align-items: center; justify-content: center; padding: 16px; z-index: 30; }
.confirm-box { background: var(--paper); border-radius: var(--r); padding: 16px 18px 6px; max-width: 30rem; width: 100%; }
.toast { pointer-events: none; position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); width: min(560px, calc(100% - 32px)); background: var(--ink); color: var(--bg); padding: 12px 16px; border-radius: var(--r); z-index: 20; box-shadow: 0 4px 18px rgba(0, 0, 0, .25); overflow-wrap: anywhere; }
@media (max-width: 640px) { .toast { top: 12px; bottom: auto; } }
.toast .btn { margin-left: 8px; background: var(--bg); color: var(--ink); border-color: var(--bg); pointer-events: auto; }

.site-foot { border-top: 1px solid var(--line); margin-top: 24px; padding: 16px 0 28px; color: var(--ink2); font-size: 1rem; }
.sb-more { overflow-wrap: anywhere; }
.sb-footer a { color: var(--blue); }

@media (max-width: 379px) { .grid2 { grid-template-columns: 1fr; } }
@media (max-width: 419px) { .date-sp { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .setup-row { grid-template-columns: 1fr 1fr; }
  .setup-row .fld:last-child { grid-column: 1 / -1; }
  .history li { flex-direction: column; align-items: flex-start; }
  .s-boxes li { grid-template-columns: 4.5rem minmax(0, 1fr) 44px 44px; }
  .btn.sq { width: 44px; }
  .sum th, .sum td { padding: 8px 5px; }
}
@media (max-width: 420px) { .timings th, .timings td { padding: 8px 4px; } .sum { font-size: 1rem; } .sum th, .sum td { padding: 8px 3px; } }
/* narrow phones: each species name on its own line above its numbers (the roles in the markup keep it a table) */
@media (max-width: 389px) {
  .sum, .sum thead, .sum tbody { display: block; }
  .sum tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sum th[scope="row"] { grid-column: 1 / -1; border-bottom: 0; padding-bottom: 0; }
  .sum thead th:first-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* ------------------------------------------------------------------ print */
.print-root { display: none; }
@media print {
  body { background: #fff; color: #000; font: 10.5pt/1.35 var(--body); }
  body > *:not(.print-root) { display: none !important; }
  .print-root { display: block; }
  .p-sheet { color: #000; }
  .p-head { border-bottom: 2pt solid #000; margin-bottom: 8pt; padding-bottom: 4pt; }
  .p-head h2 { font: 700 15pt/1.2 var(--head); margin: 0 0 2pt; }
  .p-head p { margin: 0; font-size: 10pt; }
  .p-sheet h3 { font: 700 12pt/1.2 var(--head); margin: 12pt 0 4pt; break-after: avoid; }
  .p-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-variant-numeric: tabular-nums; }
  .p-table th, .p-table td { border: 0.75pt solid #000; padding: 3pt 4pt; vertical-align: top; text-align: left; overflow-wrap: anywhere; }
  .p-table thead th { background: #e8e8e8; print-color-adjust: exact; -webkit-print-color-adjust: exact; font-size: 9.5pt; overflow-wrap: normal; padding: 3pt 3pt; }
  .p-table tr { break-inside: avoid; }
  .p-table thead { display: table-header-group; }
  .p-walk tbody tr, .p-blank tbody tr { height: 34pt; }
  .p-walk th[scope="row"], .p-blank th[scope="row"] { font: 700 12pt/1.1 var(--num); }
  .p-walk .p-last span { display: block; }
  .p-walk .p-where { font-weight: 700; }
  .p-walk th.p-lbl-long, .p-blank th.p-lbl-long { font-size: 10pt; }
  .p-walk .p-last { font-size: 10pt; line-height: 1.2; }
  .p-walk .p-note, .p-walk thead th { font-size: 10pt; }
  .p-walk .p-now { margin-top: 1pt; }
  .p-table th[scope="row"] { overflow-wrap: break-word; }
  .p-key, .p-table + p, .p-table + ul { break-before: avoid; }
  .p-total th, .p-total td { font-weight: 700; }
  .p-box tr > :first-child { width: 6%; overflow-wrap: normal; }
  .c-box { width: 7%; } .c-last { width: 35%; } .p-walk .c-n { width: 7%; } .p-walk .c-notes { width: 12%; } .c-open { width: 9%; } .c-sp { width: 9%; } .c-n { width: 7%; } .c-notes { width: 14%; } .c-notes2 { width: 30%; }
  .p-blank .c-sp { width: 11%; } .p-blank .c-n { width: 8%; } .p-blank .c-notes2 { width: 24%; }
  .p-last { font-size: 9.5pt; }
  .p-no { font-weight: 800; text-decoration: underline; }
  .p-note { font-size: 8.5pt; font-weight: 700; }
  .p-key { font-size: 9pt; margin: 6pt 0 0; }
  .p-walk .p-key { font-size: 10pt; line-height: 1.3; margin-top: 4pt; break-inside: avoid; }
  .p-walk tbody td, .p-walk tbody th { padding-top: 2pt; padding-bottom: 2pt; }
  .p-walk tbody tr:last-child:not(:first-child) { break-before: avoid; }
  .p-warn { border: 1.5pt solid #000; padding: 4pt 6pt; font-weight: 700; margin: 0 0 8pt; }
  .p-sum td, .p-sum th, .p-dates td, .p-dates th, .p-mini td { text-align: right; }
  .p-sum th[scope="row"], .p-sum thead th:first-child, .p-dates th[scope="row"], .p-dates thead th:first-child, .p-mini th { text-align: left; }
  .p-sum th small { display: block; font-weight: 400; font-size: 8.5pt; }
  .p-sum tr > :first-child { width: 18%; overflow-wrap: normal; }
  .p-report .p-table th, .p-report .p-table td { padding: 2pt 4pt; }
  .p-report .p-dates tr > :first-child { width: 24%; overflow-wrap: normal; }
  .p-report h3 { margin: 7pt 0 3pt; }
  .p-report .p-warn { margin: 0 0 6pt; }
  .p-warn p, .p-warn ul { margin: 0; }
  .p-gap { display: block; margin-top: 2pt; }
  .p-walk .p-last span.p-tick { display: inline; font-size: 11pt; }
  .p-warn ul { padding-left: 14pt; font-weight: 400; }
  .p-box th, .p-box td { padding: 2pt 2pt; }
  .p-box thead th { font-size: 8.5pt; padding: 2pt 2pt; }
  .p-tasf { font-size: 8.5pt; }
  .p-tasf th, .p-tasf td { padding: 2pt 1pt; text-align: center; overflow-wrap: normal; }
  .p-tasf thead th { font-size: 8pt; padding: 2pt 1pt; }
  .p-tasf thead small { display: block; font-weight: 400; }
  .p-tasf .bx-s { width: 34pt; } .p-tasf .bx-m { width: 50pt; } .p-tasf .bx-l { width: 66pt; } .p-tasf .bx-xl { width: 86pt; }
  .p-tasf tbody th { overflow-wrap: break-word; }
  .p-tasf tbody th, .p-tasf tbody td { padding-top: 1pt; padding-bottom: 1pt; }
  .p-tasf th.rot { height: 115pt; vertical-align: bottom; font-size: 7.5pt; }
  .p-tasf th.rot span { writing-mode: vertical-rl; transform: rotate(180deg); display: inline-block; max-height: 113pt; line-height: 1.05; text-align: left; white-space: normal; }
  .p-tasf tbody th { text-align: left; padding-left: 3pt; }
  .p-tasf .p-total th, .p-tasf .p-total td { font-weight: 700; background: #e8e8e8; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .p-dates, .p-two { break-inside: avoid; }
  .p-two-up { display: grid; grid-template-columns: 1fr 2fr; gap: 0 14pt; align-items: start; }
  .p-table tbody:not(.p-total) tr:last-child { break-after: avoid; }
  .p-sheet h3 { break-after: avoid; }
  /* walk sheet: the key may go on to the next page on its own, so the rows fill this one */
  .p-walk .p-table tbody:not(.p-total) tr:last-child { break-after: auto; }
  /* the key stays with at least the last row (the last two rows stay together, see above) */
  .p-walk .p-key { break-before: avoid; }
  /* the key is the table's last row, so it moves with the last box row and is never alone on a page */
  .p-walk tbody tr.p-keyrow { height: auto; break-before: avoid; break-inside: avoid; }
  .p-walk tbody td.p-key { border: 0; padding: 4pt 0 0; }
  .p-notes-list { margin: 4pt 0 0; padding-left: 14pt; font-size: 9.5pt; }
  .p-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12pt; break-inside: avoid; align-items: start; }
  .p-mini tr > :last-child { width: 22%; }
  .p-box { font-size: 8.5pt; }
  .p-box th, .p-box td { padding: 2pt 2pt; text-align: center; }
  .p-box tbody th { text-align: left; }
  .p-box .g { font-size: 8.5pt; }
  .p-total th, .p-total td { border-top: 1.5pt solid #000; }
  .f-row { display: grid; grid-template-columns: 1fr 6em 14em; gap: 8pt; align-items: end; padding: 5pt 0; border-bottom: 0.5pt solid #999; break-inside: avoid; }
  .f-v { font: 700 13pt/1 var(--num); text-align: right; }
  .f-v.f-t { font: 700 12pt/1.2 var(--body); }
  .f-n { font-size: 9.5pt; white-space: nowrap; }
  .f-ticks { margin: 6pt 0; }
  .p-line { display: inline-block; min-width: 14em; border-bottom: 0.75pt solid #000; height: 1em; vertical-align: bottom; }
  .p-line.short { min-width: 6em; }
  .p-rec { margin-bottom: 10pt; }
  .p-rec.p-short { break-inside: avoid; }
  .p-rec .p-cap th { background: none; font: 700 11pt/1.2 var(--head); border: 0; padding: 0 0 3pt; }
  .p-rec .p-cap small { font: 400 9.5pt var(--body); }
  .p-checks tr { break-inside: avoid; }
  .p-rec h3 small { font: 400 9.5pt var(--body); }
  .p-rec ul { margin: 4pt 0 0; padding-left: 14pt; font-size: 9.5pt; }
  .p-checks { font-size: 9pt; }
  .p-checks .k-d { width: 10%; } .p-checks .k-sp { width: 20%; } .p-checks .k-ne { width: 10%; } .p-checks .k-n { width: 8%; } .p-checks .k-end { width: 12%; }
  a { color: #000; text-decoration: none; }
}