/* The v3 frame for pages whose body predates the v3 redesign.
 *
 * David, 2026-10-07: moving between the Store, the blog and the rest of the site must not
 * feel like two sites. Every page now carries the v3 header and footer (Site Chrome in the
 * "Stelaah Website Reskin" design project, copied from the converted pages), and this file
 * gives the older page bodies the v3 type and colours: Inter for text, Satoshi for headings,
 * the warm paper background and v3 ink. It is loaded last so it wins over the shell tokens
 * (--sh-*, --font-*) those bodies are built on; it changes no layout.
 */
:root {
  --sh-sans: Inter, InterV3, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-app: var(--sh-sans);
  --font-sans: var(--sh-sans);
  --font-ui: var(--sh-sans);
  --font-title: Satoshi, InterV3, Inter, sans-serif;
  --sh-paper: #fafaf9;
  --bg: #fafaf9;
  --sh-ink: #0c0a09;
  --ink: #0c0a09;
}
/* v3 sizes every box by its border, as the converted pages do; the older bodies set
   width:100% plus side padding on .mk-container, which overflowed every phone screen. */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: #fafaf9;
  color: #0c0a09;
  font-family: var(--sh-sans);
  -webkit-font-smoothing: antialiased;
}
/* the v3 header and footer links never underline, whatever the page body's own link style */
header a, header a:hover, footer a, footer a:hover { text-decoration: none !important; }
h1, h2, h3 {
  font-family: Satoshi, InterV3, Inter, sans-serif;
  letter-spacing: -0.02em;
}
/* the v3 header's own responsive rules (Site Chrome) */
[data-sm-only] { display: none !important; }
@media (max-width: 880px) {
  [data-sm-hide] { display: none !important; }
  [data-sm-only] { display: flex !important; }
}