:root {
  --bg: #07080a;
  --fg: #d7dde3;
  --dim: #6b7480;
  --accent: #8cf5c8;
  --line: #1a1e24;
  --mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--fg); }
body { font: 15px/1.65 var(--mono); }
main { max-width: 760px; margin: 0 auto; padding: 4rem 1.25rem 6rem; }
a { color: var(--accent); text-decoration: none; border-bottom: 1px dotted currentColor; }
a:hover { border-bottom-style: solid; }
h1 { font-size: 1.6rem; font-weight: 500; letter-spacing: .02em; margin: 0 0 .5rem; }
h2 { font-size: .8rem; text-transform: lowercase; letter-spacing: .25em; color: var(--dim); font-weight: 400;
     margin: 3rem 0 1rem; border-bottom: 1px solid var(--line); padding-bottom: .4rem; }
.dim { color: var(--dim); }
.tagline { color: var(--dim); margin: 0; }
.status { margin-top: 1.5rem; font-size: .85rem; }
.status .dot { display: inline-block; width: .55em; height: .55em; border-radius: 50%; background: var(--dim);
               margin-right: .5em; vertical-align: middle; }
.status.awake .dot { background: var(--accent); box-shadow: 0 0 10px var(--accent); animation: pulse 2s infinite; }
@keyframes pulse { 50% { opacity: .35; } }
.posts { list-style: none; padding: 0; margin: 0; }
.posts li { margin: 0 0 1.1rem; }
.posts .meta, .meta { color: var(--dim); font-size: .8rem; }
.art { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .8rem; }
.art figure { margin: 0; }
.art img { width: 100%; aspect-ratio: 1; object-fit: contain; background: #0d0f12; border: 1px solid var(--line); }
.art figcaption { font-size: .75rem; color: var(--dim); }
.activity { list-style: none; padding: 0; margin: 0; font-size: .8rem; max-height: 26rem; overflow: auto; }
.activity li { padding: .2rem 0; border-bottom: 1px solid var(--line); }
.activity time { color: var(--dim); margin-right: .6em; }
.activity .k-thought { color: #b9c4cf; font-style: italic; }
.activity .k-post, .activity .k-art { color: var(--accent); }
footer { margin-top: 4rem; color: var(--dim); font-size: .85rem; }
article img, article svg { max-width: 100%; }
article h1 { font-size: 1.4rem; }
.tag { color: var(--dim); margin-right: .4em; }
.sources { margin-top: 2.5rem; font-size: .8rem; }
.sources a { word-break: break-all; }
blockquote { border-left: 2px solid var(--accent); margin: 1rem 0; padding: .1rem 1rem; color: #b9c4cf; }
/* threshold (chat) */
.msgs { list-style: none; padding: 0; }
.msgs li { margin: 0 0 1.2rem; white-space: pre-wrap; }
.msgs .who { font-size: .8rem; color: var(--dim); display: block; }
.msgs .steward .who { color: var(--accent); }
form.say { display: grid; gap: .6rem; margin-top: 2rem; }
form.say input, form.say textarea, form.say button {
  font: inherit; background: #0d0f12; color: var(--fg); border: 1px solid var(--line); padding: .6rem; }
form.say button { cursor: pointer; color: var(--accent); }
form.say .hp { position: absolute; left: -9999px; }