html { max-width: 80ch; padding: 1ch; margin: auto }
body { hyphens: auto; color: black; background-color: white; }
header a { margin-right: 1ch }
h1 { text-wrap: balance }
footer { border-top: 1px solid #888 }
form, textarea { width: 97%; font-size: inherit }
pre { background-color: #ddd; padding: 1ex 2ex; overflow-x: auto }
.diff { font-size: inherit; white-space: normal; overflow-wrap: break-word; border: 1px solid #333; padding: 1ch }
img, video { max-width: 100%; max-height: 90vh; width: auto; height: auto }
.right img { float: right; margin-left: 2em; margin-bottom: 1em; border: 1px solid black }
.left img { float: left; margin-right: 2em; margin-bottom: 1em; border: 1px solid black }
button { background-color: #eee; color: inherit; border-radius: 4px; border-width: 1px }
del  { background-color: #fab }
ins  { background-color: #af8 }
#search, #id { max-width: 30ch; width: calc(100% - 23ch) }
.result { font-size: larger }
.score { font-size: smaller; opacity: 0.8 }
.image { font-size: small; display: inline-block; margin-right: 1em; max-width: calc(20% - 1em); }
#view   form  { margin-top: 2px }
#view  button { width: 6ch }
#view   label { display: inline-block; width: 10ch }
#upload label { display: inline-block; width: 15ch }
#upload input[type=text] { width: 30ch }
img.last { max-width: 20% }
hr { border-bottom: 1px }
th { font-weight: normal }
th + th, td + td { padding-left: 1em }

@media (prefers-color-scheme: dark) {
    body { color: white; background-color: black }
    footer { border-top: 1px solid #666 }
    .diff { background-color: inherit; border: 1px solid #666 }
    .right img { border: 1px solid #111 }
    .left img { border: 1px solid #111 }
    pre { background-color: #333; }
    button { background-color: #eee; color: inherit }
    del  { background-color: #f40 }
    ins  { background-color: #070 }
    a:link { color: #1e90ff }
    a:hover { color: #63b8ff }
    a:visited { color: #7a67ee }
    img { opacity: .75; transition: opacity .5s ease-in-out; }
    img:hover { opacity: 1; }
    input, input[type="text"], textarea, button, .diff {
	color: #eeeee8; background-color: #555
    }
}
