/* brutalist — system defaults, almost no overrides.
   Per brutalist-web.design: "start with left-aligned black text on a white
   background, and apply styling only to solve a specific problem." */

:root {
  color-scheme: only light;
}

/* Constrain measure for readability — solving a specific problem */
body {
  max-width: 70ch;
  margin: 1rem auto;
  padding: 0 1rem;
}

/* Underlined links, blue / purple — browser defaults already do this; we
   reinforce it in case a user agent has overridden it. */
a:link    { color: #0000ee; }
a:visited { color: #551a8b; }
a:hover, a:focus { background: #ffff00; color: #000; }

/* Fix one specific problem: the danger button should look distinct. */
button.danger { color: #cc0000; font-weight: bold; }

/* Fix one specific problem: failure status should not be invisible. */
.bad { color: #cc0000; }

/* Bordered table is the browser's HTML 4 default. */

/* Inline modal section: a thin border so it reads as separate. */
aside {
  border: 2px solid #000;
  padding: 1rem;
  margin: 1rem 0;
  background: #ffffd0;
}

/* Item list: kill the marker, keep the rest. */
.items { list-style: none; padding-left: 0; }
.items li { margin-bottom: 1.5rem; }

/* Code block: pre is already preformatted, just give it a background so
   it doesn't blend in with prose. */
pre {
  background: #f0f0f0;
  padding: .75rem 1rem;
  border-left: 4px solid #000;
  overflow-x: auto;
}
code { background: #f0f0f0; padding: 0 3px; }
pre code { background: transparent; padding: 0; }

/* That's everything. */