/* Reset */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: #0f0f0f;
  color: #e8e8e8;
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.6;
}

/* Layout */
main, header {
  max-width: 720px;
  margin: 0 auto;
  padding: 32px;
}
@media (max-width: 600px) {
  main, header { padding: 16px; }
}

/* Typography */
h1 { font-size: 2rem; margin-bottom: .25rem; }
h2 { font-size: 1.25rem; color: #e8e8e8; margin-top: 0; }
h3 { font-size: 1rem; margin-bottom: .5rem; }
a { color: #7aa2f7; text-decoration: none; }
a:hover { text-decoration: underline; }
.updated { color: #888; margin: 0; font-size: .875rem; }

/* Week separator */
hr { border: none; border-top: 1px solid #2a2a2a; margin: 2.5rem 0 1rem; }

/* Accordion */
details > summary {
  cursor: pointer;
  list-style: none;
  color: #888;
  font-size: .875rem;
  padding: .25rem 0;
}
details > summary::-webkit-details-marker { display: none; }
details > summary::before { content: "▶ "; }
details[open] > summary::before { content: "▼ "; }

/* Topic sections */
.topic { margin-bottom: 2rem; }
.topic p em { color: #b0b0b0; }

/* Item list */
.topic ul { padding-left: 1.25rem; }
.topic li { margin-bottom: 1rem; }
.summary { margin: .2rem 0 .1rem; font-size: .9rem; }
.source { color: #888; font-size: .8rem; }