/* Served as a file rather than an inline <style> block so the Content-Security-Policy
   can forbid inline styles outright. That matters more here than in a typical app:
   this page renders LLM-generated and hand-edited markdown. */

:root { color-scheme: light dark; }

body {
  max-width: 46rem;
  margin: 3rem auto;
  padding: 0 1.5rem;
  font: 1rem/1.65 ui-serif, Georgia, serif;
}

nav {
  font-family: ui-monospace, monospace;
  font-size: .85rem;
  margin-bottom: 2.5rem;
  display: flex;
  gap: 1rem;
  align-items: baseline;
}

nav form { margin: 0; }

nav button {
  font: inherit;
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
  cursor: pointer;
  text-decoration: underline;
}

h1 { font-size: 1.6rem; }

h2 {
  font-size: 1.1rem;
  margin-top: 2.5rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-family: ui-monospace, monospace;
}

h3 { font-size: 1rem; margin-top: 1.8rem; }

code {
  font-size: .85em;
  background: color-mix(in srgb, currentColor 8%, transparent);
  padding: .1em .3em;
  border-radius: 3px;
}

article li { margin: .4em 0; }
article a { color: inherit; text-underline-offset: .15em; }

blockquote {
  margin: 1.2em 0;
  padding-left: 1em;
  border-left: 2px solid color-mix(in srgb, currentColor 25%, transparent);
  opacity: .85;
}

form.login { margin-top: 2rem; display: flex; gap: .5rem; flex-wrap: wrap; }
form.login input { font: inherit; padding: .4em .6em; flex: 1 1 16rem; }
form.login button { font: inherit; padding: .4em 1em; cursor: pointer; }
p.message { font-family: ui-monospace, monospace; font-size: .85rem; }