body[a="dark"] { filter: invert(1); }
body[a="dark"] img { filter: invert(1); }
body[a="dark"] img.ioda { filter: invert(0); }
body[a="dark"] .emoji { filter: invert(1); }
body[a="dark"] iframe { filter: invert(1); }

@media (prefers-color-scheme: dark) { body[a="auto"] { filter: invert(1); }
  body[a="auto"] img { filter: invert(1); }
  body[a="auto"] img.ioda { filter: invert(0); }
  body[a="auto"] .emoji { filter: invert(1); }
  body[a="auto"] iframe { filter: invert(1); } }
html, body { background: white; }

html { height: 100%; scroll-behavior: smooth; }

body { color: black; font-family: monospace; font-size: 16px; line-height: 1.4; margin: 0; min-height: 100%; overflow-wrap: break-word; }

.post-meta { text-align: right; }

h2, h3, h4, h5, h6 { margin-top: 3rem; }

hr { margin: 2rem 0; }

p { margin: 1rem 0; }

li { margin: 0.4rem 0; }

*:target { background: yellow; }

.w { max-width: 640px; margin: 0 auto; padding: 4rem 2rem; }

hr { text-align: center; border: 0; }
hr:before { content: "/////"; }
hr:after { content: attr(data-content) "/////"; }

table { width: 100%; }

table, th, td { border: thin solid black; border-collapse: collapse; padding: 0.4rem; }

code { color: white; background: black; }

div.highlighter-rouge code { display: block; overflow-x: auto; white-space: pre-wrap; padding: 1rem; }

blockquote { font-style: italic; border: thin solid black; padding: 1rem; }
blockquote p { margin: 0; }

img { max-width: 100%; display: block; margin: 0 auto; }

body { font-family: "Hoefler Text", Georgia, Garamond, "Times New Roman", serif; font-size: 19px; line-height: 1.7; }

h1, h2, h3, h4, h5, h6 { font-family: "Hoefler Text", Georgia, Garamond, "Times New Roman", serif; font-weight: 700; line-height: 1.3; }

code, pre { font-family: "SF Mono", Consolas, "Liberation Mono", Menlo, monospace; }

html, body { background: #f5f3f0; }

a { color: #C8960C; }

table { width: 100%; margin: 1.5em 0; border-collapse: collapse; font-size: 0.9em; border: none; }

thead tr { border-top: 2px solid #444; border-bottom: 1px solid #444; }

tbody tr:last-child { border-bottom: 2px solid #444; }

th, td { padding: 3px 12px; text-align: left; border: none; }

th { padding-top: 4px; padding-bottom: 4px; font-weight: 400; }

th:first-child, td:first-child { padding-left: 0; }

th:last-child, td:last-child { padding-right: 0; font-weight: 700; }

body[a="dark"] { filter: none !important; background: #1c1a18; color: #e8e6e3; }
body[a="dark"] a { color: #C8960C; }
body[a="dark"] img, body[a="dark"] iframe, body[a="dark"] .emoji { filter: none !important; }
body[a="dark"] code { color: #e8e6e3; background: #0e1011; }
body[a="dark"] thead tr { border-top-color: #888; border-bottom-color: #888; }
body[a="dark"] tbody tr:last-child { border-bottom-color: #888; }
body[a="dark"] blockquote { border-color: #444; }

html:has(body[a="dark"]) { background: #1c1a18; }

@media (prefers-color-scheme: dark) { body[a="auto"] { filter: none !important; background: #1c1a18; color: #e8e6e3; }
  body[a="auto"] a { color: #C8960C; }
  body[a="auto"] img, body[a="auto"] iframe, body[a="auto"] .emoji { filter: none !important; }
  body[a="auto"] code { color: #e8e6e3; background: #0e1011; }
  body[a="auto"] thead tr { border-top-color: #888; border-bottom-color: #888; }
  body[a="auto"] tbody tr:last-child { border-bottom-color: #888; }
  body[a="auto"] blockquote { border-color: #444; }
  html { background: #1c1a18; } }
