body { margin: 0; background: #e9edf2; color: #222; font-family: sans-serif; font-size: 14px; }
a { color: #0a63c9; }
#top { background: #16191F; border-bottom: 3px solid #E4002B; padding: 6px 10px; }
#top .logo { color: #fff; font-weight: bold; font-size: 18px; text-decoration: none; letter-spacing: 1px; }
#top .logo img { vertical-align: middle; margin-right: 4px; border-radius: 6px; }
.hero { text-align: center; }
.hero img { margin: 6px auto 2px; }
#nav { background: #fff; border-bottom: 1px solid #ccd; padding: 4px 6px; }
#nav a, #nav form { display: inline-block; margin-right: 10px; }
#main { max-width: 400px; margin: 0 auto; padding: 6px; }
.box { background: #fff; border: 1px solid #ccd; border-radius: 6px; padding: 8px; margin-bottom: 8px; }
h1 { font-size: 17px; margin: 2px 0 6px; }
h2 { font-size: 14px; margin: 10px 2px 4px; color: #555; }
label { display: block; margin-bottom: 6px; }
input, textarea { width: 96%; font-size: 14px; padding: 3px; border: 1px solid #aab; }
.btn { display: inline-block; background: #E4002B; color: #fff; border: 0; border-radius: 4px; padding: 5px 12px; font-size: 14px; text-decoration: none; }
.btn.alt { background: #2A2F39; }
.link { background: none; border: 0; padding: 0; color: #0a63c9; font-size: 14px; text-decoration: underline; }
.post, .row { background: #fff; border: 1px solid #dde; border-radius: 6px; padding: 6px 8px; margin-bottom: 6px; }
.post p { margin: 4px 0; word-wrap: break-word; }
.name { font-weight: bold; text-decoration: none; margin-right: 6px; }
.muted { color: #888; }
.small { font-size: 12px; }
.code { font-size: 18px; letter-spacing: 1px; }
.status { font-style: italic; }
.error { color: #c00; margin: 4px 0; }
.log { font-family: monospace; font-size: 11px; background: #fff; border-left: 3px solid #22C55E; padding: 3px 6px; margin-bottom: 2px; word-wrap: break-word; }
.log.bad { border-left-color: #E4002B; }
.guide ol { margin: 4px 0; padding-left: 20px; }
.guide li { margin-bottom: 4px; }