:root { color-scheme: light; }
* { box-sizing: border-box; }
body {
  margin: 0; padding: 0 1.25rem 3rem;
  font: 16px/1.65 Georgia, "Times New Roman", serif;
  color: #1c1c1e; background: #faf9f6;
  max-width: 46rem; margin-inline: auto;
}
header { padding: 2.5rem 0 1rem; border-bottom: 2px solid #1c1c1e; }
h1 { font: 700 2.1rem/1.15 "Helvetica Neue", Arial, sans-serif; letter-spacing: -0.02em; margin: 0; }
.tag { margin: 0.4rem 0 0; color: #555; font-family: "Helvetica Neue", Arial, sans-serif; }
h2 { font: 600 1.15rem "Helvetica Neue", Arial, sans-serif; text-transform: uppercase; letter-spacing: 0.08em; color: #444; margin: 2.2rem 0 0.6rem; }
p { margin: 0.5rem 0; }
ol.steps { margin: 0.5rem 0; padding-left: 1.2rem; }
ol.steps li { padding: 0.3rem 0; }
p.free {
  border-left: 4px solid #0d4f8b;
  padding: 0.5rem 0 0.5rem 0.9rem;
  margin: 1rem 0;
  background: #f1f4f8;
}
.diff { margin: 0.8rem 0; }
.diff p {
  font-family: "Courier New", Courier, monospace;
  font-size: 0.85rem; line-height: 1.55;
  margin: 0; padding: 0.7rem 0.9rem;
  white-space: pre-line;
  overflow-wrap: break-word;
}
.diff p.before { background: #f6ecec; border-left: 4px solid #a33; }
.diff p.after { background: #ecf3ec; border-left: 4px solid #2a7a2a; }
.diff p span {
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 700; font-size: 0.75rem;
  text-transform: uppercase; letter-spacing: 0.08em;
  display: block; margin-bottom: 0.25rem;
}
.diff p.before span { color: #a33; }
.diff p.after span { color: #2a7a2a; }
a { color: #0d4f8b; }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid #e6e3dc; color: #777; font-size: 0.85rem; }