
:root {
  --bg: #e3e3e8;
  --fg: #000;
  --muted: #444;
  --shell: 1004px;
  --text: 40em; /* ~615px, matches TT1 entry-content width */
}
* { box-sizing: border-box; }
body {
  background: var(--bg); color: var(--fg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 0.9rem; line-height: 1.7;
  margin: 0; padding: 2rem 1rem;
}
.shell { max-width: var(--shell); margin: 0 auto; }
header.site { margin-bottom: 2.5rem; border-bottom: 1px solid #c9c9d2; padding-bottom: 1rem; }
header.site h1 { font-size: 1.4rem; margin: 0; font-weight: 700; letter-spacing: .01em; }
header.site h1 a { color: var(--fg); text-decoration: none; }
header.site h1 a:hover { text-decoration: underline; }
header.site p.tag { margin: .3rem 0 0; color: var(--muted); font-style: italic; }
nav.home-link { margin: 0 0 2rem; font-size: .85rem; }
nav.home-link a { color: var(--fg); }
article { max-width: var(--text); margin: 0 auto; }
article > * { max-width: 100%; }
article h2 { font-size: 1.3rem; line-height: 1.3; margin: 0 0 .4rem; }
article h3, article h4 { line-height: 1.3; }
article time { display: block; color: var(--muted); font-size: .85rem; margin-bottom: 1.6rem; }
article p, article li { line-height: 1.7; }
article a { color: var(--fg); text-underline-offset: 2px; }
/* centered photos, not too big — escapes the text column but stays modest */
article img { display: block; max-width: 680px; height: auto; margin: 1.6rem auto; }
article figure { margin: 1.8rem auto; text-align: center; }
article figure figcaption { color: var(--muted); font-size: .8rem; margin-top: .4rem; }
article pre { background: #282828; color: #f0f0f0; padding: 1em; overflow-x: auto; font-size: .82rem; line-height: 1.5; }
article code { background: #d6d6de; padding: .1em .35em; border-radius: 3px; font-size: .85em; }
article pre code { background: none; padding: 0; }
article blockquote { border-left: 3px solid var(--fg); margin: 1.5rem 0; padding: .2rem 0 .2rem 1.2rem; font-style: italic; }
article table { border-collapse: collapse; margin: 1.5rem auto; font-size: .85rem; }
article th, article td { border: 1px solid #b9b9c2; padding: .4em .7em; text-align: left; }
ul.index { list-style: none; padding: 0; margin: 0 auto; max-width: var(--text); }
ul.index li { margin-bottom: .55em; }
ul.index small { color: var(--muted); }
hr { border: 0; border-top: 1px solid #c9c9d2; margin: 2.5rem auto; max-width: var(--text); }
.notice { max-width: var(--text); margin: 0 auto 2.5rem; color: var(--muted); font-size: .85rem; }
.notice a { color: var(--fg); }
footer { margin: 3rem auto 0; max-width: var(--text); color: var(--muted); font-size: .8rem; }
@media (min-width: 700px) { body { padding: 3rem 2rem; } header.site h1 { font-size: 1.7rem; } }
