/* Tryout Ready — one stylesheet, no external fonts, no scripts. */
:root {
  --paper: #fbfaf6;
  --ink: #1d1d1b;
  --muted: #545450;
  --rule: #d9d6cc;
  --guard: #1f6b3a;      /* green = guards & wings, same as the spreadsheet */
  --guard-tint: #e3f0e6;
  --post: #a3470f;       /* orange = posts, same as the spreadsheet */
  --post-tint: #f8e6d8;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.55 var(--sans); }
a { color: var(--ink); text-underline-offset: 2px; }
a:focus-visible { outline: 3px solid var(--post); outline-offset: 2px; }
.wrap { max-width: 44rem; margin: 0 auto; padding: 0 1.1rem; }
.masthead { border-bottom: 1px solid var(--rule); }
.masthead .wrap { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-top: .9rem; padding-bottom: .9rem; flex-wrap: wrap; }
.brand { font: 600 1.15rem var(--serif); text-decoration: none; letter-spacing: .01em; }
.tag { color: var(--muted); font-size: .9rem; }
h1, h2 { font-family: var(--serif); font-weight: 600; line-height: 1.2; }
h1 { font-size: 2.1rem; margin: 2.2rem 0 .6rem; }
h2 { font-size: 1.4rem; margin: 2.4rem 0 .6rem; padding-top: 1.2rem; border-top: 1px solid var(--rule); }
.lede { font-size: 1.1rem; margin-top: 0; }
.jump { font-size: .95rem; color: var(--muted); }
ol, ul { padding-left: 1.3rem; }
li { margin: .35rem 0; }
dl.scale { display: grid; grid-template-columns: 2.2rem 1fr; gap: .35rem .6rem; margin: 1rem 0; }
dl.scale dt { font: 600 1.2rem var(--serif); }
dl.scale dd { margin: 0; }
.crit h3 { font: 600 1.05rem var(--sans); margin: 1.4rem 0 .3rem; }
.crit.guards h3 { color: var(--guard); }
.crit.posts h3 { color: var(--post); }
.crit dt { font-weight: 600; margin-top: .5rem; }
.crit dd { margin: 0; }
.note { color: var(--muted); font-size: .95rem; }
.sheet-scroll { overflow-x: auto; border: 1px solid var(--rule); background: #fff; margin: 1rem 0; }
.sheet { padding: .8rem; min-width: 46rem; }
.sheet-head { display: flex; gap: 1.5rem; font-size: .9rem; margin-bottom: .5rem; flex-wrap: wrap; }
.sheet-head span { flex: 1; min-width: 9rem; border-bottom: 1px solid var(--ink); padding-bottom: .1rem; }
table.form { border-collapse: collapse; width: 100%; font-size: .78rem; }
table.form th, table.form td { border: 1px solid #8c8a82; padding: .25rem .3rem; text-align: center; }
table.form thead th { font-weight: 600; line-height: 1.2; vertical-align: bottom; }
table.form td { height: 1.55rem; }
table.form .g { background: var(--guard-tint); }
table.form .p { background: var(--post-tint); }
table.form tbody td:nth-child(n+4):nth-child(-n+7) { background: var(--guard-tint); }
table.form tbody td:nth-child(n+8):nth-child(-n+11) { background: var(--post-tint); }
table.form tbody td:first-child { width: 2.4rem; }
table.form caption { caption-side: bottom; text-align: left; }
table.form th.g { color: var(--guard); }
table.form th.p { color: var(--post); }
table.form .name { width: 22%; text-align: left; }
table.form .notes { width: 22%; }
.sheet-foot { font-size: .75rem; color: var(--muted); margin: .4rem 0 0; }
.buy { background: #fff; border-left: 4px solid var(--post); padding: .9rem 1rem; margin: 1.2rem 0; }
.buy p { margin: .3rem 0; }
footer { border-top: 1px solid var(--rule); margin-top: 3rem; padding: 1.4rem 0 2.4rem; font-size: .9rem; color: var(--muted); }
footer h2 { font-size: 1rem; border: 0; padding: 0; margin: 1rem 0 .2rem; color: var(--ink); }
footer p { margin: .2rem 0 .6rem; }
@media (max-width: 30rem) { body { font-size: 16px; } h1 { font-size: 1.7rem; } }

/* Printing: only the form, landscape, colours kept so green/orange columns survive. */
@page { size: letter landscape; margin: .4in; }
@media print {
  body { background: #fff; font-size: 11pt; }
  body > *:not(main), main > *:not(.print-area) { display: none !important; }
  main.wrap { max-width: none; padding: 0; }
  .sheet-scroll { border: 0; overflow: visible; margin: 0; }
  .sheet { min-width: 0; padding: 0; }
  table.form { font-size: 9pt; }
  table.form td { height: 0.29in; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}