/* the blog's own rules: the post furniture, the comment block, the console, the
   diffs. the page shell (base, chrome and the form primitives the mosaic shares)
   is in shell.css, which every one of these pages loads first. */



.post-seal-note {

  color: rgba(255, 214, 236, 0.45);

  font-size: 13px;

  letter-spacing: 3px;

}





.post-seal-link {

  color: var(--feather);

  letter-spacing: 1px;

}





.post-hr {

  border: 0 !important;

  border-top: 0 !important;

  height: auto;

  text-align: center;

  margin: 22px 0;

  max-width: none !important;

}





.post-hr::after {

  content: "\2727 \2727 \2727";

  color: rgba(255, 214, 236, 0.4);

  letter-spacing: 12px;

  font-size: 13px;

}





.footnotes {

  font-size: small;

  color: #9a9aa8;

}





.footnotes ol {

  padding-left: 20px;

}





.fn-ref a {

  text-decoration: none;

  color: var(--lilac);

}





.tagchip {

  display: inline-block;

  border: 1px solid rgba(201, 184, 255, 0.4);

  color: var(--lilac);

  font-size: x-small;

  letter-spacing: 2px;

  padding: 1px 8px;

  margin: 0 6px 6px 0;

  text-decoration: none;

}





.tagchip:hover {

  border-color: var(--feather);

  color: var(--feather);

}





.amen-row {

  margin: 20px 0 0 0;

  text-align: center;

}





.amen-btn {

  background: rgba(255, 214, 236, 0.08);

  border: 1px solid rgba(255, 214, 236, 0.4);

  color: var(--feather);

  font-family: 'RetroNumbers', 'Blue Screen', 'Courier New', monospace;

  font-size: small;

  letter-spacing: 2px;

  padding: 7px 18px;

  cursor: pointer;

}





.amen-btn:hover {

  background: rgba(255, 214, 236, 0.18);

  text-shadow: 0 0 8px var(--feather);

}





.amen-btn.done {

  border-color: var(--halo-gold);

  color: var(--halo-gold);

  cursor: default;

}





.copy-link {

  background: none;

  border: none;

  color: #7c7c8c;

  font-family: 'RetroNumbers', 'Blue Screen', 'Courier New', monospace;

  font-size: x-small;

  letter-spacing: 2px;

  cursor: pointer;

  margin-top: 10px;

}





.copy-link:hover {

  color: var(--feather);

}





.comments {

  margin-top: 10px;

}





.comments-title {

  color: var(--lilac);

  text-align: center;

  font-size: 16px;

  letter-spacing: 3px;

  margin: 0 0 14px 0;

}





.comment-list {

  list-style: none;

  margin: 0 0 18px 0;

  padding: 0;

}





.comment-head {

  display: block;

  color: #7c7c8c;

  font-size: x-small;

  letter-spacing: 2px;

  margin-bottom: 3px;

}





.comment-body {

  display: block;

  color: #c8c8d4;

  font-size: small;

  white-space: pre-wrap;

  word-break: break-word;

}





.comment-replies {

  list-style: none;

  margin: 10px 0 0 0;

  padding: 0 0 0 16px;

}





.comment-quote {

  margin: 4px 0;

  padding: 3px 10px;

  border-left: 2px solid var(--lilac);

  color: var(--lilac);

  font-size: x-small;

  opacity: 0.85;

}





.comment-error {

  text-align: center;

  color: #ff9db0;

  font-size: small;

  letter-spacing: 2px;

}





.entry {

  background-color: rgba(3, 3, 5, 0.92);

  border: 1px solid rgba(255, 255, 255, 0.07);

  padding: 16px 20px;

  margin: 0 0 0 0;

}





.entry-title {

  display: block;

  color: var(--feather);

  text-decoration: none;

  text-shadow: 0 0 8px rgba(255, 214, 236, 0.35);

  font-size: 19px;

}





.entry-title:hover {

  color: #ffffff;

  text-shadow: 0 0 12px var(--feather);

}





.entry-meta {

  display: block;

  color: #9a9aa8;

  font-size: x-small;

  letter-spacing: 3px;

  margin-top: 4px;

}





.entry.excerpt {

  color: #8a8a98;

  font-size: small;

}





.pinned-crown {

  color: var(--halo-gold);

  font-size: x-small;

  letter-spacing: 3px;

}





table.listing {

  width: 100%;

  border-collapse: collapse;

  font-size: small;

}





table.listing td, table.listing th {

  border: 1px solid rgba(255, 255, 255, 0.08);

  padding: 6px 10px;

  text-align: left;

}





.badge {

  font-size: x-small;

  letter-spacing: 2px;

  padding: 1px 7px;

  border: 1px solid rgba(201, 184, 255, 0.5);

  color: var(--lilac);

}





.badge.pub {

  border-color: rgba(255, 214, 236, 0.6);

  color: var(--feather);

}





.badge.gold {

  border-color: rgba(255, 233, 168, 0.6);

  color: var(--halo-gold);

}





.notice {

  text-align: center;

  color: var(--halo-gold);

  font-size: small;

  letter-spacing: 2px;

}





.composer {

  display: grid;

  grid-template-columns: 1fr;

  gap: 14px;

}





.preview-pane {

  display: none;

}





.composer.split .preview-pane {

  display: block;

  position: sticky;

  top: 10px;

}





.preview-pane iframe {

  width: 100%;

  height: 82vh;

  border: 1px solid rgba(255, 255, 255, 0.14);

  background: #000;

}





.toolbar {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  margin: 0 0 8px 0;

}





.toolbar button {

  padding: 3px 10px;

  font-size: x-small;

}





.counter {

  font-size: x-small;

  letter-spacing: 2px;

  color: #7c7c8c;

  text-align: right;

  margin: 6px 0 0 0;

}





.restore-bar {

  background: rgba(255, 233, 168, 0.06);

  border: 1px solid rgba(255, 233, 168, 0.35);

  padding: 10px 14px;

  margin: 0 0 12px 0;

  font-size: small;

  color: var(--halo-gold);

  text-align: center;

}





.post-diff {

  white-space: pre-wrap;

  word-break: break-word;

  line-height: 1.7;

  font-size: 14px;

  color: #c8c8d4;

  background: rgba(255, 255, 255, 0.03);

  border: 1px solid rgba(255, 255, 255, 0.07);

  padding: 12px;

  max-height: 60vh;

  overflow: auto;

}





.diff-ins {

  background: rgba(140, 233, 154, 0.16);

  color: #b6f2c0;

  text-decoration: none;

}





.diff-del {

  background: rgba(255, 120, 150, 0.16);

  color: #ffb3c2;

}





.diff-delta {

  color: #7c7c8c;

  font-size: x-small;

  letter-spacing: 1px;

  white-space: nowrap;

}



.console-mode .toolbar button {

  font-family: Consolas, 'Cascadia Mono', 'Courier New', monospace;

  letter-spacing: 0.5px;

}





.console-mode .toolbar button {

  font-weight: 700;

}



.console-mode input {

  font-family: Consolas, 'Cascadia Mono', 'Courier New', monospace;

}