/* A printed document from the stock site: A4, black on white, one typeface,
 * nothing that depends on a screen. On screen it previews on a grey desk with
 * a bar for Print and Back; in print the bar goes and the pages break where a
 * page should. */
:root { --ink: #111; --muted: #555; --line: #bbb; --soft: #f0f0f0; }
* { box-sizing: border-box; }
html, body { margin: 0; background: #e9ecef; color: var(--ink); font: 11.5pt/1.5 Georgia, "Times New Roman", serif; }
.bar { position: sticky; top: 0; z-index: 2; display: flex; gap: 12px; align-items: center; padding: 10px 18px; background: #15202b; color: #fff; font: 14px "Segoe UI", system-ui, sans-serif; }
.bar .grow { flex: 1; }
.bar button { font: inherit; font-weight: 600; padding: 7px 16px; border: 0; border-radius: 8px; background: #0f7b5f; color: #fff; cursor: pointer; }
.bar .back { color: #cfd8e3; text-decoration: none; }
main { max-width: 210mm; margin: 18px auto 40px; background: #fff; padding: 18mm 20mm; box-shadow: 0 2px 12px rgba(0,0,0,.15); min-height: 297mm; }
.note { color: var(--muted); font-style: italic; }
h1 { font-size: 22pt; margin: 0 0 4px; line-height: 1.2; }
h2 { font-size: 15pt; margin: 22px 0 8px; padding-bottom: 3px; border-bottom: 1.5px solid var(--ink); }
h3 { font-size: 12.5pt; margin: 16px 0 4px; }
p { margin: 6px 0; }
.cover { padding: 30mm 0 20mm; border-bottom: 3px double var(--ink); margin-bottom: 20px; }
.cover .kicker { font: 600 10pt "Segoe UI", system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.cover .sub { font-size: 13pt; color: var(--muted); margin-top: 8px; }
.cover .meta { margin-top: 28px; font-size: 10.5pt; color: var(--muted); }
.cover .meta b { color: var(--ink); }
.lesson { break-inside: avoid; padding: 10px 0 14px; border-bottom: 1px solid var(--line); }
.lesson h3 { display: flex; gap: 10px; align-items: baseline; }
.lesson h3 .n { font: 700 11pt "Segoe UI", system-ui, sans-serif; color: var(--muted); }
.lesson .ex { background: var(--soft); border-left: 3px solid var(--ink); padding: 7px 11px; margin: 8px 0; font-size: 11pt; }
.lesson .lbl { font: 700 9pt "Segoe UI", system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); display: block; margin-top: 8px; }
.lines { margin-top: 6px; }
.lines i { display: block; height: 22px; border-bottom: 1px solid var(--line); }
.tick { display: inline-block; width: 11px; height: 11px; border: 1.5px solid var(--ink); vertical-align: -1px; margin-right: 6px; }
table { width: 100%; border-collapse: collapse; font-size: 10.5pt; margin: 6px 0 10px; break-inside: auto; }
th { text-align: left; font: 700 9pt "Segoe UI", system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding: 5px 6px; border-bottom: 1px solid var(--ink); }
td { padding: 4px 6px; border-bottom: 1px solid #e3e3e3; vertical-align: top; }
td.n, th.n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
td.code { color: var(--muted); width: 44px; font-variant-numeric: tabular-nums; }
tr.sub td { font: 700 9pt "Segoe UI", system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding-top: 10px; border-bottom: 0; }
tr.total td { font-weight: 700; border-top: 1.5px solid var(--ink); border-bottom: 0; }
tr { break-inside: avoid; }
.kv { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; margin: 8px 0 4px; }
.kv div { border-bottom: 1px solid #e3e3e3; padding: 5px 0; display: flex; justify-content: space-between; gap: 10px; font-size: 11pt; }
.kv div span:last-child { font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }
.kv small { display: block; color: var(--muted); font-size: 9.5pt; font-weight: 400; }
dl { margin: 0; } dt { font-weight: 700; margin-top: 7px; } dd { margin: 1px 0 0; color: #333; }
ul.links { padding-left: 18px; } ul.links li { margin: 5px 0; } ul.links a { color: var(--ink); }
.pagebreak { break-before: page; }
.foot { margin-top: 30px; font-size: 9.5pt; color: var(--muted); border-top: 1px solid var(--line); padding-top: 6px; }
@page { size: A4; margin: 16mm 18mm; }
@media print {
  html, body { background: #fff; }
  .bar { display: none; }
  main { max-width: none; margin: 0; padding: 0; box-shadow: none; min-height: 0; }
  a { text-decoration: none; }
}
