/* Reset, typography and small utility classes. */
*{box-sizing:border-box}
html,body{margin:0;padding:0;width:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:22px}h2{font-size:17px}h3{font-size:14px}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.muted{color:var(--ink-3)}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);font-weight:500}

/* start-up (index.html, ui.js renderShell): never an empty screen while the app loads */
.boot{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:14px;color:var(--ink-2)}
.boot b{font-size:20px;font-weight:700;color:var(--accent);letter-spacing:.01em}
.boot-bar{display:block;width:140px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--line) 25%,var(--brand) 50%,var(--line) 75%);background-size:200% 100%;animation:boot 1.1s linear infinite}
@keyframes boot{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.boot-bar{animation:none;background:var(--brand)}}
.boot-page{padding-top:8px}
