/* ══ QR Code Generator ═════════════════════════════════════════════════════
   style.css owns the reset, the chrome, the rail (the payload textarea
   included) and the trim marks. This file is the paper the code is printed
   on.
   ═══════════════════════════════════════════════════════════════════════ */

/* The code is the artifact, so it gets the paper and the trim marks. The
   canvas sizes itself from the module size, so the paper holds a floor and
   centres whatever turns up. */
.bed { --trim-width: 30rem; }
.qr-paper {
    display: flex; align-items: center; justify-content: center;
    min-height: 22rem; padding: 2rem;
}
#qrCanvas {
    display: block;
    max-width: 100%; height: auto;
    image-rendering: pixelated;
    image-rendering: crisp-edges;
}
#emptyHint {
    max-width: 18ch;
    font-size: var(--fs-fine); line-height: 1.5;
    color: var(--ink-soft); text-align: center;
}