/* The pre-app boot state. Cherry Ink tokens, hardcoded because this paints
   before any of the app arrives — ink #1D1B1A, paper #FAF9F7, smoke #6E6862,
   hairline #E6E2DC, cherry #B3172D. Keep them in step with
   src/styles/tokens.css by hand. */
html, body { margin: 0; padding: 0; height: 100%; background-color: #FAF9F7; }
#boot {
  position: fixed; inset: 0; background-color: #FAF9F7;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 24px; box-sizing: border-box;
}
.boot__mark { position: relative; width: 28px; height: 28px; border: 1.5px solid #1D1B1A; border-radius: 50%; }
/* The one cherry the system allows here: the brand mark's centre. */
.boot__dot { position: absolute; top: -1px; right: -1px; width: 9px; height: 9px; border-radius: 50%; background-color: #B3172D; }
.boot__rule { margin-top: 28px; height: 1px; width: 132px; background-color: #E6E2DC; overflow: hidden; }
/* Approaches the end and never reaches it: always moving, never claiming
   progress that has not happened. No loop — looping motion is reserved for
   signals with a person behind them, and a download is not one. */
.boot__fill { display: block; height: 100%; width: 100%; background-color: #1D1B1A; transform-origin: left center; animation: boot-approach 9s cubic-bezier(0.1, 0.8, 0.2, 1) forwards; }
@keyframes boot-approach { from { transform: scaleX(0); } to { transform: scaleX(0.92); } }
.boot__label {
  margin: 12px 0 0; color: #6E6862; text-align: center;
  font: 400 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  text-transform: uppercase; letter-spacing: 1.6px;
}