/* The report, in the browser and in the PDF. Dompdf reads this file too, so it sticks to
   what Dompdf supports: tables for layout, no flexbox or grid. The agency's colour comes
   from Monthwrap_Pdf::brand_css(). */
@page { margin: 44px 60px 70px; }
body { margin: 0; font-family: "DejaVu Sans", sans-serif; font-size: 10.5px; line-height: 1.45; color: #18213a; }
table { border-collapse: collapse; }
td { vertical-align: top; padding: 0; }
.muted { color: #626879; }
.top { width: 100%; }
.logo { max-height: 40px; max-width: 220px; }
.agency { font-size: 15px; font-weight: bold; }
.top-right { text-align: right; }
.top-right .muted { font-size: 10px; }
.top-right strong { display: block; font-size: 12.5px; margin-top: 1px; }
h1 { margin: 22px 0 0; font-size: 26px; line-height: 1.15; letter-spacing: -0.5px; }
.meta { margin-top: 4px; font-size: 10.5px; color: #626879; }
.rule { height: 3px; margin: 14px 0; }
.band { border-radius: 7px; padding: 12px 0; page-break-inside: avoid; }
.band table { width: 100%; }
.band td { width: 25%; padding: 0 16px; }
.band .n { font-size: 25px; line-height: 1.1; letter-spacing: -0.5px; }
.band .n span { font-size: 13px; letter-spacing: 0; }
.band .l { margin-top: 3px; font-size: 10px; font-weight: bold; }
.band .s { font-size: 9px; }
.summary { margin: 10px 0 0; font-size: 11.5px; line-height: 1.5; }
.block { margin-top: 14px; padding-top: 12px; border-top: 1px solid #e9eaf0; }
.cols { width: 100%; }
.cols td.col { width: 48%; }
.cols td.gap { width: 4%; }
.cols.three td.col { width: 30%; }
.cols.three td.gap { width: 5%; }
h2 { margin: 0 0 8px; font-size: 13px; line-height: 1.3; }
h2 span { font-weight: normal; color: #626879; }
.sub { margin: 8px 0 3px; font-size: 9.5px; color: #626879; }
.sub.first { margin-top: 0; }
.rows { width: 100%; }
.rows td { padding: 2px 0; border-bottom: 1px solid #f2f3f7; }
.rows td.date { width: 46px; padding-right: 8px; color: #626879; white-space: nowrap; }
.rows td.side { padding-left: 8px; text-align: right; color: #626879; white-space: nowrap; }
.empty { color: #626879; }
.failed { color: #b94e5e; font-weight: bold; }
.strip { width: 100%; border-collapse: separate; border-spacing: 3px 0; page-break-inside: avoid; }
.strip td { height: 20px; border-radius: 3px; }
.ends { width: 100%; margin-top: 3px; font-size: 9px; color: #626879; }
.legend { margin-top: 6px; font-size: 9.5px; color: #626879; }
.legend span { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin: 0 3px 0 10px; }
.legend span.first { margin-left: 0; }
.note { margin-top: 6px; color: #4b5166; }
.lead-row { width: 100%; }
.lead-row td.count { text-align: right; font-weight: bold; }
.bar { height: 6px; border-radius: 3px; background: #f0f1f5; margin: 3px 0 8px; }
.bar div { height: 6px; border-radius: 3px; }
.facts { width: 100%; }
.facts td { padding: 2px 0; }
.facts td.value { text-align: right; }
.warn { color: #a5782c; font-weight: bold; }
.footer { position: fixed; left: 0; right: 0; bottom: -44px; padding-top: 7px; border-top: 1px solid #e9eaf0; font-size: 8.5px; color: #626879; }
.footer table { width: 100%; }
.footer td.credit { text-align: right; }
.footer-screen { display: none; }
.keep { page-break-inside: avoid; }