/*
  The forum wears the Hall's skin.

  The older rules (site.css, thread.css, compose.css, account.css, mod.css) describe the forum's parts as
  brass plates with soft gradients and thin borders. This file loads after them and draws the same parts
  the way the game site draws everything: a window with a bar, a raised plate, a sunken well, whole
  pixels, the pixel face for names and the plain sans for sentences. It changes no markup. The window,
  the key, the field, the chip and the lamp themselves are the kit's (gump.css, components.css), so
  everything the forum draws with those already matches.

  Order: windows, announcements, categories and rows, forum and thread heads, pager and statistics, plain
  pages, search and members, posts, polls, the writing desk, a member's pages, moderation.
*/

/* ------------------------------------------------------------------ windows */

.cat, .tlist, .notices, .forumhead, .threadhead, .post, .quickreply, .poll-vote, .poll-edit {
  --s: 4px;
  position: relative;
  background: var(--gump-fill);
  border: 0;
  clip-path: var(--step);
  box-shadow:
    inset 0 0 0 2px #000,
    inset 2px 2px 0 2px var(--gump-hi),
    inset -2px -2px 0 2px var(--gump-lo),
    inset 0 0 0 6px #14120f;
}
.poll-vote, .poll-edit { --s: 3px; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.cat, .tlist, .notices, .forumhead, .threadhead, .post, .quickreply { margin-bottom: 1.8rem; }

/* ------------------------------------------------------------------ announcements */

.notices { padding: 6px; }
.notice { padding: .55rem .9rem; }
.notice + .notice { border-top: 2px solid #1f1c18; }
.notice-mark { width: 2.1rem; height: 2.1rem; color: var(--heat-3); background: #080707; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); border: 0; }
.notice-title { font: 400 16px/1.5 var(--pixel); color: var(--brass-hi); text-shadow: 2px 2px 0 #000; }
.notice-title:hover { color: var(--heat-4); text-decoration: underline; text-decoration-thickness: 2px; }
.notice-meta { font: .75rem/1.3 var(--read); }

/* ------------------------------------------------------------------ categories and rows */

/* A category is a window and its bar is the category. A row steps its pointer to where you are. */
.catbar {
  min-height: 2.5rem;
  margin: 6px 6px 0;
  padding: 0 .9rem;
  gap: .7rem;
  background: repeating-linear-gradient(180deg, #ffffff0a 0 2px, transparent 2px 4px), var(--bar-fill);
  border: 0;
  box-shadow: inset 0 2px 0 #000, inset 0 -2px 0 var(--brass-deep);
}
.catbar::after { content: none; }
.catbar h2 { font: 400 16px/1 var(--pixel); letter-spacing: .1em; color: var(--brass-hi); text-shadow: 2px 2px 0 #000; }
.catbar-note { font: .8125rem/1.3 var(--read); letter-spacing: 0; color: var(--ink-dim); }
.catbar-cols { font: 400 16px/1 var(--pixel); letter-spacing: .08em; color: var(--brass); text-shadow: 2px 2px 0 #000; }
.cat-chev { color: var(--heat-3); }
.board { margin: 0 6px 6px; background: transparent; border: 0; box-shadow: none; }
.tlist .board, .tlist .divider + .board { border-top: 0; }
.frow, .trow { padding: .9rem 1rem .9rem 1.5rem; background: transparent; border-top: 2px solid #1f1c18; box-shadow: none; transition: none; }
.frow:nth-child(even), .trow:nth-child(even) { background: #ffffff04; }
.frow:hover, .trow:hover, .frow:focus-within, .trow:focus-within { background: #2a1c0e; }
.frow::before, .trow::before { content: "\25BA"; position: absolute; left: .45rem; top: 50%; margin-top: -.55rem; font: 400 16px/1 var(--pixel); color: var(--heat-3); opacity: 0; }
.frow:hover::before, .trow:hover::before, .frow:focus-within::before, .trow:focus-within::before { opacity: 1; }
.is-new { background-color: #1f140a !important; }
.frow-title, .trow-title { font: 400 16px/1.4 var(--pixel); letter-spacing: .02em; }
.trow-title { font-size: 16px; }
.frow-title a, .trow-title a { color: var(--brass-hi); text-shadow: 2px 2px 0 #000; }
.frow-title a:hover, .trow-title a:hover { color: var(--heat-4); text-decoration: underline; text-decoration-thickness: 2px; }
.frow-desc { font: .875rem/1.55 var(--read); }
.frow-subs { font: .75rem/1.5 var(--read); }
.frow-subs span:first-child { font-size: .6875rem; }
.frow-count, .trow-count { min-height: 3.1rem; background: #050403; border: 0; border-radius: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.frow-count .num, .trow-count .num { font: 400 16px/1.2 var(--pixel); color: var(--heat-4); text-shadow: 0 0 8px #ff741a66; }
.frow-count .lbl, .trow-count .lbl { font: .6875rem/1.3 var(--read); letter-spacing: .08em; }
.frow-last-title { font: 400 16px/1.35 var(--pixel); color: var(--brass); }
.trow-mark { color: var(--brass-mid); }
.ico-announce { color: var(--heat-3); }
.ico-pin { color: var(--brass-hi); }
.mini-pages a { font: 400 16px/1 var(--pixel); color: var(--brass); background: #0f0e0c; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.mini-pages a:hover { color: var(--heat-4); }
.divider { margin: 0 6px; padding: .45rem 1rem; font: 400 16px/1.3 var(--pixel); letter-spacing: .1em; color: var(--brass); background: #14110e; border: 0; border-top: 2px solid #1f1c18; }
.tlist-foot { margin: 0 6px 6px; padding: .6rem 1rem; font: .8125rem/1.4 var(--read); background: #14110e; border: 0; border-top: 2px solid #1f1c18; }
.empty-row { padding: 1.4rem 1rem; }

/* ------------------------------------------------------------------ forum and thread heads */

/* The head of a forum or a thread is a black window with the name in heat. The engraved pictures that
   stood behind it are gone: a picture in another hand is what made the forum look like another place. */
.forumhead, .threadhead { overflow: visible; isolation: auto; }
.forumhead::before, .threadhead::before { display: none; }
.forumhead-body, .threadhead-body { padding: 1.5rem 1.7rem; }
.forumhead-compact .forumhead-body { padding-block: 1.1rem; }
.forumhead-compact h1 { font-size: 32px; }
.forumhead h1, .threadhead h1 { text-shadow: 3px 3px 0 #000; }
.forumhead-text p { font: .9375rem/1.6 var(--read); text-shadow: none; }
.forumhead-text .forumhead-stats, .threadhead-meta { font: .8125rem/1.5 var(--read); }
.rules { margin-bottom: 1.4rem; }
.rules > summary { font: 400 16px/1.3 var(--pixel); letter-spacing: .05em; }
.rules-body { font: .875rem/1.65 var(--read); }

/* ------------------------------------------------------------------ pager, jump bar, statistics */

.pager { font: .8125rem/1.3 var(--read); }
.pager-where { font: 400 16px/1.3 var(--pixel); }
.pager a { --s: 2px; min-width: 2.4rem; min-height: 2.4rem; padding: .3rem .7rem .4rem; font: 400 16px/1 var(--pixel); color: var(--brass-hi); text-shadow: 2px 2px 0 #000; background: linear-gradient(var(--plate-a) 0 50%, var(--plate-b) 50% 100%); border: 0; border-radius: 0; clip-path: var(--step); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--bev-hi), inset -2px -2px 0 2px var(--bev-lo); }
.pager a:hover { color: var(--heat-ink); text-shadow: none; background: linear-gradient(var(--heat-4) 0 50%, var(--heat-3) 50% 100%); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--heat-5), inset -2px -2px 0 2px #b0561a; }
.pager a[aria-current] { color: var(--heat-5); background: linear-gradient(#b9531a 0 50%, #9b4314 50% 100%); border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #ffb067, inset -2px -2px 0 2px #5e220a; font-weight: 400; }
.pager-goto input, .jump select { font: 400 16px/1.3 var(--pixel); color: var(--ink); background: #0c0b0a; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.stats dl > div { background: #050403; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.stats dt { font: 400 16px/1.3 var(--pixel); letter-spacing: .04em; }
.stats dd { font: 400 16px/1.3 var(--pixel); color: var(--heat-4); text-shadow: 0 0 8px #ff741a55; }
.stats-online { font: .8125rem/1.6 var(--read); }

/* ------------------------------------------------------------------ plain pages and forms */

.notice-page { max-width: 40rem; }
.choices legend { font: 400 16px/1.3 var(--pixel); letter-spacing: .02em; color: var(--brass); }
.choice { font: .875rem/1.5 var(--read); background: #14110e; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.choice + .choice { margin-top: 2px; }
.choice:hover { background: #1f1710; }
.ledger { font: .8125rem/1.5 var(--read); }
.ledger th { font: 400 16px/1.3 var(--pixel); letter-spacing: .04em; background: #14110e; border-bottom: 2px solid var(--brass-deep); }
.ledger td { border-top: 2px solid #1f1c18; }
.ledger tbody tr:nth-child(even) { background: #ffffff04; }
.prose-body { font: .9375rem/1.75 var(--read); }
.prose-body code { font: .85em var(--mono); color: #f0e4c4; background: #0c0b0b; border: 0; box-shadow: inset 0 0 0 1px #000, inset 0 -2px 0 #2a241b; }
.prose-body kbd { color: #f6ecd0; background: linear-gradient(#6b5f45 0, #6b5f45 calc(100% - 4px), #2e2619 calc(100% - 4px)); border: 0; font: 400 16px/1.35 var(--pixel); }
.quote-preview { font-style: normal; }

/* ------------------------------------------------------------------ search and members */

.result-list { background: transparent; border: 0; }
.result { border-top: 2px solid #1f1c18; }
.result h3 { font: 400 16px/1.4 var(--pixel); }
.result h3 a { color: var(--brass-hi); text-shadow: 2px 2px 0 #000; }
.result h3 a:hover { color: var(--heat-4); text-decoration: underline; text-decoration-thickness: 2px; }
.snippet { font: .875rem/1.65 var(--read); }
.snippet mark { color: var(--heat-ink); background: var(--heat-3); }
.results-count { font: 400 16px/1 var(--pixel); }
.memberfacts { font: .8125rem/1.5 var(--read); }
.memberfacts dt { font: 400 16px/1.4 var(--pixel); letter-spacing: .02em; }
.linklist li { border-top: 2px solid #1f1c18; }
.linklist a { font: 400 16px/1.4 var(--pixel); }

/* ------------------------------------------------------------------ posts */

/* A post is a window with the author on a rail at its left, in a slot of their own. */
.post { margin-bottom: 1.4rem; }
.post:target { box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--heat-3), inset -2px -2px 0 2px var(--heat-1), inset 0 0 0 6px #1a110a, 0 0 22px #ff741a33; }
.post.is-held, .post.is-deleted { background: #1c1710; }
.post.is-reported { box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #b9531a, inset -2px -2px 0 2px #5e220a, inset 0 0 0 6px #1a110a; }
.postbit { margin: 6px 0 6px 6px; padding: 1.1rem .8rem 1rem; background: #100e0b; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #2a2419, inset -2px -2px 0 2px #070605; }
.postbit::after { display: none; }
.postbit-sigil .sigil { padding: 4px; background: #080707; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.postbit-name { font: 400 16px/1.3 var(--pixel); letter-spacing: .02em; }
.postbit-name a { color: var(--brass-hi); text-shadow: 2px 2px 0 #000; }
.postbit-name a:hover { color: var(--heat-4); text-decoration: underline; text-decoration-thickness: 2px; }
.postbit-rank { margin-top: .2rem; font: .8125rem/1.3 var(--read); font-style: normal; color: var(--ink-dim); }
.postbit-pips i { width: .6rem; height: .6rem; transform: none; background: #2a241b; border: 0; box-shadow: inset 0 0 0 2px #000; }
.postbit-pips i.on { background: var(--heat-3); }
.postbit-facts { font: .75rem/1.45 var(--read); border-top: 2px solid #1f1c18; box-shadow: none; }
.postbit-facts dt { font: 400 16px/1.3 var(--pixel); letter-spacing: .02em; }
.post-main { padding: .9rem 1.6rem 1rem; }
.post-head { font: .8125rem/1.4 var(--read); border-bottom: 2px solid #1f1c18; box-shadow: none; }
.post-num { font: 400 16px/1.2 var(--pixel); color: var(--brass); border: 0; }
.post-num:hover { color: var(--heat-4); text-decoration: underline; }
.post-state { font: .8125rem/1.5 var(--read); background: #1b1810; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #5a4a2e, inset -2px -2px 0 2px #1a140a; }
.post-body { font: 400 .9375rem/1.8 var(--read); }
.post-body h2, .post-body h3 { font-family: var(--pixel); font-weight: 400; color: var(--heat-4); text-shadow: 2px 2px 0 #000; }
.post-body h2 { font-size: 32px; }
.post-body h3 { font-size: 16px; letter-spacing: .06em; text-transform: uppercase; }
.post-body hr { height: 4px; background: linear-gradient(90deg, var(--brass-lo) 0 4px, transparent 4px 8px) 0 0 / 8px 4px repeat-x; }
.post-body li::marker { color: var(--heat-3); }
.post-body a.mention { color: var(--brass-hi); background: #2a1c0e; border-bottom: 2px solid var(--heat-3); }
.post-body strong { color: #fff3d6; font-weight: 700; }
.post-body img.post-image { border: 0; box-shadow: 0 0 0 2px #000, 0 0 0 4px var(--brass-deep); }
.post-body blockquote.quote { background: #0c0b09; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.quote-head { font: 400 16px/1.4 var(--pixel); color: var(--brass); background: #14110e; border-bottom: 2px solid #1f1c18; }
.quote-body { font-size: .875rem; line-height: 1.7; color: var(--ink-dim); }
.post-body pre.code { color: #f3e9cc; background: radial-gradient(ellipse at 50% 30%, #1a160d 0, #0c0a06 70%); border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.post-body code.code { color: #f0e4c4; background: #0c0b0b; border: 0; box-shadow: inset 0 0 0 1px #000, inset 0 -2px 0 #2a241b; }
.post-body details.spoiler { background: #0c0b09; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.post-body details.spoiler > summary { font: 400 16px/1.3 var(--pixel); letter-spacing: .04em; color: var(--brass); }
.spoiler-body { border-top: 2px solid #1f1c18; }
.post-body .table th { font: 400 16px/1.3 var(--pixel); background: #14110e; }
.post-body .table th, .post-body .table td { border: 0; border-top: 2px solid #1f1c18; }
.post-sig { font: .75rem/1.6 var(--read); border-top: 2px solid #1f1c18; }
.post-edited { font: .75rem/1.4 var(--read); font-style: normal; }
.act { min-height: 2.25rem; padding: .25rem .7rem; font: 400 16px/1.2 var(--pixel); color: var(--brass); border: 0; border-radius: 0; }
.act:hover { color: var(--heat-4); background: #2a1c0e; border-color: transparent; }
.act-on { color: var(--heat-4); background: #2a1c0e; }
.post-likes { font: .8125rem/1.4 var(--read); }
.post-ignored { background: #14110e; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.post-ignored[open] > summary { border-bottom: 2px solid #1f1c18; }
.basket { font: .875rem/1.4 var(--read); background: #0f1d1b; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--arc-dim), inset -2px -2px 0 2px #0a1513; }

/* ------------------------------------------------------------------ polls */

.poll-question { font: 400 16px/1.4 var(--pixel); letter-spacing: .02em; color: var(--heat-4); text-shadow: 2px 2px 0 #000; }
.poll-label { font: .9375rem/1.45 var(--read); }
.poll-plain li { background: #14110e; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.poll-count { font: .8125rem/1.3 var(--read); }
.poll progress { height: 1rem; border: 0; background: #050403; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.poll-vote > summary, .poll-edit > summary { font: 400 16px/1.3 var(--pixel); letter-spacing: .04em; }

/* ------------------------------------------------------------------ the writing desk */

.editor { background: #0c0b0a; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.editor:focus-within { border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--heat-3); }
.toolbar { background: #14110e; border-bottom: 2px solid #000; box-shadow: none; }
.tool-group { background: #0c0b0a; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.tool {
  --s: 2px;
  color: var(--brass-hi);
  background: linear-gradient(var(--plate-a) 0 50%, var(--plate-b) 50% 100%);
  border: 0;
  border-radius: 0;
  clip-path: var(--step);
  box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--bev-hi), inset -2px -2px 0 2px var(--bev-lo);
}
.tool:hover { color: var(--heat-ink); background: linear-gradient(var(--heat-4) 0 50%, var(--heat-3) 50% 100%); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--heat-5), inset -2px -2px 0 2px #b0561a; }
.tool:active { transform: none; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #b0561a, inset -2px -2px 0 2px var(--heat-5); }
.tool:focus-visible { outline: 0; box-shadow: inset 0 0 0 2px #000, inset 0 0 0 4px var(--arc); }
.tool[aria-pressed="true"] { color: var(--heat-5); background: linear-gradient(#b9531a 0 50%, #9b4314 50% 100%); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #ffb067, inset -2px -2px 0 2px #5e220a; }
.tool[aria-pressed="true"]::after { border-radius: 0; background: var(--heat-5); }
.tool-label { font: 400 16px/1.1 var(--pixel); }
.glyph { font: 400 16px/1 var(--pixel); }
.emoji-pop { background: #14110e; border-bottom: 2px solid #000; }
.emoji-pop button { border-radius: 0; }
textarea.input-area { font: 400 .9375rem/1.75 var(--read); }
.visual { font: 400 .9375rem/1.75 var(--read); }
.visual h2, .visual h3 { font-family: var(--pixel); color: var(--heat-4); }
.visual h2 { font-size: 32px; }
.visual h3 { font-size: 16px; }
.visual blockquote, .visual pre, .visual code, .visual .v-spoiler { border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.visual .v-img img { border: 0; box-shadow: 0 0 0 2px #000; }
dialog.ask { border: 0; background: var(--gump-fill); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--gump-hi), inset -2px -2px 0 2px var(--gump-lo), inset 0 0 0 6px #14120f; }
dialog.ask h2 { font: 400 16px/1.3 var(--pixel); letter-spacing: .06em; text-transform: uppercase; color: var(--heat-4); text-shadow: 2px 2px 0 #000; }
.editor-foot { font: .75rem/1.4 var(--read); background: #080706; border-top: 2px solid #000; }
.suggestions { background: #14110e; border-top: 2px solid #000; }
.suggestions li { font: 400 16px/1.3 var(--pixel); }
.proof { background: var(--gump-fill); border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #3b3326, inset -2px -2px 0 2px #0a0907; }
.proof-status { font: .75rem/1.4 var(--read); }
.review-item { border-top: 2px solid #1f1c18; }
.review-head { font: .8125rem/1.4 var(--read); }
.review-head a { font: 400 16px/1.4 var(--pixel); }
.writing-tab { font: 400 16px/1 var(--pixel); letter-spacing: .06em; color: var(--brass); background: linear-gradient(var(--plate-a) 0 50%, var(--plate-b) 50% 100%); border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--bev-hi), inset -2px -2px 0 2px var(--bev-lo); }
.writing-tab[aria-selected="true"] { color: var(--heat-5); background: linear-gradient(#b9531a 0 50%, #9b4314 50% 100%); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #ffb067, inset -2px -2px 0 2px #5e220a; }

/* ------------------------------------------------------------------ a member's pages */

.alertmark { background: #080707; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.alertrow.is-unread, .convrow.is-unread { background: #1f140a; }
.alertrow.is-unread .alertmark { color: var(--heat-3); background: #2a1c0e; border: 0; }
.alertbody > a { font: .9375rem/1.5 var(--read); color: var(--brass-hi); }
.rowitem-main > a, .convtitle { font: 400 16px/1.4 var(--pixel); color: var(--brass-hi); text-shadow: 2px 2px 0 #000; }
.rowitem-main > a:hover, .convtitle:hover { color: var(--heat-4); }
.rowitem, .alertrow, .convrow { border-top: 2px solid #1f1c18; }
.convhead h1 { font-size: 32px; }
.forumpick { border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.forumpick .choice { box-shadow: none; border-bottom: 2px solid #1f1c18; }

/* ------------------------------------------------------------------ moderation and administration */

.modcard { --s: 3px; position: relative; padding: 1.2rem 1.3rem; color: var(--brass); background: var(--gump-fill); border: 0; clip-path: var(--step); box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px #5a4a2e, inset -2px -2px 0 2px #1a140a; transition: none; }
.modcard:hover { color: var(--heat-4); background: #1f140a; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--heat-3), inset -2px -2px 0 2px var(--heat-1); }
.modcard-num { font: 400 32px/1 var(--pixel); color: var(--heat-4); text-shadow: 3px 3px 0 #000; }
.modcard-name { font: 400 16px/1.3 var(--pixel); letter-spacing: .06em; }
.modpost { background: #0c0b09; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.reportlist { font: .8125rem/1.5 var(--read); }
.reportlist li { border-top: 2px solid #1f1c18; }
.matrix select:has(option[value="allow"]:checked) { color: var(--brass-hi); background-color: #2a1c0e; }
.matrix select:has(option[value="never"]:checked) { color: var(--rust); background-color: var(--rust-bg); }
.diff { font: .8125rem/1.65 var(--mono); background: #0c0b09; border: 0; box-shadow: inset 0 0 0 2px #000, inset 2px 2px 0 2px var(--well-lo), inset -2px -2px 0 2px var(--well-hi); }
.notelist li { border-top: 2px solid #1f1c18; }
.notelist p { font: .875rem/1.55 var(--read); }
.subhead { font: 400 16px/1.3 var(--pixel); letter-spacing: .06em; }
.picture-preview { border: 0; border-radius: 0; box-shadow: 0 0 0 2px #000, 0 0 0 4px var(--brass-lo); }
details > summary { font: .8125rem/1.5 var(--read); }

/* ------------------------------------------------------------------ narrow screens */

@media (max-width: 920px) {
  .frow, .trow { padding-left: 1rem; }
  .frow::before, .trow::before { display: none; }
  .postbit { margin: 6px 6px 0; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .9rem; align-items: center; text-align: left; justify-items: start; }
}
@media (max-width: 560px) {
  /* The note under a section's name goes to a line of its own, and the name may wrap, so the bar
     is never wider than the screen. */
  .catbar { flex-wrap: wrap; row-gap: .1rem; padding-block: .35rem; }
  .catbar h2 { flex: 0 1 auto; min-width: 0; overflow-wrap: anywhere; }
  .catbar-note { flex: 1 1 100%; order: 3; }
}
@media (prefers-contrast: more) {
  .cat, .tlist, .notices, .forumhead, .threadhead, .post, .quickreply { box-shadow: inset 0 0 0 2px #000, inset 0 0 0 6px var(--brass); }
}