:root {
  color: #2b3646;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  background: #fff;
}
* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(100% - 2rem, 72rem); margin: 2rem auto; }
header, .actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.brand { width: 10rem; height: auto; }
h1 { font-size: 2rem; line-height: 1.2; margin: 1.5rem 0 1rem; }
h2 { font-size: 1.125rem; margin: 1.5rem 0 .5rem; }
a { color: #b6440b; text-underline-offset: .2em; }
button { display: inline-flex; align-items: center; gap: .5rem; border: 1px solid #a9440e; border-radius: 4px; padding: .6rem .9rem; background: #fff; color: #973b0b; font: inherit; cursor: pointer; }
button svg { width: 1.2rem; height: 1.2rem; }
button:hover { background: #fff4ec; }
:focus-visible { outline: 3px solid #087b78; outline-offset: 3px; }
.intro { max-width: 60rem; }
.chart-scroll { overflow-x: auto; margin-top: 1.5rem; }
table { border-collapse: collapse; width: 100%; min-width: 43rem; table-layout: fixed; }
caption { text-align: left; font-weight: 600; margin-bottom: .5rem; }
th, td { border: 1px solid #b6bec5; padding: .6rem; text-align: center; }
thead th { background: #f2f7f7; font-size: .875rem; }
.task-col { width: 34%; text-align: left; }
.points-col { width: 10%; }
td:first-child { text-align: left; }
input, textarea { width: 100%; min-width: 0; padding: .4rem; border: 1px solid #a8b0b9; border-radius: 2px; color: inherit; background: #fff; font: inherit; }
input[type="checkbox"] { width: 1.25rem; height: 1.25rem; accent-color: #087b78; }
input[type="date"] { width: 12rem; margin-left: .5rem; }
label { display: block; }
.agreement { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.agreement label + label { margin-top: .8rem; }
.totals { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; margin: 1rem 0; }
output { display: inline-block; min-width: 4rem; padding: .3rem .6rem; border-bottom: 1px solid #a8b0b9; font-weight: 600; }
textarea { min-height: 4rem; resize: vertical; }
.note { font-size: .875rem; color: #4b5563; }
footer { margin-top: 1.5rem; border-top: 1px solid #b6bec5; padding-top: .75rem; font-size: .875rem; }
@media (max-width: 40rem) {
  .agreement { grid-template-columns: 1fr; gap: .5rem; }
  h1 { font-size: 1.65rem; }
  input[type="date"] { display: block; margin: .5rem 0; }
}
@page { size: landscape; margin: 12mm; }
@media print {
  :root { font-size: 10pt; }
  main { width: 100%; margin: 0; }
  .actions, .screen-only { display: none !important; }
  .brand { width: 8rem; }
  h1 { font-size: 19pt; margin: .8rem 0 .5rem; }
  h2 { margin: .7rem 0 .3rem; }
  .chart-scroll { overflow: visible; margin-top: .6rem; }
  table { min-width: 0; }
  th, td { padding: .4rem; }
  input, textarea { border: 0; border-bottom: 1px solid #a8b0b9; padding: .25rem; }
  input::placeholder, textarea::placeholder { color: transparent; }
  input[type="checkbox"] { appearance: none; border: 1px solid #555; border-radius: 0; width: 1.1rem; height: 1.1rem; position: relative; }
  input[type="checkbox"]:checked::after { content: "X"; position: absolute; inset: -.25rem 0 0; text-align: center; }
  .agreement { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  textarea { min-height: 2.4rem; resize: none; }
  footer { margin-top: .7rem; padding-top: .4rem; }
  table, .agreement, footer { break-inside: avoid; }
}