/* Shared by every edition: typefaces, colours, text, code, figures and Checkpoints.
   The design follows the family visual identity (198x/decisions/family-visual-identity.md):
   Nebula Sans for reading and headings, JetBrains Mono for code and every label, and one spot
   ink per book. The family's magazine face isn't used: Steve found it jarring on part pages. */

/* Nebula Sans, from the family font kit (Code198x/website/_198x-ui,
   commit ad5b746), split by script as the kit splits them. */
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 400; src: url('../fonts/nebula-sans-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 400; src: url('../fonts/nebula-sans-400-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 400; src: url('../fonts/nebula-sans-400-greek.woff2') format('woff2'); unicode-range: U+0370-03FF; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 400; src: url('../fonts/nebula-sans-400-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 600; src: url('../fonts/nebula-sans-600-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 600; src: url('../fonts/nebula-sans-600-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 600; src: url('../fonts/nebula-sans-600-greek.woff2') format('woff2'); unicode-range: U+0370-03FF; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 600; src: url('../fonts/nebula-sans-600-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 700; src: url('../fonts/nebula-sans-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 700; src: url('../fonts/nebula-sans-700-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 700; src: url('../fonts/nebula-sans-700-greek.woff2') format('woff2'); unicode-range: U+0370-03FF; }
@font-face { font-family: 'Nebula Sans'; font-style: normal; font-weight: 700; src: url('../fonts/nebula-sans-700-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Nebula Sans'; font-style: italic; font-weight: 400; src: url('../fonts/nebula-sans-400-italic-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nebula Sans'; font-style: italic; font-weight: 400; src: url('../fonts/nebula-sans-400-italic-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nebula Sans'; font-style: italic; font-weight: 400; src: url('../fonts/nebula-sans-400-italic-greek.woff2') format('woff2'); unicode-range: U+0370-03FF; }
@font-face { font-family: 'Nebula Sans'; font-style: italic; font-weight: 400; src: url('../fonts/nebula-sans-400-italic-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "JetBrains Mono"; src: url(../fonts/JetBrainsMono-Regular.woff); }
@font-face { font-family: "JetBrains Mono"; font-weight: 700; src: url(../fonts/JetBrainsMono-Bold.woff); }
@font-face { font-family: "JetBrains Mono"; font-style: italic; src: url(../fonts/JetBrainsMono-Italic.woff); }
/* Phosphene's own lettering, used only for the imprint's name. */
@font-face { font-family: Lilita; src: url(../fonts/LilitaOne-Regular.woff2); }

/* The family's paper inks, measured on white and on the paper ground: ink 17.4 and 15.8:1,
   ink-2 9.4 and 8.5:1, muted 5.8 and 5.3:1. Hair is for rules only, never text. */
:root {
  --ink: #1b1a17;
  --ink-2: #4a463e;
  --muted: #6b6559;
  --hair: #d9d4c7;
  --paper: #f6f4ee;
  /* The book's spot ink. Code198x's colour measures 6.5:1 on white and 5.9:1 on paper,
     so it serves as text as declared. */
  --spot: #a93800;
  --body: "Nebula Sans", sans-serif;
  --mono: "JetBrains Mono", monospace;
}

html { font-family: var(--body); font-size: 10pt; line-height: 1.55; color: var(--ink-2); }
p { margin: 0 0 0.65em; }
strong { font-weight: 600; color: var(--ink); }
a { color: inherit; text-decoration: none; overflow-wrap: anywhere; }

h1, h2, h3, h4 { font-family: var(--body); font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; color: var(--ink); hyphens: manual; }
h3 { font-size: 13pt; margin: 1.5em 0 0.4em; }
h4 { font-size: 11pt; margin: 1.2em 0 0.3em; }

/* Labels: anything that names or numbers rather than reads. */
.label, .paragraph > .title, table.tableblock th, .admonitionblock .icon .title {
  font: 700 7.5pt var(--mono); letter-spacing: 0.14em; text-transform: uppercase;
}

ul, ol { margin: 0 0 0.7em; padding-left: 1.4em; }
li { margin-bottom: 0.25em; }
li p { margin: 0; }

code { font-family: var(--mono); font-size: 0.86em; color: var(--ink); hyphens: none; }
.listingblock { margin: 0.4em 0 0.9em; }
.listingblock pre {
  font-size: 8.4pt; line-height: 1.45; margin: 0; padding: 0.55em 0.8em;
  border: 0.5pt solid var(--hair); border-left: 2.5pt solid var(--spot);
  white-space: pre-wrap; overflow-wrap: anywhere;
}
.listingblock pre code { font-size: 1em; }
.listingblock .line { display: block; }
/* JetBrains Mono joins => and similar pairs into one symbol, which a beginner would copy. */
code, pre { font-variant-ligatures: none; font-feature-settings: "calt" 0, "liga" 0; }

.imageblock { margin: 0.8em 0 1.1em; }
.imageblock img { display: block; width: 100%; height: auto; border: 0.5pt solid var(--hair); }
.imageblock .title { font: italic 8.5pt/1.4 var(--body); color: var(--muted); margin-top: 0.4em; }
/* A title inside an italic caption is set upright, as italic inside italic would hide it. */
.imageblock .title em { font-style: normal; }
/* Emulator screenshots print narrower than the column, so they fit on the page more often
   instead of leaving a gap: three-quarters from 30 October 2026, 70% from 3 November, when Steve
   asked for every picture to be slightly smaller. Their captions keep to the same width. */
.imageblock:has(img[src*="screens/"]) { width: 70%; margin-left: auto; margin-right: auto; }

/* Checkpoints are paragraphs titled "Checkpoint"; the build marks them with a class,
   because e-readers don't support :has(). */
.paragraph > .title { color: var(--spot); margin-bottom: 0.3em; }
.checkpoint { border: 0.5pt solid var(--hair); border-left: 2.5pt solid var(--spot); padding: 0.5em 0.8em 0.4em; margin: 0.9em 0 1em; }
.checkpoint p { margin: 0; }

.admonitionblock { margin: 0.9em 0; border-left: 2.5pt solid var(--hair); padding-left: 0.8em; }
.admonitionblock table, .admonitionblock tr, .admonitionblock td { display: block; padding: 0; }
.admonitionblock .icon .title { color: var(--spot); }

table.tableblock { width: 100%; border-collapse: collapse; margin: 0.6em 0 1em; font-size: 9pt; }
table.tableblock th, table.tableblock td { text-align: left; vertical-align: top; padding: 0.3em 0.5em 0.3em 0; border-bottom: 0.5pt solid var(--hair); }
table.tableblock th { font-size: 7pt; color: var(--muted); border-bottom-color: var(--ink); }
table.tableblock p { margin: 0; }

.dlist dt { font-weight: 600; color: var(--ink); margin-top: 0.6em; }
.dlist dd { margin: 0.1em 0 0 1.4em; }

.partintro { font-size: 10.5pt; }

/* Rouge, in colours that stay distinct when printed. */
.highlight .c, .highlight .c1, .highlight .cm, .highlight .cs { color: #5e6b78; font-style: italic; }
.highlight .nt, .highlight .nc, .highlight .nf, .highlight .nn, .highlight .nl { color: #1d4f91; }
.highlight .na, .highlight .py, .highlight .nv { color: #8a3b12; }
.highlight .s, .highlight .s1, .highlight .s2, .highlight .sd, .highlight .sr, .highlight .dl { color: #2f6b3a; }
.highlight .m, .highlight .mi, .highlight .mf, .highlight .mh, .highlight .mb, .highlight .il { color: #9b2c55; }
.highlight .k, .highlight .kd, .highlight .kr, .highlight .kc, .highlight .kn, .highlight .kt, .highlight .kp, .highlight .nb, .highlight .bp { color: #6b2fa0; }
.highlight .err { color: inherit; }