/*
* deadkey.net — codebook-template.html page-local styles
* The shared .print-sheet / .codebook-grid / .print-action-bar components
* live in site.css and print-trusted.css (both linked from this page) — this
* file only holds the rules specific to the blank template: bigger,
* hand-writable cells on screen, and exact print sizing so the whole sheet
* (title + grid + instructions) fits on ONE Letter page.
*
* UNIFIED TEMPLATE (this pass): there used to be a second grid variant here
* (a flat, numbered 100-cell grid for seed phrases, `.seed-grid`, built by
* codebook-template.js) plus a screen-only numeric/char/seed toggle. Both are
* gone — one row/column 10x10 grid (.codebook-grid--blank) now serves all
* three secret types; a cell just holds a whole word instead of a digit when
* the secret is a seed phrase. See codebook-template.html and .js for the
* rest of that removal.
*/
body {
background-color: var(--color-bg);
}
/* Larger empty cells on screen than the filled-in preview grids, since these
are meant to be written in by hand after printing. (Print sizing, which is
what actually matters for the one-page constraint, is set explicitly in
the @media print block below — screen sizing here is just a cosmetic
preview and isn't held to the same inch-exact math.) */
.codebook-grid--blank td {
height: 3em;
}
.codebook-grid--blank th,
.codebook-grid--blank td {
font-size: 0.95em;
}
@media print {
/* site.css sets body { min-height: 100vh } for the on-screen sticky-footer
layout. In print that forces a full-page-tall body which, plus the @page
margins, overflows onto a blank second page regardless of content. Reset
it so the body collapses to its actual content height. This was the real
cause of a past phantom second page. */
html,
body { min-height: 0 !important; }
/* Nudge the sheet 1% smaller as well (zoom reduces the layout box in the
print engine, unlike transform: scale) — cheap insurance against
sub-pixel/font-metric rounding differences between print engines, on
top of the explicit inch-exact sizing below. */
.print-sheet { zoom: 0.99; }
/* Widen the writable area: narrow the left/right page margins from site.css's
1in down to 0.5in, so the printable width grows 6.5in → 7.5in. That extra
1in lets each data cell be ~15% wider (0.6in → 0.7in) — easier to hand-write
a word — while staying on ONE page (top/bottom margins and the 0.5in row
heights are unchanged, so the vertical budget is untouched). site.css pins
.print-sheet to 6.5in in print, so widen it here too. */
@page { margin: 0.75in 0.5in; }
.print-sheet { width: 7.5in !important; }
/* ---- Header: tightened from site.css's default print spacing (which
assumes a single-line intro and more breathing room than this page's
one-page budget allows) ---- */
.print-sheet__header {
padding-bottom: 0.1in;
margin-bottom: 0.12in;
}
.print-sheet__wordmark,
.print-sheet__type {
line-height: 1.15;
}
/* ---- Intro: two short condensed paragraphs (fill-in instructions, then
encode instructions + the deadkey.net/help/trusted-person pointer) in
place of the old single sentence + a whole separate numbered list. Sized
down from site.css's default 10pt/0.2in-margin so two paragraphs cost
about what one used to. ---- */
.print-sheet__intro {
font-size: 9pt;
line-height: 1.25;
margin: 0 0 0.08in;
}
/* ---- The grid itself ----
Column math (must total the page's 6.5in printable width — Letter minus
site.css's @page margin: rule, 1in left + 1in right):
label column 0.5in
10 data columns × 0.6in each = 6.0in
total = 0.5in + 6.0in = 6.5in ✓ matches printable width exactly
A (see codebook-template.html) plus table-layout: fixed makes
these widths authoritative regardless of cell content/padding — content
is clipped to the column, not the other way around.
Row math (must leave the grid itself at roughly ≤5.5in so title + intro
+ grid + the trusted-person block still fit in the page's ~9.5in
printable height, 11in minus 0.75in top + bottom margins):
header row (digits 0-9 only, no writing needed) 0.3in
10 body rows × 0.5in each 5.0in
+ table margin (0.1in top + 0.1in bottom) 0.2in
total ≈ 5.5in
0.5in-tall × 0.6in-wide cells are comfortably large enough to hand-write
a single digit/character OR a full up-to-8-character BIP-39 word — the
actual requirement driving the "bigger cells" ask. (A prior seed-only
attempt used 0.72in-tall cells for a 100-cell grid and overflowed to 3
pages; 0.5in here is deliberately under the ~0.52in ceiling that keeps
the 10-row grid at or under ~5.5in tall.) */
.codebook-grid--blank {
table-layout: fixed;
width: 7.5in;
margin: 0.1in 0;
}
/* 0.5in label + 10 × 0.7in data = 7.5in = the new printable width. Data cells
are now 0.7in wide × 0.5in tall — clearly wider than tall, for writing. */
.codebook-grid--blank .codebook-grid__col--label { width: 0.5in; }
.codebook-grid--blank .codebook-grid__col--data { width: 0.7in; }
.codebook-grid--blank th,
.codebook-grid--blank td {
line-height: 1.1;
padding: 0.04in;
font-size: 11pt;
}
.codebook-grid--blank thead th { height: 0.3in; }
.codebook-grid--blank tbody th,
.codebook-grid--blank tbody td { height: 0.5in; }
/* ---- "For your trusted person" write-in block: trimmed top spacing and
note paragraph so this section, plus everything above it, stays inside
the page. (Full arithmetic in the design report — this is the last
piece of the one-page budget.) ---- */
.print-sheet__section {
margin-top: 0.12in;
padding-top: 0.12in;
}
.print-sheet__label {
line-height: 1.15;
margin-bottom: 0.05in;
}
.print-sheet__section p {
font-size: 9pt;
line-height: 1.2;
margin-bottom: 0.1in;
}
.print-data {
margin-bottom: 0.12in;
}
}
/* Recovery code + expiration date on one line (blank write-ins). */
.print-data__row.print-data__row--pair {
grid-template-columns: auto minmax(5rem, 1fr) auto minmax(5rem, 1fr);
}
.print-data__row--pair .print-data__blank {
min-width: 5rem;
}