/* The web edition on a wide screen: the print edition's A4 sheets, laid on the desk and scaled to the window.
   scripts/build.py turns every "@media print" rule in the web pages on for screens at least 1000px wide, so the
   pages there are laid out exactly as in the PDF; this file puts back the desk around them. The build sets
   --sheet-zoom from the window width. Narrower screens keep the reflowing layout in shovel.css. */
@media screen and (min-width: 1000px) {
  :root {
    --desk: #c8c3b7; --paper: #eeebe2; --ink: #1c1b18; --ink-soft: #4a463f; --rule: #2b2925;
    --hair: #bcb6a9; --box: #e3dfd4; --accent: #9b2b20; --shadow: rgba(30, 25, 15, .35); --grain: .16;
  }
  html, body { background: var(--desk); }
  body { padding: 28px 16px 56px; }
  /* Laid out at A4, exactly as for the PDF, then enlarged. Zoom would lay the text out again at the larger size,
     where line breaks can differ from print and a column can run past the foot of its sheet. A transform takes
     no room, so the margin below adds the extra height the enlarged sheet covers. */
  .sheet {
    transform: scale(var(--sheet-zoom, 1.25));
    transform-origin: top center;
    margin: 0 auto calc(297mm * (var(--sheet-zoom, 1.25) - 1) + 32px);
    box-shadow: 0 14px 34px -20px var(--shadow);
    /* A4 at least, but free to grow: another browser can set a column a line longer than the build's, and on
       paper that line would be cut off. The build's script resets each margin from the sheet's real height. */
    height: auto; min-height: 297mm; overflow: visible;
  }
  .sheet::before { display: block; }
  .edition-bar { display: flex; max-width: calc(210mm * var(--sheet-zoom, 1.25)); margin: 0 auto 14px; font-size: 12.5px; }  /* px: the print rules set a small root size */
}