@charset "UTF-8";
/* Role signature for moderators */
/* Posting form */
/* Post */
/* Static pages */
/* Brackets around Reply and other elements */
/* Parantheses around Auto and other elements (color is inherited from the
   label — no $parentheses_color since 2026-08-21, see _global.scss) */
/* Upload cell */
@media only screen and (max-width: 479px) {
  .unhideButton,
  .embedButton,
  .checkedFavouriteButton:before,
  .extraMenuButton,
  .hideButton {
    float: left;
  }
  body {
    margin: 5px;
  }
}
@media (max-width: 767px) {
  /* Mobile nav fix (2026-08-17): the old rule forced the board list to width:100% at
     12pt, which pushed the settings/logs/catalog/home options onto their own third line
     and made the big text wrap/clip. Instead use one compact font across the whole nav so
     the board list and options flow together on fewer lines with no horizontal overflow. */
  #topNav,
  #bottomNav,
  .navLinkSpan,
  #navOptionsSpan,
  #navOptionsSpanCatalog,
  #navOptionsSpanThread,
  #navOptionsSpanHome {
    font-size: 0.85rem;
  }
  /* Let the floated options span sit inline after the board list rather than being
     isolated on its own line by a full-width left bar. */
  #navOptionsSpan,
  #navOptionsSpanCatalog,
  #navOptionsSpanThread,
  #navOptionsSpanHome {
    float: none;
    display: inline-block;
  }
  /* The desktop bottom nav is a fixed 18px strip — that clips wrapped mobile content. */
  #bottomNav {
    height: auto;
  }
  .notFoundImg {
    height: 225px;
  }
}
@media (min-width: 768px) {
  #topNav {
    position: absolute;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  }
  .notFoundImg {
    height: 450px;
  }
}
.topBoards a,
.innerPost,
.markedPost,
.floatingMenu {
  background: #AAAACC;
}

#quick-reply table,
.modalDecorationPanel {
  background: #eeeeee;
}

.floatingMenu .header, .floatingMenu .headerLabel {
  cursor: pointer;
}

.markedPost,
div.postCell:target .innerPost {
  outline: 2px dashed #444488;
}

.logoImg {
  min-width: 1px;
}

#logoBox {
  text-align: center;
}

.captchaImage {
  width: 300px;
  height: 100px;
  background-color: #313370;
  cursor: pointer;
  color: white;
}

.small {
  font-size: 75%;
  text-decoration: none;
}

.clearer {
  clear: both;
}

#panelReferences a {
  display: block;
}

.imgLink img,
.latestImageCell img,
.mediaCell img,
.catalogCell img {
  image-orientation: from-image;
}

.linkList a {
  display: table;
}

#themeSelector {
  font-size: 100%;
}

.unhideButton,
.embedButton,
.checkedFavouriteButton:before,
.extraMenuButton,
.hideButton {
  cursor: pointer;
  white-space: nowrap;
}

a,
.reportdeletebuttons {
  color: #222299;
  text-decoration: underline;
  cursor: pointer;
  white-space: nowrap;
}

u {
  text-decoration: underline;
}

s {
  text-decoration: line-through;
}

strong {
  font-weight: bold;
}

em {
  font-style: italic;
}

.fileBrowser {
  background: none;
}

/* import resources here; external CSS, fonts, etc */
@font-face {
  font-family: "Icons";
  src: url("../open-iconic.eot");
  src: url("../open-iconic.eot?#iconic-sm") format("embedded-opentype"), url("../open-iconic.woff") format("woff"), url("../open-iconic.ttf") format("truetype"), url("../open-iconic.otf") format("opentype"), url("../open-iconic.svg#iconic-sm") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* body styles, inherited by whole page */
body {
  background: #eeeeee;
  font-family: sans-serif;
  font-size: 10pt;
  overflow-x: hidden;
}

/* header and nav / top of page styles */
header {
  text-align: center;
  margin-top: 40px;
}

.errorDiv {
  text-align: center;
}

nav {
  clear: both;
  overflow-wrap: break-word;
}

#topNav {
  top: 0px;
  left: 0px;
  right: 0px;
  margin-top: 0;
  z-index: 30;
  padding-bottom: 1px;
  padding-top: 1px;
  padding-left: 5px;
  padding-right: 5px;
  text-align: center; /* legacy parity (vinumbra nav): center the board list in the space left of the right-floated options */
}

@media (min-width: 768px) {
  #topNav .navLinkSpan {
    display: inline-block; /* legacy parity: nav span { display:inline-block } — one atomic unit so text-align centers it as a whole (desktop only: the mobile width:100% rule would otherwise let an oversized box overlap the right-floated options) */
  }
}
#bottomNav {
  margin-top: 2.5em;
  /* 2026-08-20: the fixed height:18px is gone — the merged bottom bar (thread
     pages: links + refresh cluster + staff) is taller than an 18px strip and
     was clipping the checkboxes. Content now sizes the box. */
  text-align: center; /* parity with #topNav: center the board list (mobile media query below re-asserts left for the flex layout) */
}

#navLinkSpan,
#navLinkSpan2 {
  float: left;
}

#navOptionsSpan,
#navOptionsSpanCatalog,
#navOptionsSpanThread,
#navOptionsSpanHome {
  float: right;
  padding-top: 2px;
}

/* board list */
.divPages {
  border-style: outset;
  border-width: 1px;
  padding: 3px;
}

#divPages {
  display: inline-block;
  border-style: inset;
  border-width: 1px;
}

span#divPages a {
  padding: 0 0.25em;
  display: inline-block;
}

span#divPages span {
  padding: 0 0.25em;
  display: inline-block;
}

/* markdown */
.greenText {
  color: #007777;
}

.orangeText {
  color: #E04000;
}

.quote {
  color: #007777;
}

.redText {
  color: #AF0A0F;
  font-weight: bold;
  font-size: 125%;
}

span.spoiler {
  background: #000;
  color: #000;
}

.spoiler:hover {
  color: #FFF;
}

/* CSS for pages that deal with site and account settings and bans */
#settingsWrapper {
  margin: 2em auto;
}

#settingsWrapper input {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
}

.banners {
  margin: 1em;
  width: auto;
  padding: 0.5em;
}

.settingsFieldset textarea {
  display: block;
  height: 5em;
}

.settingsFieldset label {
  display: block;
}

.settingsFieldset label input {
  display: inline-block;
}

#settingsWrapper .captchaDiv input {
  display: inline-block;
}

.subCaptchaDiv {
  text-align: left;
}

.captchaTimer {
  background: #eeeeee;
  border: 1px solid #000;
}

#labelCaptchaId {
  color: #ff0000;
}

#staticPageWrapper {
  margin: 2em auto;
  text-align: center;
}

.innerPost, .markedPost {
  display: inline-block;
  padding-right: 0.25em;
  margin-left: 2.15em;
  max-width: 100%;
  vertical-align: top;
  position: relative;
}

.innerOP {
  position: relative;
}

.threadPages {
  float: left;
}

.reportdelete {
  display: none;
}

/* 2026-08-20: the [Report / Delete] label is MOVED into #bottomNav on thread
   pages (thread.js) — the hidden checkbox + <br> it left behind were rendering
   ~2 empty lines between the posts and the strip. Hide the leftovers; the
   :checked sibling selector and captchaUtils's JS binding don't care about
   display, so the toggle + panel keep working. */
#postModerationFields > input,
#postModerationFields > br {
  display: none;
}

.reportdeletebuttons {
  float: right;
}

input#togglereport:checked ~ .reportdelete {
  display: block;
}

/* this has to go down here to override anything above it */
.hidden {
  display: none;
}

.hiddenForce {
  display: none !important;
}

.hiddenVisibility {
  visibility: hidden;
}

#settingsWrapper input.hidden {
  display: none;
}

#divRemember input {
  display: inline;
}

h2 a:link {
  color: #aeaeff;
}

h2 a:visited {
  color: #ffaeae;
}

h2 {
  margin: 0px;
  color: #ffffff;
  background: #313370;
  font-weight: bold;
}

h2, #footer {
  padding-left: 2px;
  font-family: Verdana, Tahoma, Arial, sans-serif;
  font-size: 100%;
}

h3 {
  color: #ffffff;
  text-align: center;
  background: #313370;
}

.innerPost .hideButton,
.mainPanel ~ .hideButton,
.markedPost .hideButton {
  display: none;
}

.kCard .kHeading,
#indexWrapper h2,
#subpageWrapper h2,
#redirect h2 {
  padding: 0px 10px;
  -moz-border-radius-topleft: 10px;
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius-topright: 10px;
  -webkit-border-top-right-radius: 10px;
}

.kCard .kBody,
#indexWrapper #indexLeft > div,
#indexWrapper #indexRight > div,
#subpageWrapper > div,
#redirect > div {
  margin-bottom: 15px;
  padding: 5px 10px;
  background-color: #dddddd;
  border-left: solid 1px #313370;
  border-right: solid 1px #313370;
  border-bottom: solid 1px #313370;
  -moz-border-radius-bottomleft: 10px;
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-radius-bottomright: 10px;
  -webkit-border-bottom-right-radius: 10px;
}

.brackets::after,
.brackets::before {
  text-decoration: none;
  display: inline-block;
  color: #000000;
}

.brackets::after {
  content: "]";
}

.brackets::before {
  content: "[";
}

/* 2026-08-21 (re-applied from a90715db after the desktop layout landed): both
   brackets INHERIT their color from the label (the active theme's text color).
   Legacy shipped `color: #000` here, but the selector list had a typo — element
   selector `parentheses::after` matched nothing — so only ::before got it: '('
   rendered black while ')' inherited the theme color (cream on gitgud), the
   mismatched-bracket oddity. Dropping the hardcoded #000 lets both follow any
   theme with zero per-theme rules. */
.parentheses::after,
.parentheses::before {
  text-decoration: none;
  display: inline-block;
}

.parentheses::after {
  content: ")";
}

.parentheses::before {
  content: "(";
}

#links {
  padding: 0.5em;
  text-align: center;
  margin-bottom: 2em;
}

.scrollY {
  overflow-y: scroll;
}

#siteName {
  font-size: 250%;
  font-weight: bold;
}

#subpageWrapper {
  max-width: 700px;
  margin: 2em auto;
}

#redirect {
  max-width: 300px;
  margin: 2em auto;
}

div.titlebar {
  background: #313370;
  color: #ffffff;
  font-weight: bold;
  font-size: 15px;
  text-align: center;
  padding: 5px;
}

.appealForm table tr th,
table.modInfo tr th {
  background: #313370;
  color: #ffffff;
}

.appealForm table tr th,
table.modInfo tr th {
  text-align: left;
  padding: 4px;
}

/* Random-banner feature OFF (2026-08-16): the site runs a 1x1 transparent
   global banner as an invisible placeholder and shows the legacy ad block
   instead. Re-enable by restoring width/height/border here. */
#bannerImage {
  display: none;
}

/* Legacy ad block (was an inline <style> on each page in 2.9), centered.
   The red notice stays display:none until /.static/js/ads.js reveals it —
   and only when an ad-blocker is detected (or never, if the operator marker
   element 'f0rr34lm4nc0me0n' exists). */
.adBlock {
  text-align: center;
  margin-bottom: 20px;
  /* Never let the fixed-width ad push the page wider than the viewport. */
  max-width: 100%;
  overflow-x: hidden;
}

.vinumbraAds {
  display: block;
  margin-left: auto;
  margin-right: auto;
  /* The iframe carries an inline width:320px; cap it to the container so on
     narrow screens it scales down instead of overflowing + clipping on the right.
     max-width beats the inline width without needing !important. */
  max-width: 100%;
}

/* Ad-block notice (2026-08-17): lives in #topNav, which is always on screen.
   Full-width row inside the bar (block context on desktop, flex item on mobile);
   revealed by ads.js only when an ad-blocker is detected. */
#justall0wth3d4mn4d {
  display: none;
  width: 100%;
  padding: 3px 10px;
  background: #D30000;
  text-align: center;
  font-weight: bold;
  color: #fff;
}

.navLinkSpan, #navOptionsSpan, #navOptionsSpanCatalog, #navOptionsSpanThread, #navOptionsSpanHome {
  color: #89A;
  font-size: 9pt;
}

nav a {
  text-decoration: none;
}

/* Consent */
#cookieBanner {
  display: none;
  font-size: 14px;
  max-width: 900px;
  margin: 0px auto;
  padding: 12px;
  background-color: #ddd;
  border-bottom: solid 1px #ccc;
}

#cookieBannerClose {
  float: right;
  font-weight: bold;
  padding: 4px;
}

#cookieBannerActions {
  text-align: center;
  padding-top: 4px;
}

span.unimportantHide {
  font-size: 10px;
}

.emote,
.reportdeletebuttons,
.expandLabel,
.collapseLabel {
  user-select: none;
}

.emote {
  user-drag: none;
  -webkit-user-drag: none;
}

span.spoiler > a {
  color: #000 !important;
}

span.spoiler:hover > a {
  color: #888 !important;
}

span.spoiler:hover > .greenText {
  color: #077 !important;
}

span.spoiler > .greenText {
  color: #000 !important;
}

span.spoiler:hover > .orangeText {
  color: #E04000 !important;
}

span.spoiler > .orangeText {
  color: #000 !important;
}

#massTextField {
  width: 400px;
  height: 100px;
}

/* Table Like log cells */
.logCell > p {
  display: table-cell;
  padding: 5px;
}

.logCell > p:nth-child(5n+1) {
  width: 12%;
  overflow-wrap: anywhere;
}

.logCell > p:nth-child(5n+2) {
  width: 12%;
  overflow-wrap: anywhere;
}

.logCell > p:nth-child(5n+5) {
  width: 60%;
  word-break: break-word;
}

.radiospan {
  color: white;
  text-decoration: none;
  display: inline-block;
  background-color: #d10000;
  padding-left: 4px;
  padding-right: 4px;
  margin-left: 5px;
  border-radius: 10px;
}

.latexShowcase code {
  font-size: 7pt;
}

.latexShowcase .MathJax {
  display: inline !important;
}

.innerPost.userHide .contentOverflow,
.innerPost.userHide label,
.innerPost.userHide .divBanMessage,
.innerPost.userHide .labelLastEdit {
  display: none;
}

.innerPost.userHide {
  background-color: transparent;
}

#faqContent li {
  line-height: 25px;
}

.arrowRight::after {
  content: "⟶";
}

#reportActions {
  position: fixed;
  display: block;
  right: 25px;
  bottom: 25px;
  background-color: #99b;
}

#reportList {
  margin-right: 300px;
}

#footer {
  font-size: 10px;
  margin: 2.5em auto 0 auto;
  text-align: center;
  width: fit-content;
  color: black;
}

.donation {
  overflow-wrap: break-word;
}

/* Pinned top bar (2026-08-17): #topNav ALWAYS carries .fixed (base.njk), so the
   nav — and the ad-block notice inside it — stay on screen while scrolling.
   Themes override the background with their own #topNav.fixed rule. */
#topNav.fixed {
  position: fixed;
  background: #eee;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
}

/* ============================================================
   Mobile nav: burger + always-visible options (2026-08-17)
   Desktop (>=768px) is untouched. On narrow screens the 14-board
   list collapses behind a big "Boards" button; settings/home/catalog/
   logs stay one tap away on the line. navBurger.js toggles .open.
   ============================================================ */
.navBurger {
  display: none; /* desktop: board list is inline, no burger needed */
}

@media only screen and (max-width: 767px) {
  /* One-line nav: burger left, options right; the board panel wraps below. */
  #topNav,
  #bottomNav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    text-align: left;
  }
  /* The burger button — icon-only (2026-08-17): compact square, small vertical
     footprint so the nav line stays short. Accessible name via aria-label in
     leftBar.njk. */
  .navBurger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
    margin-bottom: 1px; /* 2026-08-17 (round 2): explicit EQUAL top+bottom hairlines — centering with only a bottom margin just slid the button up onto the top padding instead */
    background: #2a2233;
    color: #e2d9ec;
    border: 1px solid #3e354a;
    border-radius: 6px;
    padding: 0.35rem 0.6rem;
    font-size: 1.15rem; /* the ☰ glyph itself — keep it legible */
    line-height: 1;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  /* Board list hidden until the nav is opened. */
  #topNav .navLinkSpan,
  #bottomNav .navLinkSpan {
    display: none;
  }
  /* Opened: wrap to a full-width tappable panel below the line (order 2 keeps
     it under the burger+options row, not after the options). */
  #topNav.open .navLinkSpan,
  #bottomNav.open .navLinkSpan {
    display: block;
    order: 2;
    flex-basis: 100%;
    box-sizing: border-box;
    text-align: left;
    margin-top: 0.25rem;
    /* Drop the inline-run decoration ([ ] /) so boards read as clean rows. */
  }
  #topNav.open .navLinkSpan .navDeco,
  #topNav.open .navLinkSpan .navSep,
  #bottomNav.open .navLinkSpan .navDeco,
  #bottomNav.open .navLinkSpan .navSep {
    display: none;
  }
  #topNav.open .navLinkSpan,
  #bottomNav.open .navLinkSpan {
    padding: 0.35rem 0.6rem;
    background: #17131c;
    border: 1px solid #3e354a;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
    /* No max-height / no scroll (2026-08-17): all boards must be visible at
       once — rows are compact enough that the full list fits a phone screen. */
  }
  #topNav.open .navLinkSpan a,
  #bottomNav.open .navLinkSpan a {
    display: block;
    padding: 0.4rem 0.4rem;
    font-size: 0.85rem;
    border-radius: 4px;
  }
  #topNav.open .navLinkSpan a:hover,
  #topNav.open .navLinkSpan a:focus,
  #bottomNav.open .navLinkSpan a:hover,
  #bottomNav.open .navLinkSpan a:focus {
    background: #2a2233;
  }
  /* Options stay on the line, one tap away — pushed right within the flex row
     (order 1 keeps them beside the burger, ahead of the panel). */
  #topNav #navOptionsSpan,
  #bottomNav #navOptionsSpan,
  #topNav #navOptionsSpanCatalog,
  #bottomNav #navOptionsSpanCatalog,
  #topNav #navOptionsSpanThread,
  #bottomNav #navOptionsSpanThread,
  #topNav #navOptionsSpanHome,
  #bottomNav #navOptionsSpanHome {
    float: none;
    order: 1;
    display: inline-block;
    margin-left: auto;
    white-space: nowrap;
  }
  /* Bottom bar = a useful action row, not a clone of the top. Its burger is
     redundant with the pinned top one, so hide it. (2026-08-20) The thread-page
     bar is now MERGED — nav links + refresh cluster + staff in ONE wrapping row
     (the old #divRefreshContainer in-flow row was deleted): linkBack/linkTop/
     catalog render as Open Iconic glyphs like the top nav; QR toggle / Update /
     checkboxes stay compact text because they carry state and have no unambiguous
     glyph (operator decision). */
  #bottomNav .navBurger {
    display: none;
  }
  .navMobileOnly {
    display: none;
  }
  /* 2026-08-21 (two-line bar, operator): LINE 1 = glyphs only (fixed sizes —
     no dynamic width can shift them), LINE 2 = the text controls (.divRefresh,
     flex-basis:100% + order:1 below). Previously everything wrapped in one flow
     and the 1-3 digit timer pushed the staff glyphs around (cardinal sin per
     operator) with the two mod icons wrapping to a third line. */
  #bottomNav #boardContentLinks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.15rem 0.3rem; /* line 1 is glyphs-only now — give them tap-room */
    font-size: 0.75rem;
  }
  /* Glyph row: return / top / catalog — same codepoints as the legacy icon bar. */
  #bottomNav #boardContentLinks .navMobileOnly {
    display: inline-block;
    font-size: 0; /* kill the text label; ::before glyph is the icon */
    line-height: 1;
    padding: 0.2rem 0.25rem;
    border-radius: 6px;
  }
  #bottomNav #boardContentLinks .navMobileOnly::before {
    font-family: "Icons";
    font-size: 1.5rem; /* 24px — MATCHES the status-line post-menu/watcher/hide icons (operator target) */
    line-height: 1;
  }
  /* ↻ is plain Unicode (not in the Icons font) — same glyph as the captcha
     refresh badge. Higher specificity than the generic rule above so the
     content + family both land. */
  #bottomNav #boardContentLinks #refreshButton::before {
    content: "↻";
    font-family: inherit;
  }
  /* .brackets emits '[' (::before) + ']' (::after) around the label — our glyph
     overrides ::before, so null ::after or a stray ']' leaks through (same
     pattern as the status-line opHead icons, _posting.scss). */
  #bottomNav #boardContentLinks .navMobileOnly::after {
    content: none;
  }
  #bottomNav #linkBack::before {
    content: "\e02e";
  } /* straight left arrow — operator 2026-08-20 (\e003 read as a curved return-arrow) */
  #bottomNav #linkTop::before {
    content: "\e012";
  } /* legacy top arrow */
  #bottomNav .navCatalog::before {
    content: "\e072";
  } /* legacy catalog grid (same as top nav) */
  /* Staff glyphs (operator picks 2026-08-20): key = manage, shield = moderate
     board. The threads link gets the list glyph (two verticals + horizontal
     lines) — reads as "a list of threads" and resolves the double-shield on
     board pages. */
  #bottomNav #linkManagement::before {
    content: "\e081";
  }
  #bottomNav #linkMod::before {
    content: "\e0ad";
  }
  #bottomNav #linkModeration::before {
    content: "\e0bc";
  }
  /* Stateful controls stay readable text, just compact — and now own their
     FULL-WIDTH second line (flex-basis:100% + order:1): QR ON/OFF · Jump to new
     · Auto · timer/status. The dynamic-width labels can only shift things on
     their own line; the glyph row above is fixed-size. The ( ) decoration around
     the checkboxes is dropped on mobile — pure width noise here. */
  #bottomNav #boardContentLinks .divRefresh {
    display: inline-flex;
    flex-wrap: wrap; /* fallback for very narrow phones — never overflow */
    align-items: center;
    gap: 0.25rem;
    flex-basis: 100%; /* force the line break after the glyph row */
    order: 1; /* and keep it below the glyphs regardless of DOM position */
  }
  #bottomNav #boardContentLinks .divRefresh label {
    font-size: 0.7rem;
  }
  #bottomNav #boardContentLinks .divRefresh .parentheses::before,
  #bottomNav #boardContentLinks .divRefresh .parentheses::after {
    content: none;
  }
  /* All bare spans in the bar are decoration on mobile — the bracket run ([ ])
     and every '/' separator (including staffSep). Hiding the whole class kills
     the stray '/', '[' + dangling gap the operator saw after the top arrow.
     .divRefresh is the one span that carries controls — it stays. */
  #bottomNav #boardContentLinks > span:not(.divRefresh) {
    display: none;
  }
}
/* Mobile legacy icon bar (base.njk): mobile-only — hidden at >=768px where the
   classic [board list] + [options] nav applies (its home/overboard anchors
   would otherwise duplicate those links). */
#mobileNav {
  display: none;
}

/* Desktop overboard globe (leftBar.njk, before the boards list): glyph-only —
   on desktop this + the watcher eye are the ONLY two glyph elements (operator
   2026-08-21). Mobile hides it: the icon row carries its own
   #linkOverboardTop. */
#topNav #linkOverboard {
  vertical-align: middle;
}

#topNav #linkOverboard::before {
  content: "\e007"; /* globe — same glyph as the mobile row's #linkOverboardTop */
  font-family: "Icons";
  /* NO explicit size (operator 2026-08-21): inherit the nav font exactly like
     the watcher eye (#watcherButton::before has none either) — identical
     visual weight. The <a> is empty, so no label-killer font-size:0 needed;
     with that in place an em-sized glyph would have been 0px anyway. */
}

/* Desktop globe→eye gap (operator 2026-08-21): the ' / ' divider is gone and
   bare adjacency looked like a typo — a small fixed whitespace gap instead.
   Scoped to >=768px so the mobile row's own #watcherButton margin stands. */
@media (min-width: 768px) {
  #topNav #watcherButton {
    margin-left: 0.5rem;
  }
}
/* ============================================================
   Mobile top nav — legacy icon row (operator 2026-08-19)
   Port of the PenumbraLynx top bar: ONE left-aligned row of Open Iconic
   glyphs:
     [home | boards-burger | overboard | help | watcher-eye | theme▾ | settings]
   Mechanism: #mobileNav and the per-page options spans get display:contents,
   so their children become flex items of #topNav directly, and `order`
   arranges them in the legacy sequence. The burger is the EXISTING .navBurger
   button (leftBar.njk) — navBurger.js untouched; it toggles #topNav.open,
   which reveals the .navLinkSpan board panel below the row.
   Glyphs are PenumbraLynx 2.9.x's exact codepoints (global.css): home \e078,
   burger \e09b, overboard \e007, help \e09a, eye \e065 (watcher.js already
   uses it), settings \e041 — all present in the bundled open-iconic font.
   Desktop (>=768px) is untouched: #mobileNav is hidden and the options spans
   keep their inline [ ] runs.
   ============================================================ */
@media only screen and (max-width: 767px) {
  /* Flatten the wrapper spans into the flex row. font-size:0 on the wrappers
     also zeroes the whitespace text nodes JS inserts between items (they would
     otherwise become tiny anonymous flex items). */
  #topNav #mobileNav,
  #topNav #navOptionsSpan,
  #topNav #navOptionsSpanCatalog,
  #topNav #navOptionsSpanThread,
  #topNav #navOptionsSpanHome {
    display: contents;
    font-size: 0;
  }
  /* --- legacy row order (0..6) + panel/notice last --- */
  #topNav #navLinkHome {
    order: 0;
  }
  #topNav .navBurger {
    order: 1;
  }
  #topNav #linkOverboardTop {
    order: 2;
  }
  #topNav #navPosting {
    order: 3;
  }
  #topNav #watcherButton {
    order: 4;
  }
  #topNav #navStart {
    order: 5;
  }
  #topNav #themeSelector {
    order: 5;
    margin-left: 0.15rem;
  }
  #topNav #settingsButton {
    order: 6;
  }
  /* Board panel (opened) + ad-block notice wrap below the icon row. */
  #topNav.open .navLinkSpan {
    order: 9;
  }
  #topNav #justall0wth3d4mn4d {
    order: 10;
    flex-basis: 100%;
  }
  /* --- icon styling: uniform glyphs, theme-colored like the rest of the nav --- */
  #mobileNav a,
  .navBurger,
  #settingsButton,
  #topNav .navCatalog,
  #topNav #linkLogs {
    font-size: 0; /* kill any text label (JS-injected or template) */
    line-height: 1;
    padding: 0.3rem 0.35rem;
    margin: 0;
    background: none;
    border: none;
    border-radius: 6px;
    text-decoration: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  #mobileNav a::before,
  .navBurger::before,
  #settingsButton::before,
  #topNav .navCatalog::before,
  #topNav #linkLogs::before {
    font-family: "Icons";
    font-size: 1.35rem; /* ~21px at 16px root — comfortable tap targets */
    line-height: 1;
  }
  #navLinkHome::before {
    content: "\e078";
  } /* house */
  .navBurger::before {
    content: "\e09b";
  } /* legacy boards burger (replaces the big bold ☰) */
  #linkOverboardTop::before {
    content: "\e007";
  } /* globe — replaces the 🌐 emoji */
  #navPosting::before {
    content: "\e09a";
  } /* help / posting rules */
  #settingsButton::before {
    content: "\e041";
  } /* gear */
  #topNav .navCatalog::before {
    content: "\e072";
  } /* legacy catalog grid (PenumbraLynx global.css) — operator 2026-08-19 */
  #topNav #linkLogs::before {
    content: "\e069";
  } /* logs — legacy PenumbraLynx board.css glyph; matches the secondary bar (operator 2026-08-19) */
  /* Tap feedback (glyphs inherit currentColor — themes color the nav links). */
  #mobileNav a:hover,
  .navBurger:hover,
  #settingsButton:hover,
  #topNav .navCatalog:hover,
  #topNav #linkLogs:hover {
    background: rgba(128, 128, 128, 0.18);
  }
  /* The watcher eye (JS-inserted after #linkOverboard, i.e. a direct flex item
     of #topNav) joins the row: glyph sized like its neighbors, unseen-post count
     kept small beside it. margin-left replaces the whitespace-node gap it used to
     get when it sat inside #mobileNav (2026-08-21). */
  #watcherButton {
    font-size: 0;
    padding: 0.3rem 0.25rem;
    margin-left: 0.15rem;
    border-radius: 6px;
    text-decoration: none;
  }
  #watcherButton::before {
    font-size: 1.35rem;
    line-height: 1;
  }
  #watcherButton span {
    font-size: 0.75rem;
    opacity: 0.8;
    margin-left: 0.1rem;
  }
  #topNav .navDivider {
    display: none;
  } /* themes.js's select divider */
  #watcherButton:hover {
    background: rgba(128, 128, 128, 0.18);
  }
  /* Theme dropdown: compact native select, in-row. Scoped to #topNav because
     the settings-menu Themes tab ALSO creates a select with id=themeSelector
     (duplicate id) and has its own full-width styling for it.
     Auto-fit (operator 2026-08-19): the select is the ONE flexible item in the
     icon row. min-width:0 lets it shrink below its content width and a small
     flex-basis keeps it compact by default, so the fixed-size glyphs — including
     the new logs icon — all stay on one line instead of wrapping. It only grows
     to fill spare space on wider phones (capped by max-width). */
  #topNav #themeSelector {
    font-size: 0.8rem;
    padding: 0.25rem 0.15rem;
    border-radius: 6px;
    border: 1px solid rgba(128, 128, 128, 0.4);
    min-width: 0; /* allow shrinking below the longest option's width */
    flex: 1 1 3rem; /* compact by default, absorbs row overflow so icons don't wrap */
    max-width: 6rem; /* don't balloon on wide phones */
  }
  /* #navStart is only a JS insertion anchor (themes.js drops the <select> after it).
     As an empty flex item it still cost two `gap` slots of dead width in the row —
     hide it so the icon row has that space back. display:none doesn't affect the
     getElementById/insertBefore themes.js relies on. */
  #topNav #navStart {
    display: none;
  }
  /* Hide the per-page text extras that have no place in the icon row:
     bracket decorations + the duplicate home link (navLinkHome replaces it).
     catalog/logs links on their pages stay reachable at the end of the row,
     after settings — as glyphs like their neighbors (operator 2026-08-19: the
     old plain-text pair stuck out against the legacy icon row). */
  #topNav #navOptionsSpan span,
  #topNav #navOptionsSpanCatalog span,
  #topNav #navOptionsSpanThread span,
  #topNav #navOptionsSpanHome span {
    display: none;
  }
  #topNav a[href="/index.html"]:not(#navLinkHome) {
    display: none;
  }
  /* The desktop overboard globe (leftBar.njk) would duplicate this row's own
     #linkOverboardTop — hide it on mobile. */
  #topNav #linkOverboard {
    display: none;
  }
  #topNav .navCatalog {
    order: 7;
  }
  #topNav #linkLogs {
    order: 8;
  }
}
/* ============================================================
   Secondary bar — board page link row (operator 2026-08-19)
   Port of the PenumbraLynx #secondaryBar: a small [ Index / Catalog /
   Bottom / Logs / RSS ] row between the posting form and the thread
   list. Desktop shows text labels; mobile (<=767px) swaps them for
   Open Iconic glyphs via ::before — same house mechanism as #mobileNav
   above (font-size:0 kills the label, ::before carries the glyph).
   Glyph codepoints are the legacy PenumbraLynx values (global.css +
   board.css): index \e078 (house, matches the top-bar home), catalog
   \e072 (matches #topNav .navCatalog), bottom \e00f, logs \e069, rss
   \e0b7 — all confirmed present in the bundled open-iconic font.
   NOTE: #linkLogs here is a SECOND element sharing that id with the
   top-nav one (rightBarBoard.njk); both ::before rules are scoped by
   their parent (#topNav vs #secondaryBar) so they don't collide. No JS
   selects these ids, and the catalog link intentionally avoids the
   .navCatalog class (gallery.js hooks the first .navCatalog match).
   ============================================================ */
#secondaryBar {
  margin: 0.75em 0;
  padding: 0.4em 0.6em;
  background: rgba(128, 128, 128, 0.08);
  border-radius: 4px;
}

#secondaryBar a {
  margin: 0 0.3em;
  text-decoration: none;
}

#secondaryBar a:hover {
  text-decoration: underline;
}

@media only screen and (max-width: 767px) {
  #secondaryBar {
    margin: 0.5rem 0.25rem;
    text-align: left;
  }
  /* Hide the [ ] brackets + / separators — the glyph row reads cleaner bare. */
  #secondaryBar span {
    display: none;
  }
  #secondaryBar a {
    font-size: 0; /* kill the text label (Index/Catalog/Bottom/Logs/RSS) */
    line-height: 1;
    padding: 0.3rem 0.4rem;
    margin: 0 0.15rem;
    display: inline-block;
    background: none;
    border: none;
    border-radius: 6px;
    text-decoration: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  #secondaryBar a::before {
    font-family: "Icons";
    font-size: 1.35rem; /* match the top-nav glyph size */
    line-height: 1;
  }
  #secondaryBar #linkIndex::before {
    content: "\e078";
  } /* house — board homepage (./) */
  #secondaryBar #navCatalog2::before {
    content: "\e072";
  } /* catalog grid (./catalog.html) */
  #secondaryBar #linkBottom::before {
    content: "\e00f";
  } /* down arrow (#bottomNav) */
  #secondaryBar #linkLogs::before {
    content: "\e069";
  } /* logs (/logs.js?boardUri=..) */
  #secondaryBar #linkRss::before {
    content: "\e0b7";
  } /* rss (index.rss) */
  /* Tap feedback — glyphs inherit currentColor, so themes color them. */
  #secondaryBar a:hover {
    background: rgba(128, 128, 128, 0.18);
    text-decoration: none;
  }
}
/*Used for places where posts are displayed*/
@media only screen and (max-width: 479px) {
  .divPosts .postCell .innerPost:before,
  .divPosts .postCell .markedPost:before {
    display: none;
  }
  .divPosts {
    margin-left: 0 !important;
  }
  .postCell {
    margin: 0px !important;
  }
  .innerPost, .markedPost {
    display: inline-block;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 3px;
    padding: 3px;
  }
  .divBanMessage,
  .divMessage {
    margin: 0px;
    margin-left: 10px !important;
    margin-right: 10px !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    word-break: break-word;
  }
  .divMessage,
  .contentOverflow {
    clear: both;
  }
  .hideButton {
    margin-right: 5px;
  }
  .expandLabel,
  .collapseLabel {
    width: calc(100% - 24px) !important;
    padding-left: 20px !important;
  }
  .panelUploads ~ .divMessage,
  .panelUploads ~ .contentOverflow .divMessage {
    padding-top: 10px;
  }
  .labelCreated {
    font-size: 80%;
  }
  .relativeTime {
    font-size: 80%;
  }
  .sage, .bumpLockIndicator {
    float: right;
  }
  .innerPost .panelUploads .uploadCell,
  .markedPost .panelUploads .uploadCell {
    margin: 5px !important;
  }
  .innerOP .panelUploads .uploadCell,
  #selectedDiv .selectedCell,
  #selectedDivQr .selectedCell {
    margin: 5px !important;
  }
  /* --- Multiple attachments -> uniform-square FILL grid (operator 2026-08-19). ---
     The desktop float packing (.multipleUploads .uploadCell{float:left}) looks
     arbitrary on a ~375px column: row breaks fall wherever the running width sum
     overflows, and mixed thumbnail heights leave ragged gaps. On mobile we instead
     render every attachment as a fixed 80x80 square, image stretched to fill it
     (object-fit:fill) so the WHOLE frame stays visible (warped, never cropped —
     userbase expects to see the full image in the thumb), tap -> native-res full
     size. Making the container flex also neutralizes the children's float:left
     (floats are ignored on flex items). Metadata (.uploadDetails) is hidden so
     the grid is pure images; filename/size/dims + staff U/D links stay available
     via the Post Menu / moderation form. Desktop keeps natural aspect ratios.
     80px = operator's pick from the 80/96/120 mockup (most on screen, ~4 across).
     Scoped to div.panelUploads (thread + board + all listing views, ALL
     file counts): the engine only adds the extra .multipleUploads class when
     a post has >1 file (postingContent.js:376), so single-image posts need
     the base class or they skip the grid entirely. The catalogue uses a
     different cell structure (.catalogCell) that never has .panelUploads,
     so it is naturally excluded.
     (operator 2026-08-19: "everything BUT the catalogue") */
  .panelUploads {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .panelUploads .uploadCell {
    width: 80px;
    height: 80px;
    max-width: 80px; /* overrides the --thumbfit-w natural-size cap */
    margin: 0 !important; /* beats the .innerOP/.innerPost .uploadCell{margin:5px!important} */
    overflow: hidden;
    border-radius: 5px;
  }
  .panelUploads .uploadCell .uploadDetails {
    display: none;
  } /* grid = images only */
  .panelUploads .uploadCell .imgLink {
    display: block;
    width: 80px;
    height: 80px;
  }
  .panelUploads .uploadCell img {
    float: none; /* belt-and-braces; flex already ignores float */
    width: 80px;
    height: 80px;
    max-width: 80px; /* overrides the 200px cap (higher specificity) */
    max-height: 80px;
    object-fit: fill; /* stretch to the square — full image visible, warped */
  }
  /* Expanded state: release all grid constraints so the full-size image
     can display in-page (same behavior as desktop/board expand). */
  .panelUploads .uploadCell.expandedCell {
    width: auto;
    height: auto;
    max-width: none;
    overflow: visible;
  }
  .panelUploads .uploadCell.expandedCell .imgLink {
    width: auto;
    height: auto;
  }
  .panelUploads .uploadCell.expandedCell img.imgExpanded {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 90vh;
    object-fit: contain;
  }
  /* Expanded state only: bring back the metadata — filename download link
     (saves with the poster's filename, not the media hash) + size + dims.
     The per-thumbnail metadata was only a problem in the COLLAPSED scroll
     path; on a deliberate expansion there's room. "Open file" stays hidden
     (filename link covers it). Collapsed grid stays pure images.
     (operator 2026-08-19, two rounds: keep download-filename link; then
     restore size/dims in expansion) */
  .panelUploads .uploadCell.expandedCell .uploadDetails {
    display: block;
  }
  /* release the fit-cell --thumbfit-w pin (~128px) so the name gets a fair
     width above the expanded image. Explicit width REQUIRED for the existing
     ellipsis (.originalFileName overflow:hidden/text-overflow) to engage —
     width:auto would let long names spill past the cell (inline-flex
     intrinsic sizing, lesson of 2026-08-17). 260px < any target viewport's
     content width; the FULL name still travels in the download attribute. */
  .panelUploads .uploadCell.expandedCell .nameFlex {
    width: 260px;
  }
  .panelUploads .uploadCell.expandedCell .uploadDetails .nameLink {
    display: none;
  }
  /* Bulk-select checkbox (2026-08-18, locked v6) — replaces the 2020 upstream
     "dirty fix" (visibility:hidden + magic -19px margin cancel) which disabled
     mobile bulk-delete site-wide with NO staff exception. Anon = display:none
     (no reserved slot/gap, cleaner than faking a collapse); staff (body.staffView,
     stamped by postingMenu.js from the account request) = visible so the existing
     thread-page Report/Delete bulk form works on phones. Desktop keeps its
     always-visible behavior (no rule there). */
  .deletionCheckBox {
    display: none;
  }
  body.staffView .deletionCheckBox {
    display: inline-block;
    margin-right: 0.25rem;
  }
  .extraMenuButton {
    float: right;
  }
  .imgFlag {
    padding-left: 3px;
    float: left;
    padding-top: 3px;
  }
  .linkName {
    padding-left: 3px;
  }
  /* 2026-08-20: the old `#divRefreshContainer { position:relative }` override is
     gone with the container itself (merged into #bottomNav). */
  /* Post Menu / hide menus must open ON-SCREEN. The legacy rule here used to be
     `right:100%; left:unset !important` — written in 2019 when .extraMenuButton
     floated to the RIGHT edge of the status line, so the menu opened leftward into
     the post. Since the v6 legacy-order status line (button at FAR LEFT, and
     float is inert inside the flex row anyway), that rule pushed the whole menu
     off the LEFT edge of the viewport on phones (operator 2026-08-19). The base
     rule below (.extraMenu,.hideMenu { left:100%; margin-left:5px }) now applies:
     menu opens to the RIGHT of the button, i.e. into the post — always in viewport.
     (body{overflow-x:hidden} used to hide the overflow; it did not make it usable.) */
  /* First three status-line icons (post menu / watcher eye / hide) were ~13-15px
     — too small as touch targets after the compaction pass. Bigger on mobile only,
     all three at a consistent size: 20px first (operator 2026-08-19), then +20%
     to 24px (operator 2026-08-19). Desktop keeps 15px. Post-menu + hide are
     Open Iconic font glyphs (::before) — sized via font-size, not the old img
     width/height. The legacy <img>s stay in the DOM (display:none) purely so
     postingMenu.js's click-toggle still finds them. */
  .extraMenuButton,
  .hideButton {
    font-size: 24px;
  }
  .watchButton {
    font-size: 24px;
  }
  .boardThreadList .multipleUploads ~ .contentOverflow {
    max-height: 150px !important;
  }
}
.imgExpanded {
  max-width: 100%;
  cursor: zoom-out;
}

video {
  max-width: 100%;
  max-height: 90vh;
}

.imgLink {
  float: left;
  cursor: zoom-in;
}

.reportFieldset {
  margin-top: 1em;
  padding: 0.5em;
  margin-bottom: 1em;
}

/* ID badge text outline — the single canonical guard (2026-08-17):
   the badge background is an inline per-ID hash color (#<idhash>), which can
   collide with any theme's text color (cream on neon green, white on pale,
   …). An 8-way black outline keeps the ID readable on ANY background.
   Themes override .labelId color/opacity freely but must NOT set their own
   text-shadow — inherit this one. */
.labelId {
  color: #ffffff;
  border-radius: 5px;
  text-shadow: -1px -1px black, 0 -1px black, 1px -1px black, -1px 0 black, 1px 0 black, -1px 1px black, 0 1px black, 1px 1px black;
  padding-left: 2px;
  opacity: 0.6;
  padding-right: 2px;
}

.labelId:hover {
  opacity: 1;
}

/* .idCount is a MOBILE-ONLY widget (postBurger.js appends it next to every
   .labelId on all viewports; its styling lives in the <=479px block below).
   On desktop the ID text + posting.js's hover "(N)" already carry that info —
   hide the stray inline number (2026-08-17: showed up beside the badge AND
   duplicated on hover). */
@media only screen and (min-width: 500px) {
  .spanId .idCount {
    display: none;
  }
}
.quoteTooltip {
  position: absolute;
  display: none;
  padding: 0;
  z-index: 101;
}

/* Mobile (<=600px) tap-to-preview panel (tooltips.js): one shared panel
   anchored at the top of the viewport, full width, internally scrollable.
   Replaces the hover tooltip on touch, where synthesized mouseenter/mouseout
   race each other and flash. .quoteTooltip's `display:none` is overridden —
   presence in the DOM IS the open state (toggling it would re-trigger the
   tap that opened it). */
.mobileQuotePanel {
  position: fixed;
  top: 10px;
  left: 10px;
  right: 10px;
  display: block;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
}

.quoteTooltip .innerPost {
  padding: 5px;
}

.quoteTooltip > div {
  border: 2px dashed #444488;
  margin-left: 0em;
}

.quoteTooltip .contentOverflow {
  max-height: unset !important;
}

.tooltipFix .contentOverflow {
  overflow-y: hidden;
}

#formMore {
  cursor: pointer;
}

.extraMenu, .hideMenu {
  position: absolute;
  top: -5px;
  left: 100%;
  margin-left: 5px;
  z-index: 2;
  font-weight: normal;
  white-space: nowrap;
  cursor: default;
  border: 2px solid #444488;
}

/* Dropdown flip (postingMenu.js adds .openUp when opening DOWNWARD would push
   the menu below the current viewport — a post near the bottom of the screen
   with the full mod menu, ~13 rows, was unusable there on phones). Mirrors the
   base top:-5px onto the bottom edge so the menu grows UPWARD from the button.
   Specificity: .extraMenu.openUp (0,2,0) beats the base rule's top. */
.extraMenu.openUp {
  top: auto;
  bottom: -5px;
}

/* Even flipped (or on a short viewport), a menu taller than the screen must
   stay usable: cap it and scroll INSIDE the menu instead of rows running
   off-screen. No-op while the menu fits — no scrollbar appears then. */
.extraMenu {
  max-height: calc(100vh - 20px);
  overflow-y: auto;
}

.hideMenu div, .extraMenu div {
  cursor: pointer;
  padding: 3px 6px;
}

.extraMenu a {
  text-decoration: none;
  color: #000;
}

.extraMenu div:hover {
  background: #dddddd;
}

/* Post date row at the bottom of the Post Menu (postingMenu.buildMenu appends it
   last). Shown ONLY on mobile, where the one-line status line hides .labelCreated;
   desktop keeps the date inline in the title line. Not an action: no pointer,
   no hover highlight (beats the theme .extraMenu div:hover rules on specificity). */
.extraMenu .postMenuDate {
  display: none;
}

@media only screen and (max-width: 479px) {
  .extraMenu .postMenuDate {
    display: block;
    cursor: default;
    font-size: 0.8rem;
    opacity: 0.85;
    border-top: 1px solid rgba(128, 128, 128, 0.4);
  }
  .extraMenu .postMenuDate:hover {
    background: transparent;
  }
}
.extraMenuButton, .hideButton {
  position: relative;
}

/* Post Menu + Hide thread — legacy Open Iconic glyphs (operator 2026-08-19).
   The PenumbraLynx originals were font glyphs from the 'Icons' (open-iconic)
   face, which KohlNumbra still bundles: post menu = \e02f (a plain right-facing
   arrow ▶), hide thread = \e017 (a circle with a slash through it ⊘). The 2019-era
   <img> icons (icon-report.png looked like an exclamation point — users read it as
   a warning; button-close.gif was a bare ×) are hidden but kept in the DOM so
   postingMenu.js's `event.target.className == "iconReport"` click-toggle and every
   class-based lookup still resolve. Same ::before pattern as the watcher eye. */
.extraMenuButton::before {
  content: "\e02f";
  font-family: "Icons";
}

.hideButton::before {
  content: "\e017";
  font-family: "Icons";
}

/* Hide the legacy <img> icons at EVERY size (the glyph above replaces them). Kept
   in the DOM only for postingMenu.js's click-toggle + class lookups. Without this
   global rule the desktop imgs would render ON TOP of the new glyphs = double icons. */
.extraMenuButton img.iconReport,
.hideButton img {
  display: none;
}

.divPosts {
  margin-left: -1.28em;
}

.postCell {
  margin-top: 4px;
  margin-left: 1.3em;
  margin-bottom: 4px;
  margin-right: 1.3em;
}

.linkName {
  font-weight: bold;
  color: #3333cc;
}

.linkName:hover {
  color: #aa0000;
}

.sage,
.bumpLockIndicator {
  color: #ff0000;
  font-weight: bold;
}

.noEmailName, .noEmailName:hover {
  color: #3333cc;
  text-shadow: none;
  text-decoration: none !important;
  cursor: auto;
}

.linkSelf {
  color: #000000 !important;
  text-decoration: none;
}

.linkSelf:hover {
  color: #000000 !important;
  font-weight: bold;
}

.linkQuote {
  color: #000000 !important;
  text-decoration: none;
}

.linkQuote:hover {
  color: #000000 !important;
  font-weight: bold;
}

.postCounter #mainPanel {
  counter-reset: css-post-count;
}

.postCounter #mainPanel .linkQuote::after {
  counter-increment: css-post-count;
  content: " / (#" counter(css-post-count) ")";
}

.labelSubject {
  color: #cc3333;
  font-size: large;
  font-weight: bold;
}

.labelRole {
  color: #ff0000;
  font-weight: bold;
}

.labelRole:before {
  content: "## ";
}

.labelRole:after {
  content: " ##";
}

.divMessage {
  margin: 1em 40px;
  text-align: left;
  white-space: pre-wrap;
  /* word-wrap: anywhere; Bad in Chrome!*/
}

.divBanMessage {
  color: #ff0000;
  font-weight: bold;
  margin: 0 auto 12px 40px;
  font-size: 100%;
}

.panelUploads {
  display: block;
}

.uploadCell {
  margin: 0.25em 1em 0.25em 0.5em;
  float: none;
}

/* Fit the cell to the THUMBNAIL width, not the filename length (2026-08-17).
   --thumbfit-w is set inline by thumbs.fitCellToThumb() on image/video cells;
   unset for text/audio, which keep the legacy filename-driven sizing. */
.uploadCell {
  max-width: var(--thumbfit-w, none);
}

/* The filename row is an inline-flex with its own max-width and will NOT shrink
   to a narrower cell on its own — pin it to the cell so long names ellipsize
   instead of spilling past the cell background. (Unset var => width:auto, no-op.) */
.uploadCell .nameFlex {
  width: var(--thumbfit-w, auto);
}

/* Release the cap while a full-size view (imgExpanded / expandedVideo) is open */
.uploadCell.expandedCell {
  max-width: none;
}

.uploadCell img {
  float: left;
}

/*Change the dimensions if you wish for larger thumbs*/
.uploadCell img:not(.imgExpanded) {
  max-width: 200px;
  max-height: 200px;
}

/*
.multipleUploads {
  float: left;
  width: 100%;
}
*/
.multipleUploads .uploadCell:not(.expandedCell) {
  float: left;
}

.multipleUploads ~ .contentOverflow {
  clear: both;
}

.contentOverflow .multipleUploads ~ .divMessage {
  clear: both;
}

.originalNameLink {
  vertical-align: top;
  white-space: nowrap;
}

.opCell {
  clear: left;
}

.panelBacklinks {
  word-wrap: break-word;
  margin-left: 0px;
}

.panelBacklinks a {
  margin-left: 0.5em;
  font-size: 80%;
  font-style: italic;
  display: inline-block;
}

.hideLink:before {
  content: url("/.static/images/button-close.gif");
  vertical-align: top;
  padding: 0 1px;
}

.aa {
  font-family: Mona, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
  display: block !important;
  font-size: 12pt;
  line-height: 1.1;
}

.labelLastEdit {
  font-size: 80%;
  margin-top: 0.75em;
  margin-left: 0.75em;
}

.contentOmissionIndicator {
  margin: 1em 40px;
  color: #666666;
}

.labelOmission {
  color: #666666;
  margin-top: 0.5em;
  margin-left: 0.5em;
}

/*Board header*/
.boardHeader #favouriteButton {
  font-size: 200%;
}

.boardHeader a {
  display: inline-block;
}

.unhideButton {
  margin-right: 0.5em;
  display: inline-block;
}

/*Actions form*/
#divMessage {
  text-align: center;
}

.divPosts .postCell .innerPost:before,
.divPosts .postCell .markedPost:before {
  content: ">>";
  position: absolute;
  margin-left: -25px;
}

.nameLink {
  display: none;
}

#selectedDivQr > .selectedCell {
  margin: 5px 0 !important;
}

.innerOP .panelUploads .uploadCell,
#selectedDiv .selectedCell,
#selectedDivQr .selectedCell {
  float: left;
  margin: 5px 20px 20px 5px;
  background: #dddddd;
  border: #aaaaaa 1px solid;
  text-align: left;
}

.innerPost .panelUploads .uploadCell,
.markedPost .panelUploads .uploadCell {
  float: left;
  margin: 5px 20px 20px 5px;
  background: #9999bb;
  border: #aaaaff 1px solid;
  text-align: left;
  display: inline-block;
  width: auto;
}

.sizeLabel,
.dimensionLabel,
.uploadDetails .linkHash,
.uploadDetails .linkSpoil,
.uploadDetails .linkDelete {
  font-size: 11px;
  font-style: italic;
}

.hiddenThread {
  clear: left;
  background: #ccccee;
  border: 2px solid #313370;
  padding: 3px;
}

span.post-you {
  font-size: 8pt;
}

/* Post-menu + hide glyphs (see the ::before block above) render at the status
   line's font size; 15px keeps them matching the legacy img icons on desktop.
   .unhideButton is a text link, not an icon — left untouched. */
.extraMenuButton,
.hideButton {
  font-size: 15px;
}

/* OP marker on staff list pages (open reports / latest postings / trash bin /
   text search / board management): boardTooltip.js, ipsearch.js and
   boardManagement.js stamp .opHighlight on cells whose post id == thread id.
   The legacy version set INLINE `background:#EEEEEE; border:1px solid black` —
   hardcoded light-theme colors that inline-style their way past every theme,
   so dark themes (tomorrow…) showed a glaring white block. Now it is a class +
   one neutral rule: a ~18% gray tint as background-IMAGE, which paints OVER
   whatever panel color the active theme already set (background-color), so OPs
   read as "slightly different" on ANY theme with zero per-theme work.
   !important guards against any theme ever setting background-image on
   .innerPost; it does not fight the themes' background-color rules at all. */
.innerPost.opHighlight {
  background-image: linear-gradient(rgba(128, 128, 128, 0.18), rgba(128, 128, 128, 0.18)) !important;
}

.labelBroadRange,
.labelRealBroadRange {
  max-width: 6ch;
  overflow: hidden;
  text-overflow: ellipsis;
  display: table-cell;
}

.labelNarrowRange,
.labelRealNarrowRange {
  max-width: 6ch;
  overflow: hidden;
  text-overflow: ellipsis;
  display: table-cell;
}

/* Thread view */
#mainPanel .innerPost .contentOverflow,
#mainPanel .markedPost .contentOverflow {
  max-height: 1400px;
  overflow-y: auto;
}
#mainPanel .innerPost .yOverflowHidden,
#mainPanel .markedPost .yOverflowHidden {
  overflow-y: hidden;
}

/* Board view */
.boardThreadList .yOverflowHidden {
  overflow-y: hidden !important;
}
.boardThreadList .innerPost .contentOverflow,
.boardThreadList .markedPost .contentOverflow,
.boardThreadList .innerOP .contentOverflow {
  max-height: 350px;
  overflow-y: hidden;
}

.overflowUnset {
  overflow-y: unset;
  max-height: unset;
}

.innerPost .expandLabel,
.innerPost .collapseLabel,
.markedPost .expandLabel,
.markedPost .collapseLabel {
  background: #AAAACC;
}

.innerOP .expandLabel,
.innerOP .collapseLabel {
  background: #eeeeee;
}

.expandLabel,
.collapseLabel {
  position: absolute;
  vertical-align: middle;
  height: 25px;
  line-height: 25px;
  bottom: 0;
  width: calc(100% - 44px);
  z-index: 1;
  padding-left: 40px;
}

.bottomGradient {
  position: absolute;
  bottom: 25px;
  width: 100%;
  height: 8px;
}

.innerPost .bottomGradient {
  background: linear-gradient(transparent, #AAAACC);
}

.innerOP .bottomGradient {
  background: linear-gradient(transparent, #eeeeee);
}

.innerOP .collapseLabel:not(.hidden) ~ .bottomGradient,
input[type=checkbox].expandCheckBox:checked ~ .bottomGradient {
  display: none;
}

input[type=checkbox].expandCheckBox:checked ~ .contentOverflow {
  max-height: unset !important;
}

input[type=checkbox].expandCheckBox:checked ~ .contentOverflow.yOverflowHidden {
  padding-bottom: 25px;
}

code a {
  pointer-events: none;
}

.innerOP .panelUploads:not(.multipleUploads) ~ .contentOverflow .divMessage {
  margin-left: 0px;
}

.boardThreadList .innerOP .multipleUploads ~ .contentOverflow {
  max-height: 150px;
}

#mainPanel .innerOP .panelUploads:not(.multipleUploads) ~ .contentOverflow .divMessage {
  margin-left: 30px;
}

.innerOP .panelUploads:not(.multipleUploads) ~ .contentOverflow .expandLabel,
.innerOP .panelUploads:not(.multipleUploads) ~ .contentOverflow .collapseLabel {
  padding-left: 0px;
}

.katex:hover {
  padding: 2px;
  outline: grey solid 2px;
}

.katex:hover:after {
  content: " (TeX)";
}

.originalFileName {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
}

.nameFlex {
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  max-width: 200px;
}

.originalFileExt {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  /* nameFlex is a flex container: with both children shrinkable, flexbox
     splits the overflow across filename AND extension (both ellipsize even
     when the ext clearly "fits"). Pin the ext so ALL truncation lands on
     the filename — the extension (.jpg/.webm/…) must stay readable. */
  flex-shrink: 0;
}

.originalNameLink2 {
  vertical-align: top;
  white-space: nowrap;
}

/* ============================================================
   Posting form card layout (2026-08-16)
   Scoped under .post-card (root of postingForm.njk) so the
   input/textarea/select styling cannot leak into other forms
   on the page, and so it overrides the legacy table-era rules
   in _boardContent.scss / _global.scss regardless of import order.
   ============================================================ */
.post-card {
  /* Width follows the comment box (2026-08-17): shrink-wrap to the widest row,
     so dragging the textarea's resize handle widens/narrows the WHOLE card.
     Was a fixed max-width:580px — locked, couldn't widen past it, while the
     textarea itself could still be dragged down to an absolute sliver. */
  width: fit-content;
  min-width: 320px; /* hard floor: never an absolute sliver */
  max-width: 100%; /* cap at the page container — no horizontal overflow */
  box-sizing: border-box;
  overflow-x: hidden; /* safety net: no child may spill past the card's right edge */
  margin: 1.5rem auto;
  padding: 0.75rem 1rem;
  background: #1e1a24;
  border: 1px solid #332b3d;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  font-family: inherit;
  color: #e2d9ec;
  /* --- Neutralize legacy table-era rules that assume the old markup --- */
}
.post-card #divUpload {
  height: auto;
  text-align: left;
}
.post-card { /* was: fixed 70px -> clipped spoiler row */ }
.post-card #checkboxMobileText {
  display: inline;
}
.post-card { /* was: display:none (old layout had a <th> label) */ }
.post-card .post-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}
.post-card .meta-row {
  /* NO flex-wrap (2026-08-17): Name/Subject/Sage always share one line and
     shrink to fit each other — Sage must never wrap onto a line by itself.
     Mobile fix (2026-08-17): mirror the working .upload-line pattern — the two
     text fields get min-width:0 so they can give up space, while Sage keeps its
     natural width and is NEVER clipped by the card's overflow-x:hidden. The old
     hard min-width floors (120/160px) made the row overflow on narrow screens,
     which pushed Sage past the right edge where it was eaten. */
}
.post-card .meta-row #divName {
  flex: 1;
  min-width: 0;
}
.post-card .meta-row #fieldSubject {
  flex: 2;
  min-width: 0;
}
.post-card .meta-row .toggle-badge {
  flex: 0 0 auto;
}
.post-card .meta-row { /* Sage never shrinks — Name/Subject absorb the squeeze */ }
.post-card .postingInput, .post-card textarea, .post-card select {
  background: #141118;
  border: 1px solid #3e354a;
  color: #fff;
  padding: 0.4rem 0.6rem;
  border-radius: 4px;
  font-size: 0.9rem;
  box-sizing: border-box; /* width/padding must not push the field past its row */
  max-width: 100%; /* a field can never be wider than its flex wrapper */
}
.post-card .postingInput:focus, .post-card textarea:focus {
  outline: none;
  border-color: #9d65c9;
}
.post-card .textarea-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1; /* fill the row width */
  min-width: 0;
}
.post-card .textarea-wrapper textarea {
  width: 100%;
  max-width: 100%; /* Mobile fix (2026-08-17): cap resize:both so the comment box can't be dragged past the card */
  min-width: 548px; /* resize floor (2026-08-17) = the OLD desktop width: the pre-change
 card was max-width:580px with 16px padding each side, so the comment
 box could never be narrower than ~548px. Now it's a FLOOR — expansion
 is unbounded (up to the page), contraction stops at the old layout.
 This also keeps the fit-content card from going below its old width,
 so the other rows are never left floating in empty space. */
  max-height: 60vh; /* resize ceiling (2026-08-17): can't eat the whole viewport */
  min-height: 90px;
  resize: both; /* user can drag width AND height — drives the card width above */
  box-sizing: border-box;
}
.post-card .char-count {
  position: absolute;
  bottom: 6px;
  right: 8px;
  font-size: 0.75rem;
  opacity: 0.6;
}
.post-card {
  /* Upload / spoiler / Post - one compact line.
     NO flex-wrap (2026-08-17): the three always share one line and shrink to
     fit — the Post button must never jump right or get clipped by the card. */
}
.post-card .upload-line {
  align-items: center;
  gap: 0.75rem;
  /* Uniform control heights (2026-08-19): dropzone / spoiler / Post were each
     sized by their own padding+border+font mix and came out ~36 / ~26 / ~35px —
     visibly uneven. Pin all three to one height; box-sizing keeps the
     dropzone's 2px dashed border inside it. Scoped to .upload-line so the
     other .toggle-badge uses (Sage, advanced-drawer toggles) keep their
     natural sizes. Mobile overrides to 42px below (same convention as the
     quick-reply attach/reply row). */
}
.post-card .upload-line .dropzone,
.post-card .upload-line .toggle-badge,
.post-card .upload-line .btn-submit {
  height: 38px;
  box-sizing: border-box;
}
.post-card .upload-line {
  /* Legacy _boardContent.scss gives .dropzone margin-bottom:0.4em (stacked-
     layout spacing). In this flex row with align-items:center the browser
     centers each item's MARGIN box, so that bottom margin shifted the whole
     dropzone ~3-4px above its siblings (and its text read off-center against
     the row). Zero it here only — QR/flags dropzones keep their own spacing. */
  /* Text centering (2026-08-19): block-level inline text flows from the TOP
     of the content area — with little/no vertical padding the label sat at
     the top and all slack fell below it (operator: "clearly aligned at the
     top"). Flex-centering makes the centering explicit and independent of
     whatever padding/line-height wins; same mechanism as the sibling
     .toggle-badge, so all three controls share one visual language. */
}
.post-card .upload-line .dropzone {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.post-card .upload-main {
  flex: 1;
  min-width: 0; /* Mobile fix (2026-08-17): shrink to fit so the Post button is never truncated */
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.post-card .dropzone {
  border: 2px dashed #433852;
  border-radius: 6px;
  padding: 0.45rem;
  text-align: center;
  font-size: 0.85rem;
  color: #a89bb8;
  cursor: pointer;
}
.post-card {
  /* Mobile (2026-08-17): the short "Attach files" label is hidden at all sizes
     here and shown only in the <=479px block below; desktop keeps .dzFull. */
}
.post-card .dzMobile {
  display: none;
}
.post-card .fileBrowser {
  max-width: 100%;
  font-size: 0.8rem;
}
.post-card {
  /* Attached files (2026-08-19): #selectedDiv moved OUT of .upload-main to a
     full-width row BELOW the whole [dropzone | spoiler | Post] line — chips
     wrap beneath BOTH the dropzone and the button (same treatment as the
     quick-reply panel). ID in the selector beats _boardContent.scss's
     `#selectedDiv .selectedCell { margin: 5px 0 }` so the row gap alone
     spaces the chips. */
}
.post-card #selectedDiv.selected-files {
  flex-wrap: wrap;
}
.post-card #selectedDiv.selected-files .selectedCell {
  float: none;
  margin: 0;
}
.post-card {
  /* Checkbox badges */
}
.post-card .toggle-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: #2a2233;
  padding: 0.3rem 0.6rem;
  border-radius: 4px;
  font-size: 0.85rem;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.post-card {
  /* Advanced drawer */
}
.post-card .advanced-drawer {
  background: #17131c;
  border-radius: 4px;
  padding: 0.4rem 0.5rem;
}
.post-card .drawer-toggle {
  font-size: 0.8rem;
  cursor: pointer;
  color: #9d65c9;
}
.post-card .drawer-content {
  margin-top: 0.6rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.post-card {
  /* Captcha - image + stacked answer / no-cookies */
}
.post-card .captcha-line {
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap; /* Mobile fix (2026-08-17): stack instead of spilling both sides when narrow */
}
.post-card {
  /* Wrapper (2026-08-19b): anchors the ↻ badge. Browsers do not paint
     ::before/::after on replaced elements (<img>), so the badge lives on this
     span, not on .captchaImage — same wrap pattern as captchaModal's
     .captchaImageContainer. display:inline-block + line-height:0 keeps it
     exactly the size of the image with no inline-gap slack. */
}
.post-card .captchaImageWrap {
  position: relative;
  display: inline-block;
  line-height: 0;
}
.post-card .captchaImage {
  max-width: 100%; /* Mobile fix: shrink to fit the card on narrow screens */
  height: auto;
  max-height: 56px;
  border-radius: 4px;
  background: #fff;
}
.post-card {
  /* Refresh affordance (2026-08-19): a ↻ badge in the image's top-right corner.
     Clicking anywhere on the image reloads it (captchaUtils.initReloadCaptcha);
     pointer-events:none keeps taps landing on the <img> itself. Replaces the
     '← refresh' text hint, which pointed at nothing once mobile stacked the row.
     Sits ON the tappable element — no words needed, works at every width.
     (Scoped to .post-card: other captcha screens would need their own copy.)
     (2026-08-19b: moved from .captchaImage::after to this wrapper — see above.) */
}
.post-card .captchaImageWrap::after {
  content: "↻";
  position: absolute;
  top: 3px;
  right: 3px;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  font-size: 0.9rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.post-card .captcha-answer-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
}
.post-card .captcha-answer-col input {
  width: 130px;
  max-width: 100%; /* Mobile fix: never overflow the card */
}
.post-card {
  /* timer + no-cookies share one line; the timer sits in a fixed-width slot
     so digit changes never shift neighboring items */
}
.post-card .captcha-meta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.post-card .captchaTimer {
  /* 2026-08-19: was min-width:10ch (sized for the transient 'Reloading' word),
     which the operator called "way too large". The timer only ever shows a
     ≤3-digit second count — or the ↻ glyph during the ~1s reload flash
     (single character, no reflow) — so 4ch covers every state. */
  min-width: 4ch;
  text-align: right;
  white-space: nowrap;
  font-size: 0.75rem;
  opacity: 0.6;
  font-variant-numeric: tabular-nums;
}
.post-card .no-cookie-link {
  font-size: 0.75rem;
  color: #9d65c9;
  text-align: center;
}
.post-card {
  /* Read-the-rules line - static, centered, clickable */
}
.post-card .rules-line {
  text-align: center;
  font-size: 0.8rem;
  color: #c9bfd8;
}
.post-card .rules-line a {
  color: #9d65c9;
}
.post-card {
  /* Post button + hover rules panel */
}
.post-card .post-action {
  position: relative;
  display: inline-block;
  margin-left: auto;
}
.post-card {
  /* Mobile-only "file limits" link (2026-08-21): hidden at base; shown in the
     <=479px block where it replaces the hover panel (touch can't use it). */
}
.post-card .rules-link-mobile {
  display: none;
}
.post-card .btn-submit {
  background: #7b3ba6;
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 0.5rem 1.4rem;
  font-weight: bold;
  cursor: pointer;
  height: fit-content;
  flex: 0 0 auto; /* Mobile fix (2026-08-17): keep natural width so it's never clipped by the row */
  white-space: nowrap;
}
.post-card .btn-submit:hover {
  background: #9146c2;
}
.post-card .post-rules-panel {
  display: none;
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 50;
  width: 300px;
  background: #17131c;
  border: 1px solid #3e354a;
  border-radius: 6px;
  padding: 0.6rem 0.75rem;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
  font-size: 0.78rem;
  color: #c9bfd8;
  text-align: left;
}
.post-card .post-rules-panel ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.post-card .post-rules-panel ul li {
  padding: 0.15rem 0;
}
.post-card .post-rules-panel a {
  color: #9d65c9;
  text-decoration: none;
}
.post-card .post-rules-panel a:hover {
  text-decoration: underline;
}
.post-card .post-action:hover .post-rules-panel,
.post-card .post-action:focus-within .post-rules-panel {
  display: block;
}

/* ============================================================
   Posting form card — mobile scaling (2026-08-17)
   Light shrink of type/padding + tighter meta-row min-widths so
   Name/Subject/Sage and the upload/spoiler/Post line all fit a
   vertical phone without clipping. Scoped to the same selectors
   as the base rules above (wins by source order, no !important).
   ============================================================ */
@media only screen and (max-width: 479px) {
  .post-card {
    padding: 0.6rem 0.7rem;
    gap: 0.5rem;
  }
  .post-card .postingInput, .post-card textarea, .post-card select {
    font-size: 0.85rem;
    padding: 0.35rem 0.5rem;
  }
  .post-card {
    /* Mobile (2026-08-17): drop the desktop 548px resize floor on phones — at a
       ~390px viewport the card's own content area is narrower, and min-width would
       overflow + clip. Touch has no resize handle anyway, so the textarea just
       fills width:100% as before. */
  }
  .post-card .textarea-wrapper textarea {
    min-width: 0;
  }
  .post-card .upload-line {
    gap: 0.5rem;
    /* Uniform control heights (2026-08-19): 42px on phones — matches the
       quick-reply attach/reply row convention; base is 38px. */
  }
  .post-card .upload-line .dropzone,
  .post-card .upload-line .toggle-badge,
  .post-card .upload-line .btn-submit {
    height: 42px;
  }
  .post-card {
    /* Mobile (2026-08-17): the dropzone reads just "Attach files" on phones.
       Spans swap in postingForm.njk (.dzMobile is display:none at base). */
  }
  .post-card .dzFull {
    display: none;
  }
  .post-card .dzMobile {
    display: inline;
  }
  .post-card {
    /* Mobile (2026-08-17): attached-file cells were desktop-sized — a 200x100px
       thumbnail + filename per file, which ate the whole phone screen. Compact
       each to one line: [x] filename ... [48px thumb]. The small thumb stays so
       multiple similar files remain identifiable; the name ellipsizes between.
       (Base rules are plain selectors — these win on specificity, no !important.) */
  }
  .post-card #selectedDiv .selectedCell {
    display: flex;
    align-items: center;
    gap: 0.4rem;
  }
  .post-card #selectedDiv .selectedCell .removeButton {
    font-size: 15px;
    margin-right: 0;
  }
  .post-card #selectedDiv .selectedCell .nameLabel {
    max-width: none;
    flex: 1 1 auto;
    min-width: 0;
  }
  .post-card #selectedDiv .selectedCell .dragAndDropThumb {
    max-width: 48px;
    max-height: 48px;
    width: auto;
    height: auto;
    margin-top: 0;
  }
  .post-card {
    /* Mobile fix (2026-08-17): drop the parenthetical hint so the drawer toggle
       reads just "Advanced" — one line on narrow screens instead of wrapping to two.
       (.drawer-short stays visible everywhere; only .drawer-full is hidden here.) */
  }
  .post-card .drawer-full {
    display: none;
  }
  .post-card {
    /* Mobile (2026-08-19): the captcha block came out THREE stacked lines —
       image / answer / timer+no-cookies — because .captcha-answer-col is a
       column at base (desktop design: column beside the image) and
       .captcha-line wraps when narrow. Collapse it to ONE line:
       [answer] [timer] [no cookies?] ≈ 130px + 4ch + short link, well inside a
       320px card. Desktop keeps the column layout. */
  }
  .post-card .captcha-answer-col {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
  }
  .post-card .btn-submit {
    padding: 0.45rem 1rem;
    font-size: 0.9rem;
  }
  .post-card .toggle-badge {
    padding: 0.28rem 0.5rem;
    font-size: 0.8rem;
  }
  .post-card {
    /* Mobile (2026-08-21): the hover panel is GONE on touch. The fixed
       viewport-clamped overlay it became in 2026-08-17 had a worse failure:
       tapping Post fires sticky :hover, the overlay opened OVER the button and
       the browser re-resolved the tap target to it — first tap opened the
       panel, second tap hit the panel; only rotating the phone "fixed" it.
       Replaced by .rules-link-mobile: a plain link (own line under the upload
       row) that NAVIGATES to the info page's file-types section — a navigation
       can't overlap or block posting. Both the base display:none and the
       hover/focus-within overrides are suppressed here; desktop (>=480px)
       keeps the anchored, opens-upward panel unchanged. */
  }
  .post-card .post-rules-panel {
    display: none;
  }
  .post-card .post-action:hover .post-rules-panel,
  .post-card .post-action:focus-within .post-rules-panel {
    display: none;
  }
  .post-card {
    /* Mobile (2026-08-21): the link rides at the END of the read-the-rules line
       (saves a whole row vs its own line; that line is already centered, so the
       pair reads as one unit). Color/size inherit from .rules-line + its theme
       overrides — it looks like a sibling of the "read" link. Base display:none
       must be reset or it never shows. */
  }
  .post-card .rules-line .rules-link-mobile {
    display: inline;
    margin-left: 0.6rem;
    text-decoration: none;
    /* paperclip \e0a2 (operator-identified from the glyph reference site; \e0a3 was the pencil) — 2026-08-21 */
  }
  .post-card .rules-line .rules-link-mobile::before {
    content: "\e0a2";
    font-family: "Icons";
    margin-right: 0.3rem;
  }
}
/* ============================================================
   Post status line — one-line clamp + meta/reply burger (2026-08-17)
   The post.njk / op.njk title line wraps date+ID in .postMeta and the
   reply links in .postMeta.postReplies. On desktop these wrappers are
   display:contents so their children flow inline EXACTLY as before (the
   summary is hidden) — zero visual change. On <=479px the whole title
   line becomes a single non-wrapping flex row that clamps to one line:
   Name/Subject ellipsize, date+ID collapse behind a ▸ meta burger, and
   replies collapse behind a "↩ N" count burger (postBurger.js fills
   .replyCount + data-has; 0 replies -> the whole reply widget is hidden).
   Status indicators (flag/sage/pin/lock/cyclic/archive/trash) stay in the
   line, per operator. postBurger.js toggles .open on tap (like navBurger).
   ============================================================ */
/* Desktop / tablet: transparent wrapper, inline children, no burger chrome. */
.postMeta {
  display: contents;
}

.postMetaSummary {
  display: none;
}

.postMetaBody {
  display: inline;
}

@media only screen and (max-width: 479px) {
  .postInfo,
  .opHead {
    display: flex;
    flex-wrap: nowrap; /* the whole point: NEVER wrap to a second line */
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
    /* NO overflow:hidden here — it clipped the pre-existing Post Menu (Report/Hide/
       Delete/Trash/Unlink) which opens from .extraMenuButton inside this row, and
       left only a ~21px sliver tappable. flex-wrap:nowrap + min-width:0 ellipsis on
       the clampable items below is what keeps the row to one line instead. */
    /* keep every inline child on the single row (default flex would shrink-wrap) */
  }
  .postInfo > *,
  .opHead > * {
    flex: 0 0 auto;
  }
  .postInfo,
  .opHead {
    /* the two clampable text items give up space + ellipsize. Font size matches
       the compact date (0.82rem, set below on .labelCreated) so Name/Subject take
       no more vertical/horizontal room than the rest of the line (operator 2026-08-19). */
  }
  .postInfo .linkName,
  .postInfo .labelSubject,
  .opHead .linkName,
  .opHead .labelSubject {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.82rem;
    max-width: 34vw; /* leave room for burger(s) on a ~320px screen */
  }
  .postInfo,
  .opHead {
    /* --- OP posts: absolute maximum space saving (operator 2026-08-19). OP lines
       carry the most fixed items (indicators A/L/S/C/T, hide ×, sage, bumplock,
       Reply + Last50), so on a ~320px screen Name/Subject collapse to "H.. A".
       Trim the lowest-value items, unconditionally:
         · No. + post number — an incremental counter; the date already conveys age.
           Frees ~65px and roughly doubles the Name/Subject budget. Replies keep it
           (shorter lines have room, and quoting a reply number is more useful there).
         · Reply / Last-50 links → single glyphs (↵ enter-sign / ↡ down-from-bar)
           instead of the text labels. Distinct from the backlinks burger (»).
       Desktop + replies are untouched (both rules are .opHead-scoped — see the
       flat .opHead block at the END of this media query, since these must NOT be
       nested inside .postInfo/.opHead or they'd compile to non-matching chains). */
    /* --- poster ID: color-coded dot + occurrence counter, INLINE in the line. ---
       (Replaces the old ▸ chevron — operator: "the sphere and its number should just
       replace the chevron.") .labelId keeps its inline background-color:#<idhash>
       (the color code) but is reduced to a small sphere with the text hidden;
       postBurger.js fills the adjacent .idCount with "times this ID appears in this
       thread" and it stays tappable to highlight all posts by that ID (same
       idsRelation map as desktop). */
  }
  .postInfo .spanId,
  .opHead .spanId {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    cursor: pointer;
  }
  .postInfo,
  .opHead {
    /* --- Date — VISIBLE inline (locked v6, 2026-08-18). Was display:none; now the
       default mobile state shows a compact date (postDate.js rewrites the text to
       MM/DD HH:MM, year only for older posts) dot-separated after sphere+count.
       Full precision stays one tap away in the Post Menu (.postMenuDate). --- */
  }
  .postInfo .labelCreated,
  .opHead .labelCreated {
    font-size: 0.82rem;
    opacity: 0.7;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .postInfo .labelCreated::before,
  .opHead .labelCreated::before {
    content: "·";
    margin-right: 0.3rem;
    opacity: 0.5;
  }
  .postInfo .labelId,
  .opHead .labelId {
    width: 13px;
    height: 13px;
    min-width: 13px;
    padding: 0;
    border-radius: 50%;
    font-size: 0; /* hide the ID text; keep the background color */
    line-height: 0;
    opacity: 1;
  }
  .postInfo .idCount,
  .opHead .idCount {
    font-size: 0.8rem;
    opacity: 0.75;
    min-width: 0.6em;
    text-align: center;
  }
  .postInfo,
  .opHead {
    /* --- META widget (was the ▸ date/ID burger): render INLINE as just [dot][N]. ---
       Chevron hidden, body shown inline (static — no panel chrome). Scoped with
       :not(.postReplies) so the REPLY burger below keeps its tap-to-open behavior.
       .spanId/.labelId/.idCount above are its only visible children now. */
  }
  .postInfo .postMeta:not(.postReplies),
  .opHead .postMeta:not(.postReplies) {
    display: inline-flex;
    align-items: center;
  }
  .postInfo .postMeta:not(.postReplies) .postMetaSummary,
  .opHead .postMeta:not(.postReplies) .postMetaSummary {
    display: none;
  }
  .postInfo .postMeta:not(.postReplies) .postMetaBody,
  .opHead .postMeta:not(.postReplies) .postMetaBody {
    display: inline-flex;
    align-items: center;
    position: static;
  }
  .postInfo,
  .opHead {
    /* --- REPLY burger ("↩ N"): tap-to-open panel, anchored to its own burger. ---
       MUST generate a real box: the desktop rule leaves .postMeta at display:contents,
       and position:relative on a display:contents element is IGNORED (no box = no
       containing block) — the absolute panel then escaped to .innerPost and popped up
       at the bottom of the whole post instead of under its burger. */
  }
  .postInfo .postMeta.postReplies,
  .opHead .postMeta.postReplies {
    display: inline-flex;
    align-items: center;
    position: relative;
  }
  .postInfo .postMetaSummary,
  .opHead .postMetaSummary {
    display: inline-flex;
    align-items: center;
    gap: 0.1rem;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    /* no explicit color: inherit the line's text color so it stays readable in
       every theme (each theme !important-overrides .linkQuote, not this element) */
    font-size: 0.85rem;
    line-height: 1;
    padding: 0.1rem 0.15rem;
  }
  .postInfo .postMetaChev,
  .opHead .postMetaChev {
    display: inline;
    font-size: 0.7rem;
    opacity: 0.7;
  }
  .postInfo,
  .opHead {
    /* Backlinks burger glyph → » (operator 2026-08-19): distinct from the OP Reply
       (↵) and Last50 (↡) glyphs. The ▸ chevron is real text in the njk (shared with
       desktop), so we swap it to » on mobile only via font-size:0 + ::before —
       desktop keeps ▸. Only the postReplies chevron is visible on mobile (the
       date+ID widget's chevron is display:none'd above). Sized to MATCH the other
       status-line glyphs (1.5rem = 24px) — operator 2026-08-19. */
  }
  .postInfo .postMeta.postReplies .postMetaChev,
  .opHead .postMeta.postReplies .postMetaChev {
    font-size: 0;
    line-height: 0;
  }
  .postInfo .postMeta.postReplies .postMetaChev::before,
  .opHead .postMeta.postReplies .postMetaChev::before {
    content: "»";
    font-size: 1.5rem;
    line-height: 1;
  }
  .postInfo,
  .opHead {
    /* Panel drops just below its own burger (right edge aligned so it extends
       leftward, staying in-viewport for the right-side burgers). */
  }
  .postInfo .postMeta.postReplies .postMetaBody,
  .opHead .postMeta.postReplies .postMetaBody {
    display: none;
    position: absolute;
    z-index: 60;
    top: calc(100% + 4px);
    right: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3rem;
    background: #17131c;
    border: 1px solid #3e354a;
    border-radius: 6px;
    padding: 0.5rem 0.6rem;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
    white-space: normal; /* panel may wrap — it's a popup, not the line */
    max-width: 78vw;
  }
  .postInfo .postMeta.postReplies.open .postMetaBody,
  .opHead .postMeta.postReplies.open .postMetaBody {
    display: flex;
  }
  .postInfo,
  .opHead {
    /* --- reply burger ("↩ N") — hidden entirely when there are no replies --- */
  }
  .postInfo .postReplies:not([data-has]),
  .opHead .postReplies:not([data-has]) {
    display: none;
  }
  .postInfo .replyCount,
  .opHead .replyCount {
    font-size: 0.85rem;
  }
  .postInfo,
  .opHead {
    /* the panel's reply links keep their existing look, just re-flowed vertical */
  }
  .postInfo .panelBacklinks,
  .opHead .panelBacklinks {
    margin-left: 0;
  }
  .postInfo .panelBacklinks a,
  .opHead .panelBacklinks a {
    display: inline-block;
    margin: 0 0.4em 0 0;
    font-style: italic;
  }
  /* --- OP posts (flat, NOT nested in .postInfo/.opHead — nesting would compile to
       non-matching descendant chains): absolute maximum space saving (operator
       2026-08-19). Trim the lowest-value items unconditionally so Name/Subject get
       back ~130px on a 320px screen. Replies + desktop keep No./#+text labels. */
  .opHead .linkSelf,
  .opHead .linkQuote {
    display: none;
  }
  .opHead .linkReply,
  .opHead .linkLast {
    font-size: 0; /* hide the text label; the ::before glyph is the icon */
    line-height: 0;
    padding: 0 0.15rem; /* rem = root-relative, so it survives font-size:0 */
    opacity: 0.85;
  }
  /* .brackets emits '[' (::before) + ']' (::after) around the label — our glyph
     overrides ::before, so null ::after or a stray ']' leaks through. Glyphs are
     distinct from the backlinks burger (»): Reply = ↵ enter-sign, Last50 = ↡.
     Sized to MATCH the first three status-line icons above (24px = 1.5rem at the
     default 16px root) — operator 2026-08-19. */
  .opHead .linkReply::before {
    content: "↵";
    font-size: 1.5rem;
    line-height: 1;
  }
  .opHead .linkReply::after {
    content: none;
  }
  .opHead .linkLast::before {
    content: "↡";
    font-size: 1.5rem;
    line-height: 1;
  }
  .opHead .linkLast::after {
    content: none;
  }
}
/* ============================================================
   Mobile post line — v6 additions (2026-08-18, locked design)
   Verbose date mode (opt-in body.verboseDate): the date drops to its own
   line below the identity row (flex-wrap + flex-basis:100% + order:99),
   full precision + weekday + relative hint rendered by postDate.js. No dot
   separator on its own line. Everything here is <=479px-scoped — desktop is
   unaffected (the legacy ORDER change itself lives in the templates and flows
   inline via .postMeta{display:contents}).
   ============================================================ */
@media only screen and (max-width: 479px) {
  /* --- Verbose date mode (opt-in): date on its own line below identity row --- */
  body.verboseDate .postInfo,
  body.verboseDate .opHead {
    flex-wrap: wrap;
    row-gap: 0.2rem;
  }
  body.verboseDate .labelCreated {
    flex-basis: 100%;
    order: 99; /* always last -> wraps to its own line */
    font-size: 0.74rem;
    opacity: 0.65;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  body.verboseDate .labelCreated::before {
    content: none;
  } /* no dot on its own line */
  body.verboseDate .labelCreated .weekday {
    font-weight: 600;
    margin-right: 0.35rem;
    opacity: 0.95;
  }
  body.verboseDate .labelCreated .relhint {
    margin-left: 0.35rem;
    opacity: 0.75;
  }
  body.verboseDate .labelCreated .relhint::before {
    content: "·";
    margin-right: 0.35rem;
    opacity: 0.6;
  }
  /* --- modInfo one-line wrap (staff, per-post) + tap-to-copy states ---
     Restyles the SAME <table class="modInfo"> into a wrapping chip row
     (desktop keeps the table look — this block is <=479px-scoped). Fields only
     appear when the post has that data (server-extracted fragments / client
     .remove()), so an empty table collapses to nothing. Labels: the themed
     `tr th` background chips are HIDDEN and re-emitted via tr::before — this
     sidesteps the gitgud/gitgudv2 `!important` th rules (which beat any
     non-!important override from this file, loaded before the themes).
     .panelRealIp is never filled; keep it invisible. Tap-to-copy: postDate.js
     adds .copied to the tapped tr for a moment. */
  table.modInfo {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem 0.6rem;
    margin-top: 0.45rem;
    font-size: 0.72rem;
    opacity: 0.85;
  }
  table.modInfo tbody {
    display: contents;
  } /* rows become the flex items */
  table.modInfo tr {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    cursor: pointer;
    white-space: nowrap;
    border-radius: 3px;
    padding: 0.05rem 0.2rem;
    -webkit-tap-highlight-color: transparent;
  }
  table.modInfo th {
    display: none;
  } /* themed label chip -> tr::before below */
  table.modInfo tr::before {
    font-weight: 600;
    opacity: 0.8;
  }
  table.modInfo tr.panelBypassId::before {
    content: "Bypass";
  }
  table.modInfo tr.panelIp::before {
    content: "IP";
  }
  table.modInfo tr.panelASN::before {
    content: "ASN";
  }
  table.modInfo td {
    padding: 0;
  }
  table.modInfo tr.panelRealIp {
    display: none;
  } /* never-filled row stays invisible */
  table.modInfo tr:hover {
    background: rgba(128, 128, 128, 0.15);
  }
  table.modInfo tr.copied {
    opacity: 1;
  }
  table.modInfo tr.copied::after {
    content: " ✓";
    opacity: 0.9;
  }
}
/*Elements that show on threads on both catalogs and regular posting places*/
.galleryImage {
  max-width: 100vw;
  max-height: 100vh;
}

.galleryImage:hover {
  border: #aaaaaa 1px solid;
}

.loading:after {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis steps(4, end) 450ms infinite;
  animation: ellipsis steps(4, end) 450ms infinite;
  content: "…";
  width: 0px;
}

@keyframes ellipsis {
  to {
    width: 1.25em;
  }
}
@-webkit-keyframes ellipsis {
  to {
    width: 1.25em;
  }
}
.playerBox {
  padding-left: 1em;
  position: absolute;
}

.volControl {
  width: 80px;
}

.volControlNav {
  width: 50px;
  height: 10px;
}

.playerButton {
  margin-left: 5px;
}

.playButton {
  float: initial !important;
  opacity: 0.5;
}

.playButton.playing {
  float: initial !important;
  opacity: 1;
}

.playerBoxNav {
  display: inline-block;
  vertical-align: middle;
}

.audioFilenameFieldNav {
  overflow: hidden;
  position: absolute;
  text-overflow: ellipsis;
  width: 100px;
}

.audioFilenameField {
  display: inline-block;
  width: 20rem;
  overflow: hidden;
  text-overflow: ellipses;
}

#topNav.active {
  position: fixed;
  background: #eee;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) !important;
}

.dot {
  margin-left: 3px;
  margin-right: 6px;
  height: 0.9em;
  width: 0.9em;
  background-color: orange;
  border-radius: 50%;
  display: inline-block;
}

#userCountLabel {
  display: none;
}

/*
.pulse {
  animation: pulse 2s infinite;
}

.pulse:hover {
  animation: none;
}

@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
    box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 0.7em rgba(204,169,44, 0);
      box-shadow: 0 0 0 0.7em rgba(204,169,44, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
      box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}
*/
/*Elements used exclusively on board pages*/
#pages,
#linkPrevious, #linkNext,
.divPages .navCatalog {
  display: inline-block;
  border-style: inset;
  border-width: 1px;
}

.threadHidden {
  margin-bottom: 10px;
}

.opCell.deleted {
  opacity: 0.3;
}

/* #linkModeration used to be blanket-hidden here (upstream 44701503, Jan 2020 —
   it hid the superadmin-only /boardModeration.js link from EVERYONE, including
   the superadmins who could use it). Removed 2026-08-21: postingMenu.js now
   gates all three bottom-bar staff links (linkManagement/linkMod/
   linkModeration) on the account's actual access — that is the hide layer. */
.opCell.deleted .floatingMenu {
  display: none;
}

/* .boardThreadList .opCell .panelUploads:not(.multipleUploads) {
  max-width: 80%;
} */
/*Elements shown on board and thread pages*/
@media only screen and (max-width: 479px) {
  #fieldName,
  #fieldMessage,
  #dragAndDropDiv {
    width: 100%;
  }
  #fieldSubject {
    width: 50%;
  }
  /* Legacy table-era rule REMOVED (2026-08-17): `#formButton { width:45%; float:right }`
     crushed the Post button in the flex card — its id specificity beat
     .post-card .btn-submit, squeezing the label to ~2px at <=479px. The button
     now lives only inside .post-card and sizes itself via .btn-submit rules. */
  #divOekaki {
    display: none;
  }
  #postingForm {
    margin-bottom: 2em;
  }
  /* 2026-08-17: removed the thick colored `border-left: 5px outset` accent here —
     it looked tacky on almost every theme. The card keeps its uniform thin
     .post-card border (1px, same as the right side) instead. */
  #postingTable th {
    display: none;
  }
  #rules_row ul {
    padding: 10px;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0;
  }
  #checkboxMobileText {
    display: unset !important;
  }
  #checkboxSage {
    vertical-align: middle;
  }
  #fieldName::placeholder,
  #fieldSubject::placeholder,
  #fieldName::placeholder,
  #fieldMessage::placeholder,
  #fieldPostingPassword::placeholder {
    color: unset !important;
  }
  #postModerationFields {
    display: none;
  }
  /* The [Report / Delete] label is MOVED by thread.js (desktop strip: into
     #bottomNav; mobile two-line bar: into the .divRefresh text line) — keep it
     hidden at this size exactly as before, when the whole #postModerationFields
     div was hidden. */
  #bottomNav .reportdeletebuttons,
  #boardContentLinks .reportdeletebuttons {
    display: none;
  }
  /* 2026-08-20: the old `#bottomNav { margin-top: 4.8em }` +
     `#divRefreshContainer .divRefresh` rules are gone — they compensated for the
     in-flow refresh row that has been merged into #bottomNav itself. */
}
#divOekaki {
  background-color: white;
}

#checkboxMobileText {
  display: none;
}

#fieldName::placeholder,
#fieldSubject::placeholder,
#fieldName::placeholder,
#fieldMessage::placeholder,
#fieldPostingPassword::placeholder {
  color: transparent;
}

.selectedCell,
.dropzone {
  padding: 3px;
  overflow-x: hidden;
  white-space: nowrap;
}

.dropzone {
  cursor: pointer;
  color: rgba(0, 0, 0, 0.5);
  transition: all 0.2s ease 0s;
  padding: 10px 0px;
  border: 2px dashed rgba(125, 125, 125, 0.4);
  background-color: rgba(200, 200, 200, 0.5);
  margin-bottom: 0.4em;
  text-align: center;
}

.dropzone:hover {
  color: rgb(0, 0, 0);
  border: 2px dashed rgba(125, 125, 125, 0.8);
}

.dragAndDropThumb {
  color: #000;
  cursor: default;
  text-align: center;
  max-height: 100px;
  transition: 0.2s;
  background-color: rgba(200, 200, 200, 0.5);
  overflow-y: auto;
  margin-top: 5px;
  max-width: 200px;
  cursor: pointer;
}

.dragAndDropDiv {
  color: #000;
  cursor: default;
  margin: auto;
  padding: 0px 4px;
  text-align: center;
  min-height: 50px;
  max-height: 140px;
  transition: 0.2s;
  background-color: rgba(200, 200, 200, 0.5);
  overflow-y: scroll;
}

.nameLabel {
  display: inline-block;
  max-width: 225px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#selectedDiv .selectedCell {
  margin: 5px 0px 5px 0px;
  float: unset;
}

.removeButton {
  cursor: pointer;
  color: rgba(125, 125, 125, 0.5);
  display: inline-block;
  margin-right: 5px;
  font-size: 20px;
}

.removeButton:hover {
  color: #7D7D7D;
}

#panelMessage {
  margin-bottom: 1em;
}

.flagPreview {
  display: inline-block;
  max-width: 10%;
  height: 16px;
}

#divUpload, .centered {
  text-align: center;
}

#divUpload {
  height: 70px;
}

#newPostFieldset {
  display: inline-block;
  padding-right: 0.75em;
  width: 25em;
}

#postingTable {
  margin: 1em auto;
}

#postingForm {
  text-align: center;
}

#postingForm td, .modalTableBody td {
  text-align: left;
}

#postingForm th, .modalTableBody th {
  color: #ffffff;
  background: #313370;
  font-weight: bold;
  text-align: left;
}

#autoCatalogRefreshCheckBox,
.identifierCheckbox,
#orphanedCheckbox,
input[type=checkbox].postingCheckbox,
input[type=checkbox].spoilerCheckBox,
input[type=checkbox].globalSettingsField,
input[type=checkbox].closeReportsField,
input[type=checkbox].boardSettingsField,
input[type=checkbox].closureCheckbox,
input[type=checkbox].categoryCheckbox {
  vertical-align: middle;
}

.spoilerImg,
.spoilerCheckBox {
  display: none;
}

.spoilerImg {
  cursor: pointer;
}

input[type=checkbox].spoilerCheckBox:checked ~ .dragAndDropThumb {
  display: none;
}

input[type=checkbox].spoilerCheckBox:checked ~ .spoilerImg {
  display: block !important;
}

/* 2026-08-20: merged bottom bar (thread page) — one flex row holding nav links +
   refresh cluster + staff. float:right keeps the legacy desktop geometry: board
   list at the left end of the strip, this group at the right end (shrink-to-fit,
   wraps instead of clipping when narrow). The mobile MQ re-asserts layout below. */
#boardContentLinks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 0.45rem;
  float: right;
  color: #89A;
  font-size: 9pt;
}

/* 2026-08-20 (round 2, operator): UNIFIED STRIP — board list LEFT ·
   bar + Report/Delete grouped RIGHT, one line. Round 1 was a centered 3-zone
   grid, but the center zone left too little room and the 14-board list wrapped
   to two lines; operator chose right-grouping so nothing wraps. margin-left:auto
   on the bar pushes it + the RD label (next DOM sibling) to the right edge.
   The legacy 2.5em margin-top is cut down — with the leftover checkbox/br line
   gone (see _global.scss), only a small separation from the posts remains.
   Float has no effect on flex items, so the legacy float rules are inert here.
   2026-08-21 (round 3): the strip layout is back inside a >=768px MQ — with RD
   now on the mobile text line it no longer needs #bottomNav flexed at base, and
   a base margin-left:auto would right-push the bar on phones (mobile is
   left-aligned). What stays BASE: the float:none overrides — thread.js parks
   the RD label in #bottomNav at load time before first paint, so if
   .reportdeletebuttons{float:right} won anywhere it would strand the label on
   its own line; floats are inert inside flex containers anyway. */
@media (min-width: 768px) {
  #bottomNav {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1em;
  }
  #bottomNav .navLinkSpan {
    text-align: left; /* inherit from #bottomNav's legacy text-align:center would
  center-wrap an oversized board list */
    min-width: 0; /* if it ever does overflow, wrap inside itself rather than
  squeezing the bar off the page */
  }
  #boardContentLinks {
    margin-left: auto;
  }
}
/* Base (all viewports): see round-3 note above. */
#boardContentLinks,
#bottomNav .reportdeletebuttons {
  float: none;
}

.modalPanel {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 200;
  display: table;
  text-align: center;
  background: rgba(29, 31, 33, 0.66);
  right: 0;
  top: 0;
}

.modalInnerPanel {
  vertical-align: middle;
  display: table-cell;
}

.modalDecorationPanel {
  display: inline-block;
  background: #aaaacc;
  z-index: 50;
}

.modalInnerDecorationPanel,
.post-table {
  padding: 10px;
  background-color: #eeeeee;
  margin: 4px;
}

.captchaImageContainer {
  position: relative;
  background: #313370;
}

.modalCaptchaTable {
  margin-bottom: 0.5em;
  width: 100%;
}

.modalCaptchaControls {
  position: absolute;
  right: 0px;
  top: 1px;
}

.modalCaptchaControls input, .modalOkButton {
  margin-right: 10px;
}

#favouriteButton:before {
  font-family: Icons;
  content: "\e0c2";
  margin-left: 0.5em;
  cursor: pointer;
}

.postModerationFields {
  float: right;
}

.contentAction {
  text-align: right;
}

.contentAction > label > input {
  vertical-align: middle;
}

.postingInput {
  border: 1px solid #a9a9a9;
}

.boardHeader {
  margin-bottom: 17.15px;
}

/* Mobile (2026-08-17): shrink the board/catalog title drastically and hide
   the board blurb — on a phone the big h1 + description eat vertical space
   before any content. Covers board, thread AND catalog headers (all use
   .boardHeader); #labelDescription only exists on board/thread pages.
   !important: theme files import AFTER this one and pin #labelName at 28px
   (yotsubaB) with id specificity that would otherwise win. */
@media only screen and (max-width: 767px) {
  .boardHeader {
    margin-bottom: 8px;
  }
  .boardHeader h1,
  .boardHeader #labelName { /* the title text is this span — must beat theme id rules */
    font-size: 1.25rem !important;
    line-height: 1.3;
  }
  .boardHeader #labelDescription {
    display: none;
  }
}
.checkboxLabel .spoilerImg {
  max-height: 100px;
}

#previewContainer {
  background: rgba(0, 0, 0, 0.2);
  bottom: 0;
  content: " ";
  left: 0;
  line-height: 100vh;
  pointer-events: none;
  position: fixed;
  right: 0;
  text-align: center;
  top: 0;
  width: 100%;
  z-index: 102;
}

#previewContainer img,
#previewContainer video {
  margin: 0 auto;
  max-height: 100vh;
  max-width: 100%;
  vertical-align: middle;
}

.mathjaxContentLongSet,
.mathjaxContentRendered,
.mathjaxContent,
.MathJax {
  display: none;
}

#labelMessageLengthOuter {
  font-weight: normal;
  font-size: smaller;
}

#filterBoardIdentifier {
  width: 100px;
}

.reasonLabel ul {
  padding-left: 15px;
  margin-top: 0;
  margin-bottom: 0;
}

#qrsubject {
  width: calc(100% - 152px);
}

.post-table td {
  padding: 0.25em;
}

#quick-reply {
  position: fixed;
  float: right;
  padding: 0 0 0 0;
  width: 300px;
  z-index: 100;
  display: none;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}

#quick-reply #post-form-inner {
  min-width: 300px;
}

/* Mobile (2026-08-19, supersedes the 2026-08-17 fluid-width rule): top-anchored
   full-width compact panel. Pinned to the top of the viewport it stays visible
   while the keyboard is up (the keyboard eats the thread below, not the form),
   and qr.js no longer auto-focuses the comment box on open — so files can be
   attached / the post being replied to checked before typing starts.
   Desktop behavior untouched. */
@media only screen and (max-width: 479px) {
  #quick-reply {
    left: 0 !important; /* beats clampToViewport() inline styles */
    top: 0 !important;
    right: 0;
    width: 100vw;
    max-width: 100vw;
    margin: 0;
    border-radius: 0;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
    max-height: 60vh; /* safety net for captcha/flag-heavy boards */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  #quick-reply #post-form-inner {
    min-width: 0;
  }
  /* Compact comment box: nobody writes paragraphs on a phone. */
  #quick-reply #qrbody {
    min-width: 0;
    min-height: 0;
    height: 74px;
    resize: none;
  }
  /* Name + Subject + sage share one line (sage is the last item). */
  #quick-reply .qr-line {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  #quick-reply .qr-line #qrname {
    flex: none;
    width: 34%;
  }
  #quick-reply .qr-line .qr-subj {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }
  #quick-reply .qr-sagewrap {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: none;
    font-size: 11px;
    cursor: pointer;
  }
  #quick-reply .qr-sagewrap input {
    width: 15px;
    margin: 0;
  }
  /* Attach + Reply share the top line (mirrors the main form's
     [dropzone | Post] row); attached-file chips stack BELOW the dropzone —
     same column flow as .upload-main in _posting.scss, not to its right. */
  #quick-reply .qr-attachrow {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  /* Dropzone + Reply share the top line (chips flow below as their own block). */
  #quick-reply .qr-attachrow .dz-reply-line {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  #quick-reply .qr-attachrow .dropzone {
    flex: 1 1 auto;
    min-width: 0;
    margin-bottom: 0;
    height: 42px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* Chips below the dropzone, stacked — compact one-line cards exactly like
     the main form's mobile #selectedDiv chips (same markup, same look). */
  #quick-reply .qr-attachrow #selectedDivQr {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  #quick-reply .qr-attachrow #selectedDivQr .selectedCell {
    float: none;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    white-space: normal;
  }
  #quick-reply .qr-attachrow #selectedDivQr .selectedCell .removeButton {
    font-size: 15px;
    margin-right: 0;
  }
  #quick-reply .qr-attachrow #selectedDivQr .selectedCell .nameLabel {
    max-width: none;
    flex: 1 1 auto;
    min-width: 0;
  }
  #quick-reply .qr-attachrow #selectedDivQr .selectedCell .dragAndDropThumb {
    max-width: 48px;
    max-height: 48px;
    width: auto;
    height: auto;
    margin-top: 0;
  }
  #quick-reply .qr-attachrow #qrbutton {
    flex: 0 0 auto;
    width: auto;
    min-width: 60px;
    height: 42px;
    box-sizing: border-box;
  }
  /* Captcha at its real 300x100 size. The pre-existing <=479px shrink in
     _posting.scss (max-height:56px, written for the post-form card) applies to
     every .captchaImage on phones; this ID-scoped override wins by specificity
     and deliberately leaves login/bypass/account captchas untouched. */
  #quick-reply .captchaImage {
    width: 300px;
    max-width: 100%;
    height: auto;
    max-height: none;
  }
  /* Compact attach strip. */
  #quick-reply .dropzone {
    padding: 8px 0;
    font-size: 12px;
  }
}
#quick-reply .post-table tr td:nth-child(2) {
  width: 40%;
  text-align: left;
  padding-left: 0.25em;
}

#quick-reply tr td:nth-child(2) input[type=submit] {
  width: 99%;
}

#quick-reply th {
  text-align: center;
  padding: 0 0 0.25em 0;
}

#quick-reply .handle {
  position: relative;
  padding: unset;
}

.handle {
  cursor: move;
}

.handle a {
  color: white;
}

/* Close button (2026-08-19): the anchor is empty and the old theme's
   `coloredIcon` glyph class was lost in the KohlNumbra migration, so the ×
   never rendered — the panel had no visible way to dismiss it. Render the
   glyph here; ~30px tap target on phones. */
#quick-reply .close-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  text-decoration-line: none;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  padding: 3px 5px;
}

#quick-reply .close-btn::after {
  content: "×"; /* × */
}

#quick-reply input[type=text],
#quick-reply input[type=password],
#quick-reply select {
  padding: 2px;
  font-size: 10pt;
  box-sizing: border-box;
}

#quick-reply select {
  padding: 2px;
  font-size: 10pt;
  box-sizing: border-box;
  width: 85%;
}

#quick-reply textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 10pt;
  resize: both;
}

#quick-reply input[type=file] {
  padding: 5px 2px;
}

#quick-reply .nonsense {
  display: none;
}

#quick-reply td.recaptcha {
  text-align: center;
  padding: 0 0 1px 0;
}

#quick-reply td.recaptcha span {
  display: inline-block;
  width: 100%;
  background: white;
  border: 1px solid #ccc;
  cursor: pointer;
}

#quick-reply td.recaptcha-response {
  padding: 0 0 1px 0;
}

#quick-reply table {
  padding: 0;
  margin: 0;
  width: 100%;
  margin: 0;
  outline: 1px solid rgb(49, 51, 112);
  border-collapse: collapse;
}

#quick-reply .nameLabel {
  font-size: 75%;
  max-width: 75px;
}

.modalHeader {
  padding: 5px;
}

.modalHeader,
#quick-reply .handle {
  display: block;
  background: #313370;
  color: #ffffff;
  font-weight: bold;
  font-size: 15px;
  text-align: center;
}

#qrname,
#qrpassword,
#QRfieldCaptcha {
  width: 100%;
}

#quick-reply .captchaImage {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#qrsage {
  vertical-align: middle;
  width: 20px;
}

#qrbutton {
  width: 125px;
}

#qrbody {
  min-width: 300px;
  min-height: 50px;
}

#dropzoneQr {
  margin-bottom: 0.25em;
}

#qrFlagCombobox option, #flagCombobox option {
  background-repeat: no-repeat;
  background-position: right;
  background-size: auto 16px;
}

#selectedDivQr .dragAndDropThumb {
  max-width: 100px;
}

#watcherButton {
  display: inline-block;
  cursor: pointer;
  vertical-align: middle;
  font-weight: bold;
}

/* Legacy text-based watcher icon: the 'Icons' (open-iconic) eye glyph, same as
   PenumbraLynx used on the legacy board. */
#watcherButton::before {
  content: "\e065";
  font-family: "Icons";
  margin-right: 0.25em;
}

.watchButton {
  display: inline-block;
  cursor: pointer;
  margin-left: 0.25em;
  vertical-align: middle;
}

.watchButton::before {
  content: "\e065";
  font-family: "Icons";
}

/* Click feedback: a light glow on the nav counter that fades out, triggered by
   .watchGlow (added from watcher.js when a thread is watched). */
@keyframes watcherGlow {
  0% {
    text-shadow: 0 0 6px #fff, 0 0 14px #8fd3ff;
  }
  100% {
    text-shadow: 0 0 0 transparent;
  }
}
#watcherButton.watchGlow {
  animation: watcherGlow 1s ease-out;
}

/* ---- Watched-threads popup menu ---- */
/* Surface contract (2026-08-19): #watchedMenu ALSO carries class
   .floatingMenu and RIDES ON IT for background — every theme in use defines
   `.floatingMenu { background: … }` (and the no-theme fallback gets the base
   _global.scss #AAAACC). Text color inherits the theme's body rule. The old
   hardcoded light palette here (background/color/border) beat every theme's
   class rule on ID specificity, so dark themes got a foreign light box —
   only gitgud's !important rule accidentally overrode it. Layout/typography/
   shadow/radius stay local; per-theme link colors live in each theme file
   (same pattern as .quoteTooltip border-color / .extraMenu a). */
#watchedMenu {
  position: fixed;
  z-index: 1000;
  min-width: 230px;
  max-width: 340px;
  margin: 0;
  padding: 8px 10px 6px;
  box-sizing: border-box;
  border-radius: 10px;
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.28);
  font-size: 14px;
  line-height: 1.35;
  text-align: left;
  /* title bar — centered */
}
#watchedMenu .watchedMenuTitle {
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 15px;
  padding: 2px 0 7px;
  cursor: move;
  user-select: none;
}
#watchedMenu {
  /* top-right close button */
}
#watchedMenu #closeWatcherMenuButton {
  position: absolute;
  top: 6px;
  right: 8px;
  width: 20px;
  height: 20px;
  line-height: 18px;
  text-align: center;
  font-weight: bold;
  cursor: pointer;
  border-radius: 50%;
  /* no color here — inherits the menu's themed text color (visible in
     every theme by construction); hover below gives the red affordance */
}
#watchedMenu #closeWatcherMenuButton:hover {
  background: rgba(0, 0, 0, 0.12);
  color: #a00;
}
#watchedMenu {
  /* separator under the title */
}
#watchedMenu > hr {
  margin: 0 0 6px;
  border: none;
  border-top: 1px solid #d3d7e6;
}
#watchedMenu {
  /* Thread list — capped at 7 visible rows, then scrolls (operator
     2026-08-19): keeps the popup a consistent size no matter how many
     threads are watched. Row height from the fixed values in this file:
     .watchedCell = max(14px * 1.35 text line, 20px close X) + 8px padding
     = 28px, plus its 9px separator hr = 37px per row. 7 rows = 259px;
     an 8th (296px) triggers the scrollbar. Title bar + close X stay
     pinned above the scroll region. Applies at every viewport size. */
}
#watchedMenu #watchedList {
  max-height: 259px;
  overflow-y: auto;
}
#watchedMenu {
  /* per-thread row: label left, close X right-aligned */
}
#watchedMenu .watchedCell {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 4px 2px;
  box-sizing: border-box;
}
#watchedMenu .watchedCellLabel {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  padding-right: 6px;
  cursor: pointer;
}
#watchedMenu .watchedCellLabel a {
  color: #2a3f9e;
  text-decoration: none;
}
#watchedMenu .watchedCellLabel a:hover {
  text-decoration: underline;
}
#watchedMenu {
  /* unseen-post indicator */
}
#watchedMenu .watchedNotification::before {
  font-family: "Icons";
  content: "\e0d8";
  margin-left: 0.3em;
  color: #c00;
}
#watchedMenu {
  /* per-thread close X — fixed width so they line up on the right */
}
#watchedMenu .watchedCellCloseButton {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  line-height: 18px;
  text-align: center;
  font-weight: bold;
  cursor: pointer;
  border-radius: 50%;
  color: #777;
}
#watchedMenu .watchedCellCloseButton::before {
  content: "X";
}
#watchedMenu .watchedCellCloseButton:hover {
  background: rgba(160, 0, 0, 0.14);
  color: #a00;
}
#watchedMenu {
  /* row separators (rows live inside #watchedList since the 7-row cap) */
}
#watchedMenu #watchedList > div > hr {
  margin: 4px 0;
  border: none;
  border-top: 1px solid #e2e5f0;
}

@media only screen and (max-width: 812px) {
  .mobileAlert {
    color: #A00;
  }
}
/* base64peek — clickable base64 strings in OP/reply messages (thread pages).
   Deliberately theme-neutral: inherits the theme's text color; no palette
   tokens, so it works unmodified across all themes. */
.b64peek {
  cursor: pointer;
  border-bottom: 1px dotted;
}

.b64peek:hover {
  border-bottom-style: solid;
}

/* Decoded value in place of the base64 (click again to copy). */
.b64peek.decoded {
  background: rgba(127, 127, 127, 0.18); /* visible on both light and dark themes */
  border-bottom: none;
  padding: 0 0.15em;
}

/* Decode attempt yielded binary (not text): brief shake as feedback. */
@keyframes b64shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-2px);
  }
  75% {
    transform: translateX(2px);
  }
}
.b64peek.binary {
  display: inline-block; /* transform requires a non-inline box */
  animation: b64shake 0.25s ease-in-out;
}

/* ============================================================
   Settings menu (redesigned 2026-08-17)
   The old version was a flat dump of 24 checkboxes with a
   hardcoded indigo header and thick #aac borders. Now: grouped,
   ordered sections with one-line descriptions, clean tabs, and a
   neutral dark surface (same tokens as .post-card) so it reads as
   intentional on every theme. Themes import later and can still
   override any of these selectors.
   ============================================================ */
#settingsMenu {
  position: fixed;
  left: 100px;
  top: 25px;
  z-index: 100;
  width: 340px;
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 40px);
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
#settingsMenu.closed {
  display: none;
}
#settingsMenu {
  background: #1e1a24;
  color: #e2d9ec;
  border: 1px solid #3e354a;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  font-size: 0.8rem; /* was 0.9rem — "much too large" (operator 2026-08-17) */
  line-height: 1.35;
  /* --- Header: title left, close button right --- */
}
#settingsMenu > .header {
  background: #2a2233;
  color: #e2d9ec;
  font-weight: bold;
  font-size: 0.95rem;
  text-align: left;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid #3e354a;
  border-radius: 8px 8px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
#settingsMenu > hr {
  display: none;
}
#settingsMenu {
  /* --- Tabs --- */
}
#settingsMenu .settingsTabs {
  display: flex;
  gap: 0.25rem;
  padding: 0.5rem 0.75rem 0.25rem;
  border-bottom: 1px solid #3e354a;
}
#settingsMenu .settingsTab {
  cursor: pointer;
  padding: 0.35rem 0.7rem;
  border-radius: 6px;
  color: #b9a8d4;
  -webkit-tap-highlight-color: transparent;
}
#settingsMenu .settingsTab:hover, #settingsMenu .settingsTab:focus {
  background: #2a2233;
  color: #e2d9ec;
}
#settingsMenu #selectedTab {
  font-weight: bold;
  background: #31284a;
  color: #fff;
}
#settingsMenu {
  /* --- Content panel (flex:1 + scroll so the panel never outgrows the sheet) --- */
}
#settingsMenu #menuContentPanel {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0.5rem 0.75rem 0.75rem;
}
#settingsMenu .settingsSection {
  margin-bottom: 0.9rem;
}
#settingsMenu .settingsSectionTitle {
  font-size: 0.68rem;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  position: relative;
  padding-right: 1.4em;
  font-weight: bold;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8f7bb0;
  margin: 0 0 0.3rem;
  padding-bottom: 0.2rem;
  border-bottom: 1px solid #2c2436;
}
#settingsMenu {
  /* Section collapse (all sections start collapsed — settingsMenu.js; title toggles on any device) */
}
#settingsMenu .settingsSection.collapsed .settingRow {
  display: none;
}
#settingsMenu .settingsSectionTitle::after {
  content: "▾"; /* ▾ */
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.9em;
  transition: transform 0.15s ease;
}
#settingsMenu .settingsSection.collapsed .settingsSectionTitle::after {
  transform: translateY(-50%) rotate(-90deg); /* ▸ = collapsed */
}
#settingsMenu .settingRow {
  padding: 0.28rem 0;
}
#settingsMenu .settingRow label {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  cursor: pointer;
}
#settingsMenu .settingRow .settingsCheckbox {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin: 0;
  align-self: center;
  accent-color: #9d65c9;
}
#settingsMenu .settingRow .settingName {
  color: #e2d9ec;
}
#settingsMenu .settingRow .settingDesc {
  margin: 0.1rem 0 0 1.6rem; /* align under the label text, past the checkbox */
  font-size: 0.74rem;
  color: #9b8cb5;
}
#settingsMenu .saveButton {
  margin: 0.25rem 0 0;
  width: 100%;
  padding: 0.45rem;
  background: #9d65c9;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: bold;
  cursor: pointer;
}
#settingsMenu .saveButton:hover {
  background: #b183d9;
}
#settingsMenu {
  /* --- Filters tab --- */
}
#settingsMenu #newFilterPanel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.6rem;
}
#settingsMenu #newFilterPanel select, #settingsMenu #newFilterPanel input[type=text] {
  background: #141118;
  color: #fff;
  border: 1px solid #3e354a;
  border-radius: 4px;
  padding: 0.3rem 0.5rem;
  font-size: 0.8rem;
}
#settingsMenu #newFilterPanel input[type=text] {
  flex: 1;
  min-width: 120px;
}
#settingsMenu #newFilterPanel .settingsCheckbox {
  margin: 0;
}
#settingsMenu #newFilterPanel button {
  background: #2a2233;
  color: #e2d9ec;
  border: 1px solid #3e354a;
  border-radius: 6px;
  padding: 0.35rem 0.7rem;
  cursor: pointer;
}
#settingsMenu #newFilterPanel button:hover {
  background: #31284a;
}
#settingsMenu .existingFilterTypeLabel,
#settingsMenu .existingFilterContentLabel {
  display: inline-block;
  vertical-align: middle;
}
#settingsMenu .existingFilterTypeLabel {
  width: 25%;
  color: #8f7bb0;
}
#settingsMenu .existingFilterContentLabel {
  width: 65%;
  word-break: break-all;
}
#settingsMenu .filterDeleteButton {
  cursor: pointer;
  color: #b9a8d4;
  font-weight: bold;
  padding: 0 0.25rem;
}
#settingsMenu .filterDeleteButton:hover {
  color: #ff8f8f;
}
#settingsMenu {
  /* --- Themes tab --- */
}
#settingsMenu #themeSelector {
  width: 100%;
  box-sizing: border-box;
  background: #141118;
  color: #fff;
  border: 1px solid #3e354a;
  border-radius: 4px;
  padding: 0.35rem 0.5rem;
  font-size: 0.85rem;
}
#settingsMenu {
  /* --- CSS tab --- */
}
#settingsMenu #cssInput {
  width: 100%;
  box-sizing: border-box;
  height: 12em;
  background: #141118;
  color: #fff;
  border: 1px solid #3e354a;
  border-radius: 4px;
  padding: 0.4rem 0.5rem;
  font-family: monospace;
  font-size: 0.75rem;
}

/* Close button (was float:right — header is flex now) */
#closeSettingsMenuButton {
  cursor: pointer;
  font-weight: bolder;
  padding: 0 0.35rem;
  color: #b9a8d4;
}
#closeSettingsMenuButton:hover {
  color: #fff;
}

#closeSettingsMenuButton::before,
.filterDeleteButton::before,
#closeSideCatalogButton::before {
  content: "X";
  font-weight: bolder;
}

/* Filter list scroll area */
#existingFiltersPanel {
  overflow-y: auto;
  max-height: 20em;
}

/* --- Mobile: full-screen sheet (2026-08-17) --- */
@media only screen and (max-width: 479px) {
  #settingsMenu {
    left: 0 !important;
    top: 0 !important;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    border-radius: 0;
    border: none;
    font-size: 0.78rem; /* one step smaller than desktop — small screens, more settings */
  }
  #settingsMenu .header {
    border-radius: 0;
  }
  #settingsMenu {
    /* Tighter rhythm so the sheet holds more without scrolling as far */
  }
  #settingsMenu .settingsSection {
    margin-bottom: 0.7rem;
  }
  #settingsMenu .settingRow {
    padding: 0.24rem 0;
  }
  #settingsMenu .saveButton {
    padding: 0.55rem;
  }
  #settingsMenu { /* bigger tap target, smaller text (base 0.85rem) */ }
}
/*Elements exclusive from the thread page*/
/* 2026-08-20: #divRefreshContainer is GONE from the template — its links and
   refresh cluster moved to the merged bottom bar (#boardContentLinks), and its
   old position:absolute/float:left rule (which overlapped the mod controls at
   phone widths) with it. */
.labelId {
  cursor: pointer;
}

.divRefresh label,
.divRefresh input {
  display: inline-block;
  margin: 0;
}

#divControls,
#transferControls,
#ipDelete,
#divArchive,
#formTransfer,
#ipDeletionForm,
#divControls,
#divMod,
#divMerge {
  margin: 1em;
}

#divMod {
  margin-top: 4em;
}

.unimportant, .unimportant * {
  font-size: 10px;
  color: white !important;
}

.innerPost.deleted {
  opacity: 0.65;
  vertical-align: bottom;
}

#mainPanel .hideButton,
.innerPost.deleted .floatingMenu {
  display: none;
}

/*Elements exclusive to the front-page*/
#infoBox {
  text-align: center;
  width: 100%;
  padding: 0.5em;
  margin: 1em auto 2em;
  font-size: 120%;
}

#divStats div {
  display: block;
}

#topBoards {
  display: none;
}

/* Latest-posts panel beneath the stats.
   2026-08-18: restored to the legacy (2.9 index.css) bubble grid — inline-block
   cells, multiple per row, no fixed-height scroll box (the KohlNumbra rewrite
   had made them full-width block rows in a 500px scroller).
   2026-08-19: operator: rows wrapped at 4 with a "clearly could fit another"
   gap, and cell sizes varied with text length — messy. Replaced the
   content-sized inline-blocks (shrink-to-fit width + margins = row math that
   barely doesn't add up) with an exact grid of uniform PORTRAIT cells
   (taller than wide): grid tracks do the wrapping math, so no phantom gaps,
   and every cell is the same size regardless of post text (link ellipsized,
   preview clamped to 5 lines). Same treatment as the unified attachment grid.
   Theme files supply per-theme cell backgrounds for this selector; #aac
   fallback. The panel itself stays a plain card under `#subpageWrapper > div`
   (no extra width/margin — see 2026-08-18 alignment note).

   2026-08-19 v2 (mobile pass): fixed heights made giant slabs on narrow
   viewports → aspect-ratio-driven sizing instead.
   2026-08-19 v3: (a) stubbier ratio (4:5 → 6:7, "slightly portrait");
   (b) mobile wanted NARROWER tracks — 3-5 per row — not fewer fatter ones
   (auto-fill minmax(120px,1fr) gave 2 fat cells on phones): at ≤767px the
   track caps at 114px so a 390px phone fits 3-up (3×114 + 2×10 gap = 362 ≤
   ~364 card content), wider phones/tablets get 4-5. min() keeps the floor
   under 100% for tiny viewports. (c) Asymmetry bug: with an `1fr` max, the
   last partial track stretched to fill the card, dumping all leftover space
   on one side — now tracks are capped and `justify-content: center` splits
   the remainder evenly, so every row is symmetric left-right at any viewport.
   */
#divLatestPosts {
  display: grid;
  /* Desktop: same ~40%-narrower treatment as mobile (operator 2026-08-19):
     137 → 82px cap → 7-up in the ~678px card. */
  grid-template-columns: repeat(auto-fill, minmax(min(70px, 100%), 82px));
  justify-content: center;
  gap: 10px;
  /* Mobile: narrow tracks → many per row. Most posts are short, so wide
     cells were mostly empty space (operator 2026-08-19): 70px cap gives
     4-up on a 390px phone, 3-up at 320px; link ellipsizes, preview clamps. */
}
@media only screen and (max-width: 767px) {
  #divLatestPosts {
    grid-template-columns: repeat(auto-fill, minmax(min(58px, 100%), 70px));
  }
}
#divLatestPosts .latestPostCell {
  position: relative;
  overflow: hidden;
  padding: 6px 8px;
  aspect-ratio: 6/7; /* slightly portrait (taller than wide) */
  max-height: 172px; /* keeps very wide tracks from going slab-tall */
  font-size: 75%;
  background: #aac;
  border-radius: 8px; /* rounded cells at every width (operator 2026-08-21) */
}
#divLatestPosts .latestPostCell a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#divLatestPosts .labelPreview {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
#divLatestPosts .imgFlag {
  position: absolute;
  top: 5px;
  right: 5px;
}

@keyframes fade-in {
  from {
    opacity: 0;
    height: 0%;
  }
  to {
    opacity: 1;
    height: 100%;
  }
}
#divLatestImages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  min-height: 320px;
}

#divLatestImages .latestImageCell {
  display: inline-block;
  vertical-align: middle;
}

/* Latest Images is OFF on this site (operator 2026-08-19): hide the heading +
   box for all users, but KEEP the markup in index.njk — the engine's
   defaultPages.json prebuilt field requires divLatestImages to exist. The
   layout rules above stay intact so re-enabling is just deleting this rule. */
#latestImagesHeading,
#divLatestImages {
  display: none;
}

#divLatestImages img {
  max-width: 125px;
  max-height: 125px;
  margin: 5px;
  border: 1px solid #000000;
}

#news {
  background: #dddddd;
  border: 1px solid #98E;
}

#news h2 {
  font-size: 12pt;
}

#news h2, #news p {
  padding: 3px 7px;
}

#indexLeft {
  float: left;
  width: 43.5%;
  left: 10%;
  position: relative;
}

#indexRight {
  float: right;
  width: 35.5%;
  position: relative;
  left: -10%;
}

#indexWrapper {
  max-width: 1200px;
  margin: 2em auto;
}

#linkEngine {
  display: none;
}

.linkFollow {
  color: green;
}

.linkFollowAlt {
  color: red;
}

#divStats div {
  display: list-item;
  margin-left: 0.75em;
}

#logoImage {
  /* Mobile fix (2026-08-17): the legacy fixed `height:232px` rendered a 424px-wide
     logo in a 390px viewport (cut off on the right). Cap height at the legacy size
     but let width shrink to fit, preserving aspect ratio. */
  max-width: 100%;
  height: auto;
  max-height: 232px;
}

/* Legacy mobile adaptation (2.9 index.css, appended at the bottom) — ported 2026-08-17.
   Selector mapping:
   - .topBoards had no live counterpart in the new front page (board list is hidden) → dropped
   - #indexWrapper was the old front-page container → its role here is #subpageWrapper
   - #linkEngine is already display:none at all sizes (rule above) → dropped */
@media only screen and (max-width: 812px) {
  #divLatestPosts {
    margin: 0;
  }
  #subpageWrapper {
    width: 99%;
  }
}
/* Mobile front page (2026-08-17): compact everything — smaller site title,
   logo, boards/rules/privacy link list, stats pane and section headings so
   the home page reads as one screen instead of a shout.
   (!important on #siteName: theme files import later and pin it at 28px with
   id specificity — yotsubaB — that would otherwise win.) */
@media only screen and (max-width: 767px) {
  #siteName {
    font-size: 140% !important;
  }
  #logoImage {
    max-height: 120px;
  }
  #links {
    padding: 0.35em;
    margin-bottom: 1em;
    font-size: 85%;
  }
  #divStats {
    font-size: 90%;
  }
  #divStats div {
    display: inline-block; /* flow as wrapping lines, not a 6-row list */
    margin-left: 0;
    margin-right: 1.25em;
  }
  #subpageWrapper h2,
  #news h2 {
    font-size: 1.1rem;
  }
}
/*Used only on catalog*/
@media only screen and (max-width: 479px) {
  .catalogCell {
    width: 90px !important;
    max-height: 230px !important;
    margin-left: 5px !important;
    margin-right: 5px !important;
    margin-bottom: 5px !important;
  }
  .linkThumb img {
    max-width: 100% !important;
    max-height: 100% !important;
    top: 0px;
  }
  .threadStats {
    display: none;
  }
  .thumbGridBottom {
    display: none !important;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .catalogCell {
    width: 120px !important;
    max-height: 300px !important;
    margin-left: 5px !important;
    margin-right: 5px !important;
    margin-bottom: 5px !important;
  }
  .linkThumb img {
    max-width: 100% !important;
    max-height: 100% !important;
  }
  .thumbGridBottom {
    display: none !important;
  }
}
.catalogCell {
  width: 210px;
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  position: relative;
  padding: 5px;
  height: 350px;
  margin-left: 25px;
  margin-right: 25px;
  margin-bottom: 25px;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 4px;
  border: 1px solid transparent;
}

.catalogCell:hover, .catalogCell:focus {
  overflow: visible;
  z-index: 1;
}

.catalogCell:hover .divMessage, .catalogCell:focus .divMessage {
  background: #AAAACC;
  outline: #aac solid 6px;
}

.catalogCell:hover, .catalogCell:focus {
  visibility: visible;
}

.catalogCell:hover {
  background: #AAAACC;
}

.catalogCell .divMessage {
  margin: 0;
  word-wrap: break-word;
  overflow: hidden;
}

#divTools {
  text-align: left;
  margin-left: 15px;
}

.catalogHeader .imgFlag {
  float: left;
}

.catalogHeader {
  line-height: 1em;
}

.catalogCell .labelSubject {
  padding: 0;
  margin: 0 0 0.5em;
  font-size: 1em;
  color: #CC3333;
  display: block;
  text-decoration: none;
  white-space: normal;
}

.linkThumb img {
  max-height: 200px;
  max-width: 200px;
}

.catalogDiv {
  text-align: center;
}

.threadStats {
  color: #888888;
  margin-bottom: 0.5em;
}

.catalogCell:hover .threadStats {
  color: #666666;
}

.thumbGridBottom {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

/*Elements used exclusively on the board listing*/
#boardsWrapper {
  width: 80%;
  margin: 1em auto;
  text-align: center;
}

.boardsCell span {
  text-overflow: ellipsis;
}

.search {
  margin: 0 11px 0.5em 11px;
}

.search form {
  display: inline-block;
}

#boardsSort, #searchButton {
  margin-top: 1em;
}

#legend {
  width: 15%;
  text-align: left;
  display: inline-block;
}

.boardsCellHeader {
  width: 85%;
  display: inline-table;
}

.boardsCellStats {
  width: 15%;
  display: inline-table;
}

#divBoards {
  display: table;
  border-spacing: 6px;
}

#divBoardsLegend {
  display: table-row;
  font-weight: bold;
}

.boardsCell {
  display: table-row;
}

.cellComponent {
  display: table-cell;
  padding-left: 5px;
  padding-right: 5px;
}

.boardsCellTags {
  white-space: nowrap;
  display: none;
}

.boardsPagination {
  margin-top: 1em;
}

#labelUsers {
  display: none;
}

.labelUniqueIps {
  display: none;
}

.reasonDiv {
  margin-top: 0.5em;
}

.selectionDiv {
  margin-bottom: 0.5em;
}

.mCard {
  border: solid 1px #313370;
  margin-bottom: 1em;
}

.mFixed {
  position: fixed;
  bottom: 1em;
  right: 2em;
  background: white;
  margin-left: 2em;
}

.mCard > h2 {
  font-size: 125%;
  padding: 5px 10px;
  background: #313370;
  color: white;
  display: inline-block;
}

.mCard > div {
  padding: 15px;
}

.mLinks a {
  display: table;
}

.mCard hr {
  margin: 0.75em 0;
}

#pagesDiv {
  word-break: break-all;
}

#pagesDiv a {
  margin-right: 0.5em;
}

#boardMessageField {
  display: block;
  width: 50em;
  height: 2em;
}

.reportCell .deletionCheckBox {
  display: none;
}

.reportCell:last-child hr {
  display: none;
}

.mCard #linkPrevious,
.mCard #linkNext {
  border-style: unset !important;
}

.mCard .innerPost {
  margin-left: 0;
}

.labelTable > div label {
  display: table;
}

/* ============================================================
   Open Reports — mobile (≤479px)  (operator 2026-08-19)
   Desktop model: #reportActions is a fixed bottom-right corner panel and
   #reportList reserves 300px of right margin for it. On a phone that squeezes
   the report list to a sliver on the LEFT (the "squished" symptom) while long
   IP strings in each post's info table blow PAST the container's right edge.
   Fix: actions become a normal full-width block stacked in flow, the list takes
   full width, and long IPs/ranges are forced to wrap inside their cell instead
   of widening the table past the box. The v6 one-line status model (Name/Subject
   ellipsize) is left untouched — this only fixes the IP/table overflow.
   ============================================================ */
@media only screen and (max-width: 479px) {
  /* Actions panel: in-flow block, not a fixed corner overlay that covers content. */
  #reportActions {
    position: static;
    right: auto;
    bottom: auto;
    width: auto;
  }
  /* Report list: drop the desktop 300px right reservation → full width.
     (No overflow-x:hidden here — it would clip the Post Menu that opens from
     inside a report post, the same reason _posting.scss avoids it on .postInfo.) */
  #reportList {
    margin-right: 0;
    max-width: 100%;
  }
  /* The per-post info table (IP / ranges / category / reason) must stay inside
     its post box instead of widening past it. Cap the width; the cell word-break
     below makes content breakable so an auto-layout table honours that cap. */
  #reportDiv table.modInfo {
    max-width: 100%;
  }
  /* Long IPs / ranges are the actual overflow source: let them break inside
     their cell. white-space:normal overrides the status line's inherited nowrap
     (which would otherwise prevent any wrap); word-break handles unbroken strings.
     Scoped to these cells so the v6 Name/Subject ellipsis is unaffected. */
  #reportDiv .panelIp,
  #reportDiv .labelIp,
  #reportDiv .panelRange,
  #reportDiv .labelBroadRange,
  #reportDiv .labelNarrowRange,
  #reportDiv table.modInfo td {
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
  }
  /* Filter + actions form controls: usable at phone width (desktop sizes them
     for a narrow fixed corner box; in-flow they can take the full line). */
  #filterForm input,
  #filterForm select,
  #reportActions select,
  #reportActions input[type=text] {
    max-width: 100%;
  }
}
.sfw .uploadCell img:hover:not(.imgExpanded),
.sfw .catalogCell .linkThumb img:hover,
.sfw #bannerImage:hover {
  opacity: 1 !important;
  filter: blur(5px);
}
.sfw .uploadCell img:not(.imgExpanded),
.sfw .catalogCell .linkThumb img,
.sfw #bannerImage {
  opacity: 0;
}

.flipped {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}

#workerCount {
  width: 42px;
}

progress {
  width: 100%;
  height: 30px;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  border: solid #cccccc 5px;
  border-radius: 5px;
}

progress,
progress::-webkit-progress-bar {
  background: white !important;
}

progress,
progress::-webkit-progress-value,
progress::-moz-progress-bar {
  background: green;
}

progress::-webkit-progress-value {
  -webkit-transition: width 0.5s ease;
  -moz-transition: width 0.5s ease;
  -o-transition: width 0.5s ease;
  transition: width 0.5s ease;
}

progress,
progress::-webkit-progress-bar {
  background: #cccccc !important;
}

#percentageDiv {
  text-align: center;
}

#solved {
  color: green;
}

#fieldHash, #fieldDifficulty, #fieldSolved {
  display: none;
}

#startButton {
  margin-left: 5px;
}

.base64area {
  width: 100%;
  height: 2rem;
}

#labelBypass {
  display: none;
}

/* Base16 Atelier Lakeside Light - Theme */
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/lakeside) */
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
/* Atelier-Lakeside Comment */
.hljs-comment,
.hljs-quote {
  color: #5a7b8c;
}

/* Atelier-Lakeside Red */
.hljs-variable,
.hljs-template-variable,
.hljs-attribute,
.hljs-tag,
.hljs-name,
.hljs-regexp,
.hljs-link,
.hljs-name,
.hljs-selector-id,
.hljs-selector-class {
  color: #d22d72;
}

/* Atelier-Lakeside Orange */
.hljs-number,
.hljs-meta,
.hljs-built_in,
.hljs-builtin-name,
.hljs-literal,
.hljs-type,
.hljs-params {
  color: #935c25;
}

/* Atelier-Lakeside Green */
.hljs-string,
.hljs-symbol,
.hljs-bullet {
  color: #568c3b;
}

/* Atelier-Lakeside Blue */
.hljs-title,
.hljs-section {
  color: #257fad;
}

/* Atelier-Lakeside Purple */
.hljs-keyword,
.hljs-selector-tag {
  color: #6b6bb8;
}

.hljs {
  display: block;
  clear: both;
  overflow-x: auto;
  background: #ebf8ff;
  color: #516d7b;
  padding: 0.5em;
}

.hljs-emphasis {
  font-style: italic;
}

.hljs-strong {
  font-weight: bold;
}

.catalogHeader .medals {
  float: left;
}

.medals .text {
  position: absolute;
  visibility: hidden;
  text-align: center;
  background-color: #313370;
  border-radius: 5px;
  padding: 5px 15px;
  z-index: 1;
  margin-left: 5px;
  color: #ffffff;
  opacity: 0;
}

.medals:hover .text {
  visibility: visible;
  transition: all 0.25s ease-in-out;
  opacity: 1;
}

/* Theme wrappers match the class on <html> (set pre-paint by the inline head
   script in base.njk, so the canvas background is themed from frame one) AND
   on <body> (server-rendered default / themeLoader.js). color-scheme aligns
   the UA canvas + scrollbars + form controls with the theme's mode.

   Each theme file is a Sass module exposing one namespaced mixin (the new
   @use/@mixin standard, replacing the old nested-@import pattern). */
html.theme_tomorrow, .theme_tomorrow {
  color-scheme: dark;
  background: #1d1f21 none;
  color: #C5C8C6;
  font-family: arial, helvetica, sans-serif;
  /* ==========================================================================
     Tomorrow (Tomorrow Night Eighties) - Complete Theme (standardization pass
     2026-08-17). Palette carried over from the original; every colorable
     element in theme-inventory.md is now defined explicitly. The original's
     layout/font tweaks are preserved verbatim in the LAYOUT DELTA section at
     the bottom (non-color identity of this theme).
     ========================================================================== */
  /* Core palette */
  /* page background (frozen — CSP-hashed) */
  /* nav / panels / post cells / form th */
  /* marked posts / menu items */
}
html.theme_tomorrow, .theme_tomorrow {
  background: #1d1f21 none !important;
  color: #C5C8C6 !important;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- A. Canvas & page structure --- */
}
html.theme_tomorrow body, .theme_tomorrow body {
  background: #1d1f21 !important;
  color: #C5C8C6;
}
html.theme_tomorrow #footer, .theme_tomorrow #footer {
  color: #707070;
}
html.theme_tomorrow #news, .theme_tomorrow #news {
  background: #282a2e;
  color: #C5C8C6;
  border-color: #111111;
}
html.theme_tomorrow .hiddenThread, .theme_tomorrow .hiddenThread {
  background-color: #1d1d21;
  border-color: #111111;
}
html.theme_tomorrow .kCard .kBody,
html.theme_tomorrow #indexWrapper #indexLeft > div,
html.theme_tomorrow #indexWrapper #indexRight > div,
html.theme_tomorrow #subpageWrapper > div,
html.theme_tomorrow #redirect > div, .theme_tomorrow .kCard .kBody,
.theme_tomorrow #indexWrapper #indexLeft > div,
.theme_tomorrow #indexWrapper #indexRight > div,
.theme_tomorrow #subpageWrapper > div,
.theme_tomorrow #redirect > div {
  background-color: #282a2e;
  border-left-color: #111111;
  border-right-color: #111111;
  border-bottom-color: #111111;
}
html.theme_tomorrow .mCard, .theme_tomorrow .mCard {
  background-color: #282a2e;
}
html.theme_tomorrow .mCard > h2, .theme_tomorrow .mCard > h2 {
  background: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow h2, html.theme_tomorrow h3, .theme_tomorrow h2, .theme_tomorrow h3 {
  color: #C5C8C6;
  background: #282a2e;
}
html.theme_tomorrow div.titlebar, .theme_tomorrow div.titlebar {
  background: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow #siteName, .theme_tomorrow #siteName {
  color: #81a2be;
}
html.theme_tomorrow, .theme_tomorrow {
  /* main site title — theme's signature accent (was falling back to base body text) */
}
html.theme_tomorrow #cookieBanner, .theme_tomorrow #cookieBanner {
  background-color: #282a2e;
  border-bottom-color: #111111;
  color: #C5C8C6;
}
html.theme_tomorrow .unimportant, html.theme_tomorrow .unimportant *, .theme_tomorrow .unimportant, .theme_tomorrow .unimportant * {
  color: #707070 !important;
}
html.theme_tomorrow progress, .theme_tomorrow progress {
  background: #1d1d21;
}
html.theme_tomorrow progress::-webkit-progress-value, .theme_tomorrow progress::-webkit-progress-value {
  background: #adbd68;
}
html.theme_tomorrow progress::-moz-progress-bar, .theme_tomorrow progress::-moz-progress-bar {
  background: #adbd68;
}
html.theme_tomorrow *, .theme_tomorrow * {
  scrollbar-color: #454a4d #16181a;
}
html.theme_tomorrow hr, .theme_tomorrow hr {
  background-color: #282a2e;
  border: 0;
  height: 1px;
  clear: left;
}
html.theme_tomorrow ::selection, .theme_tomorrow ::selection {
  background: #81a2be;
  color: #1d1f21;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- B. Navigation & menus --- */
}
html.theme_tomorrow #topNav, .theme_tomorrow #topNav {
  background: transparent;
}
html.theme_tomorrow #topNav.fixed, html.theme_tomorrow #topNav.active, .theme_tomorrow #topNav.fixed, .theme_tomorrow #topNav.active {
  background: #282a2e;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
html.theme_tomorrow nav, .theme_tomorrow nav {
  background: #282a2e;
  color: #C5C8C6;
  border-bottom: 1px solid #111111;
  z-index: 100;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
html.theme_tomorrow .navLinkSpan, .theme_tomorrow .navLinkSpan {
  color: #C5C8C6;
}
html.theme_tomorrow .divPages, html.theme_tomorrow #divPages, .theme_tomorrow .divPages, .theme_tomorrow #divPages {
  border-color: #111111;
}
html.theme_tomorrow .threadPages, html.theme_tomorrow .boardPages, .theme_tomorrow .threadPages, .theme_tomorrow .boardPages {
  color: #C5C8C6;
  background: none;
  border: none;
  font-size: 15px;
  margin-top: 25px;
}
html.theme_tomorrow .threadPages span, .theme_tomorrow .threadPages span {
  color: #C5C8C6;
}
html.theme_tomorrow #divPages, .theme_tomorrow #divPages {
  background: none;
}
html.theme_tomorrow .extraMenu div, .theme_tomorrow .extraMenu div {
  background-color: #1d1d21;
  color: #C5C8C6;
}
html.theme_tomorrow .extraMenu div:hover, .theme_tomorrow .extraMenu div:hover {
  color: #1d1d21;
  background-color: #C5C8C6;
}
html.theme_tomorrow .extraMenu a, .theme_tomorrow .extraMenu a {
  color: #C5C8C6;
  text-decoration: none;
}
html.theme_tomorrow .hideMenu div:hover, .theme_tomorrow .hideMenu div:hover {
  background-color: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow .extraMenu, html.theme_tomorrow .hideMenu, .theme_tomorrow .extraMenu, .theme_tomorrow .hideMenu {
  border-color: #111111;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- C. Post cells & thread view --- */
}
html.theme_tomorrow .innerPost, .theme_tomorrow .innerPost {
  background-color: #282a2e;
  border: 1px solid #282a2e;
  max-width: 95%;
}
html.theme_tomorrow .markedPost, .theme_tomorrow .markedPost {
  background-color: #1d1d21;
  border: 1px solid #111111;
}
html.theme_tomorrow .topBoards a, html.theme_tomorrow .floatingMenu, .theme_tomorrow .topBoards a, .theme_tomorrow .floatingMenu {
  background: #282a2e;
}
html.theme_tomorrow #watchedMenu .watchedCellLabel a, .theme_tomorrow #watchedMenu .watchedCellLabel a {
  color: #81a2be;
}
html.theme_tomorrow, .theme_tomorrow {
  /* watched-threads menu links */
}
html.theme_tomorrow .markedPost, html.theme_tomorrow div.postCell:target .innerPost, .theme_tomorrow .markedPost, .theme_tomorrow div.postCell:target .innerPost {
  outline-color: #81a2be;
}
html.theme_tomorrow .quoteTooltip > div, .theme_tomorrow .quoteTooltip > div {
  border-color: #81a2be;
}
html.theme_tomorrow .uploadDetails, .theme_tomorrow .uploadDetails {
  color: #707070;
}
html.theme_tomorrow .innerPost .expandLabel,
html.theme_tomorrow .innerPost .collapseLabel,
html.theme_tomorrow .markedPost .expandLabel,
html.theme_tomorrow .markedPost .collapseLabel, .theme_tomorrow .innerPost .expandLabel,
.theme_tomorrow .innerPost .collapseLabel,
.theme_tomorrow .markedPost .expandLabel,
.theme_tomorrow .markedPost .collapseLabel {
  background: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow .innerOP .expandLabel,
html.theme_tomorrow .innerOP .collapseLabel, .theme_tomorrow .innerOP .expandLabel,
.theme_tomorrow .innerOP .collapseLabel {
  background: #1d1d21;
  color: #707070;
}
html.theme_tomorrow .innerPost .bottomGradient, .theme_tomorrow .innerPost .bottomGradient {
  background: linear-gradient(transparent, #282a2e) !important;
}
html.theme_tomorrow .innerOP .bottomGradient, .theme_tomorrow .innerOP .bottomGradient {
  background: linear-gradient(transparent, #1d1d21) !important;
}
html.theme_tomorrow .innerPost .panelUploads .uploadCell,
html.theme_tomorrow .markedPost .panelUploads .uploadCell, .theme_tomorrow .innerPost .panelUploads .uploadCell,
.theme_tomorrow .markedPost .panelUploads .uploadCell {
  background: transparent !important;
  border: none !important;
}
html.theme_tomorrow .innerOP .panelUploads .uploadCell,
html.theme_tomorrow #selectedDiv .selectedCell,
html.theme_tomorrow #selectedDivQr .selectedCell, .theme_tomorrow .innerOP .panelUploads .uploadCell,
.theme_tomorrow #selectedDiv .selectedCell,
.theme_tomorrow #selectedDivQr .selectedCell {
  background: transparent !important;
  border: none !important;
}
html.theme_tomorrow, .theme_tomorrow {
  /* Badge backgrounds are inline per-poster hashes (any hue — light yellow-greens,
     pinks, tans). Light fill + solid dark outline stays readable on all of them
     (same treatment as darkreader, operator-confirmed 2026-08-17). */
}
html.theme_tomorrow .labelId, .theme_tomorrow .labelId {
  color: #fff;
  opacity: 0.85;
}
html.theme_tomorrow, .theme_tomorrow {
  /* outline inherited from base _posting.scss */
}
html.theme_tomorrow .labelCreated, html.theme_tomorrow .relativeTime, html.theme_tomorrow .spanId, .theme_tomorrow .labelCreated, .theme_tomorrow .relativeTime, .theme_tomorrow .spanId {
  color: #707070;
}
html.theme_tomorrow .linkName:link, .theme_tomorrow .linkName:link {
  font-size: 13px;
  color: #81a2be;
}
html.theme_tomorrow .linkName:link:hover, .theme_tomorrow .linkName:link:hover {
  color: #D00;
}
html.theme_tomorrow .noEmailName, html.theme_tomorrow .noEmailName:hover, .theme_tomorrow .noEmailName, .theme_tomorrow .noEmailName:hover {
  font-size: 13px;
  color: #C5C8C6;
}
html.theme_tomorrow .linkQuote, html.theme_tomorrow .linkSelf, .theme_tomorrow .linkQuote, .theme_tomorrow .linkSelf {
  color: #81a2be !important;
}
html.theme_tomorrow .linkQuote:hover, html.theme_tomorrow .linkSelf:hover, .theme_tomorrow .linkQuote:hover, .theme_tomorrow .linkSelf:hover {
  color: #5F89AC !important;
}
html.theme_tomorrow #divThreads .linkSelf, html.theme_tomorrow #divThreads .linkQuote, .theme_tomorrow #divThreads .linkSelf, .theme_tomorrow #divThreads .linkQuote {
  color: #C5C8C6;
}
html.theme_tomorrow #divThreads .linkSelf:hover, html.theme_tomorrow #divThreads .linkQuote:hover, .theme_tomorrow #divThreads .linkSelf:hover, .theme_tomorrow #divThreads .linkQuote:hover {
  color: #5F89AC;
}
html.theme_tomorrow .labelSubject, .theme_tomorrow .labelSubject {
  color: #446655;
  font-weight: bold;
  font-size: 13px;
}
html.theme_tomorrow .labelRole, .theme_tomorrow .labelRole {
  color: #F00000 !important;
  background-color: #000;
  padding: 2px 5px;
  border-radius: 10px;
  font-weight: normal;
}
html.theme_tomorrow .sage, html.theme_tomorrow .bumpLockIndicator, .theme_tomorrow .sage, .theme_tomorrow .bumpLockIndicator {
  color: #F00000;
}
html.theme_tomorrow .divBanMessage, .theme_tomorrow .divBanMessage {
  font-size: 14px;
  color: #ed1c24;
  margin: 0 10px 7px 10px;
}
html.theme_tomorrow .contentOmissionIndicator, .theme_tomorrow .contentOmissionIndicator {
  margin: 15px 0 5px 10px;
  color: #707070;
}
html.theme_tomorrow .labelOmission, .theme_tomorrow .labelOmission {
  color: #707070;
  margin-top: 1em;
}
html.theme_tomorrow .panelBacklinks a, .theme_tomorrow .panelBacklinks a {
  color: #707070;
  font-style: normal;
}
html.theme_tomorrow .panelBacklinks a:hover, .theme_tomorrow .panelBacklinks a:hover {
  color: #81a2be;
}
html.theme_tomorrow .quoteLink, .theme_tomorrow .quoteLink {
  color: #81a2be;
}
html.theme_tomorrow .quoteLink:hover, .theme_tomorrow .quoteLink:hover {
  color: #5F89AC;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- D. Chan markup & spoilers --- */
}
html.theme_tomorrow .greenText, .theme_tomorrow .greenText {
  color: #adbd68;
}
html.theme_tomorrow .red, .theme_tomorrow .red {
  color: #C5C8C6;
}
html.theme_tomorrow .redText, .theme_tomorrow .redText {
  font-size: 14px;
  color: #F20;
}
html.theme_tomorrow .orangeText, .theme_tomorrow .orangeText {
  color: #f99157;
}
html.theme_tomorrow .brackets:after, html.theme_tomorrow .brackets:before, .theme_tomorrow .brackets:after, .theme_tomorrow .brackets:before {
  color: #C5C8C6;
}
html.theme_tomorrow span.spoiler, .theme_tomorrow span.spoiler {
  background: #000;
  color: #000;
}
html.theme_tomorrow .spoiler:hover, .theme_tomorrow .spoiler:hover {
  color: #FFF;
  background-color: #000;
}
html.theme_tomorrow span.spoiler > .greenText, .theme_tomorrow span.spoiler > .greenText {
  color: #000 !important;
}
html.theme_tomorrow span.spoiler > .orangeText, .theme_tomorrow span.spoiler > .orangeText {
  color: #000 !important;
}
html.theme_tomorrow span.spoiler > a, .theme_tomorrow span.spoiler > a {
  color: #000 !important;
}
html.theme_tomorrow span.spoiler:hover > .greenText, .theme_tomorrow span.spoiler:hover > .greenText {
  color: #adbd68 !important;
}
html.theme_tomorrow span.spoiler:hover > .orangeText, .theme_tomorrow span.spoiler:hover > .orangeText {
  color: #f99157 !important;
}
html.theme_tomorrow span.spoiler:hover > a, .theme_tomorrow span.spoiler:hover > a {
  color: #81a2be !important;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- E. Posting form (legacy table + .post-card) --- */
}
html.theme_tomorrow .form-post th, .theme_tomorrow .form-post th {
  background: #282a2e;
  border: 1px solid #111111;
  color: #C5C8C6;
}
html.theme_tomorrow #postingForm th, html.theme_tomorrow .modalTableBody th, .theme_tomorrow #postingForm th, .theme_tomorrow .modalTableBody th {
  color: #C5C8C6;
  background-color: #282a2e;
}
html.theme_tomorrow input, html.theme_tomorrow button, html.theme_tomorrow textarea, .theme_tomorrow input, .theme_tomorrow button, .theme_tomorrow textarea {
  padding: 3px 4px 3px;
  border: 1px solid #282a2e;
  background-color: #444444;
  color: #BBB;
}
html.theme_tomorrow input:focus, html.theme_tomorrow button:focus, html.theme_tomorrow textarea:focus, .theme_tomorrow input:focus, .theme_tomorrow button:focus, .theme_tomorrow textarea:focus {
  border: 1px solid #C5C8C6;
}
html.theme_tomorrow input::placeholder, html.theme_tomorrow textarea::placeholder, .theme_tomorrow input::placeholder, .theme_tomorrow textarea::placeholder {
  color: #707070 !important;
  opacity: 1 !important;
}
html.theme_tomorrow .postingInput, .theme_tomorrow .postingInput {
  border-color: #282a2e;
}
html.theme_tomorrow .dropzone, .theme_tomorrow .dropzone {
  color: rgba(197, 200, 198, 0.5);
  border: 2px dashed #444;
  background-color: rgba(40, 42, 46, 0.5);
}
html.theme_tomorrow .dropzone:hover, .theme_tomorrow .dropzone:hover {
  color: #C5C8C6;
  border-color: #81a2be;
}
html.theme_tomorrow .dragAndDropDiv, html.theme_tomorrow .dragAndDropThumb, .theme_tomorrow .dragAndDropDiv, .theme_tomorrow .dragAndDropThumb {
  color: #C5C8C6;
  background-color: rgba(40, 42, 46, 0.5);
}
html.theme_tomorrow .removeButton, .theme_tomorrow .removeButton {
  color: #707070;
}
html.theme_tomorrow .removeButton:hover, .theme_tomorrow .removeButton:hover {
  color: #F00000;
}
html.theme_tomorrow .fileBrowser, .theme_tomorrow .fileBrowser {
  background: none;
  color: #C5C8C6;
}
html.theme_tomorrow #divOekaki, .theme_tomorrow #divOekaki {
  background-color: #282a2e;
}
html.theme_tomorrow, .theme_tomorrow {
  /* .post-card (redesigned 2026-08-16) */
}
html.theme_tomorrow .post-card, .theme_tomorrow .post-card {
  background: #282a2e;
  border-color: #111111;
  color: #C5C8C6;
}
html.theme_tomorrow .post-card .postingInput, html.theme_tomorrow .post-card textarea, html.theme_tomorrow .post-card select, .theme_tomorrow .post-card .postingInput, .theme_tomorrow .post-card textarea, .theme_tomorrow .post-card select {
  background-color: #444444;
  border-color: #282a2e;
  color: #BBB;
}
html.theme_tomorrow .post-card .postingInput:focus, html.theme_tomorrow .post-card textarea:focus, html.theme_tomorrow .post-card select:focus, .theme_tomorrow .post-card .postingInput:focus, .theme_tomorrow .post-card textarea:focus, .theme_tomorrow .post-card select:focus {
  border-color: #C5C8C6;
}
html.theme_tomorrow .post-card input::placeholder, html.theme_tomorrow .post-card textarea::placeholder, .theme_tomorrow .post-card input::placeholder, .theme_tomorrow .post-card textarea::placeholder {
  color: #707070 !important;
  opacity: 1 !important;
}
html.theme_tomorrow .post-card .dropzone, .theme_tomorrow .post-card .dropzone {
  border: 2px dashed #444;
  color: rgba(197, 200, 198, 0.5);
  background: transparent;
}
html.theme_tomorrow .post-card .dropzone:hover, .theme_tomorrow .post-card .dropzone:hover {
  border-color: #81a2be;
  color: #C5C8C6;
}
html.theme_tomorrow .post-card .toggle-badge, .theme_tomorrow .post-card .toggle-badge {
  background: #1d1d21;
  color: #C5C8C6;
}
html.theme_tomorrow .post-card .advanced-drawer, .theme_tomorrow .post-card .advanced-drawer {
  background: #16181a;
}
html.theme_tomorrow .post-card .drawer-toggle, .theme_tomorrow .post-card .drawer-toggle {
  color: #81a2be;
}
html.theme_tomorrow .post-card .btn-submit, .theme_tomorrow .post-card .btn-submit {
  background: #81a2be;
  color: #1d1f21;
}
html.theme_tomorrow .post-card .btn-submit:hover, .theme_tomorrow .post-card .btn-submit:hover {
  background: #5F89AC;
}
html.theme_tomorrow .post-card .post-rules-panel, .theme_tomorrow .post-card .post-rules-panel {
  background: #1d1d21;
  border-color: #111111;
  color: #707070;
}
html.theme_tomorrow .post-card .post-rules-panel a, .theme_tomorrow .post-card .post-rules-panel a {
  color: #81a2be;
}
html.theme_tomorrow .post-card .rules-line, .theme_tomorrow .post-card .rules-line {
  color: #707070;
}
html.theme_tomorrow .post-card .rules-line a, .theme_tomorrow .post-card .rules-line a {
  color: #81a2be;
}
html.theme_tomorrow .post-card .captchaImage, .theme_tomorrow .post-card .captchaImage {
  background: #fff;
}
html.theme_tomorrow .post-card .captchaTimer, .theme_tomorrow .post-card .captchaTimer {
  color: #707070;
  opacity: 1;
}
html.theme_tomorrow .post-card .no-cookie-link, .theme_tomorrow .post-card .no-cookie-link {
  color: #81a2be;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- F. Modals & settings menu --- */
}
html.theme_tomorrow .modalPanel, .theme_tomorrow .modalPanel {
  background: rgba(0, 0, 0, 0.7);
}
html.theme_tomorrow #quick-reply table, .theme_tomorrow #quick-reply table {
  background: #282a2e;
  border: 1px solid #111111;
  color: #C5C8C6;
  outline-color: #111111;
}
html.theme_tomorrow #post-form-inner th, .theme_tomorrow #post-form-inner th {
  background: #282a2e !important;
  border: 1px solid #222;
  color: #C5C8C6;
  text-align: center;
  padding: 2px 0;
}
html.theme_tomorrow #quick-reply th .handle, .theme_tomorrow #quick-reply th .handle {
  color: #C5C8C6;
  font-size: 13px;
}
html.theme_tomorrow .modalHeader, html.theme_tomorrow #quick-reply .handle, .theme_tomorrow .modalHeader, .theme_tomorrow #quick-reply .handle {
  background: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow .modalDecorationPanel, .theme_tomorrow .modalDecorationPanel {
  background: #1d1d21;
  border-color: #111111;
}
html.theme_tomorrow .modalInnerDecorationPanel, html.theme_tomorrow .post-table, .theme_tomorrow .modalInnerDecorationPanel, .theme_tomorrow .post-table {
  background-color: #1d1f21;
}
html.theme_tomorrow .captchaTimer, .theme_tomorrow .captchaTimer {
  background: #1d1f21;
  border-color: #707070;
  color: #707070;
}
html.theme_tomorrow .captchaImage, .theme_tomorrow .captchaImage {
  background-color: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow, .theme_tomorrow {
  /* Settings menu — full color table (2026-08-17): base _settingsMenu.scss is
     dark-plum; now every surface uses the Tomorrow Night palette (same surface set as green). */
}
html.theme_tomorrow #settingsMenu, .theme_tomorrow #settingsMenu {
  background: #1d1f21;
  color: #C5C8C6;
  border-color: #111111;
}
html.theme_tomorrow #settingsMenu > .header, .theme_tomorrow #settingsMenu > .header {
  background: #282a2e;
  color: #C5C8C6;
  border-bottom-color: #707070;
}
html.theme_tomorrow #settingsMenu > div:nth-child(3), html.theme_tomorrow #settingsMenu > div:nth-child(4), .theme_tomorrow #settingsMenu > div:nth-child(3), .theme_tomorrow #settingsMenu > div:nth-child(4) {
  background-color: #282a2e !important;
  border-color: #444 !important;
}
html.theme_tomorrow #settingsMenu .settingsTab, .theme_tomorrow #settingsMenu .settingsTab {
  color: #707070;
}
html.theme_tomorrow #settingsMenu .settingsTab:hover, html.theme_tomorrow #settingsMenu .settingsTab:focus, .theme_tomorrow #settingsMenu .settingsTab:hover, .theme_tomorrow #settingsMenu .settingsTab:focus {
  background: #1d1d21;
  color: #C5C8C6;
}
html.theme_tomorrow #settingsMenu #selectedTab, .theme_tomorrow #settingsMenu #selectedTab {
  background: #81a2be;
  color: #1d1f21;
}
html.theme_tomorrow #settingsMenu .settingsSectionTitle, .theme_tomorrow #settingsMenu .settingsSectionTitle {
  color: #707070;
  border-bottom-color: #707070;
}
html.theme_tomorrow #settingsMenu .settingName, .theme_tomorrow #settingsMenu .settingName {
  color: #C5C8C6;
}
html.theme_tomorrow #settingsMenu .settingDesc, .theme_tomorrow #settingsMenu .settingDesc {
  color: #707070;
}
html.theme_tomorrow #settingsMenu .settingsCheckbox, .theme_tomorrow #settingsMenu .settingsCheckbox {
  accent-color: #81a2be;
}
html.theme_tomorrow #settingsMenu .saveButton, .theme_tomorrow #settingsMenu .saveButton {
  background: #81a2be;
  color: #1d1f21;
}
html.theme_tomorrow #settingsMenu .saveButton:hover, .theme_tomorrow #settingsMenu .saveButton:hover {
  background: #5F89AC;
}
html.theme_tomorrow #settingsMenu #newFilterPanel select, html.theme_tomorrow #settingsMenu #newFilterPanel input[type=text], .theme_tomorrow #settingsMenu #newFilterPanel select, .theme_tomorrow #settingsMenu #newFilterPanel input[type=text] {
  background: #444444;
  color: #C5C8C6;
  border-color: #707070;
}
html.theme_tomorrow #settingsMenu #newFilterPanel button, .theme_tomorrow #settingsMenu #newFilterPanel button {
  background: #1d1d21;
  color: #C5C8C6;
  border-color: #707070;
}
html.theme_tomorrow #settingsMenu #newFilterPanel button:hover, .theme_tomorrow #settingsMenu #newFilterPanel button:hover {
  background: #282a2e;
}
html.theme_tomorrow #settingsMenu .existingFilterTypeLabel, html.theme_tomorrow #settingsMenu .existingFilterContentLabel, .theme_tomorrow #settingsMenu .existingFilterTypeLabel, .theme_tomorrow #settingsMenu .existingFilterContentLabel {
  color: #707070;
}
html.theme_tomorrow #settingsMenu .filterDeleteButton, .theme_tomorrow #settingsMenu .filterDeleteButton {
  color: #707070;
}
html.theme_tomorrow #settingsMenu .filterDeleteButton:hover, .theme_tomorrow #settingsMenu .filterDeleteButton:hover {
  color: #F20;
}
html.theme_tomorrow #settingsMenu #themeSelector, html.theme_tomorrow #settingsMenu #cssInput, .theme_tomorrow #settingsMenu #themeSelector, .theme_tomorrow #settingsMenu #cssInput {
  background: #444444;
  color: #C5C8C6;
  border-color: #707070;
}
html.theme_tomorrow #closeSettingsMenuButton, .theme_tomorrow #closeSettingsMenuButton {
  color: #C5C8C6;
}
html.theme_tomorrow .appealForm table tr th, html.theme_tomorrow table.modInfo tr th, .theme_tomorrow .appealForm table tr th, .theme_tomorrow table.modInfo tr th {
  background: #282a2e;
  color: #C5C8C6;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- G. Catalog view --- */
}
html.theme_tomorrow .catalogCell, .theme_tomorrow .catalogCell {
  background: rgba(0, 0, 0, 0.05);
}
html.theme_tomorrow .catalogCell .divMessage, .theme_tomorrow .catalogCell .divMessage {
  min-width: 0;
  margin: 0;
}
html.theme_tomorrow .catalogCell:hover .divMessage, .theme_tomorrow .catalogCell:hover .divMessage {
  background: #1c1d1f;
  outline: none;
}
html.theme_tomorrow .catalogCell:focus .divMessage, .theme_tomorrow .catalogCell:focus .divMessage {
  background: #1c1d1f;
  outline-color: #1c1d1f;
}
html.theme_tomorrow .catalogCell .labelSubject, .theme_tomorrow .catalogCell .labelSubject {
  color: #446655;
}
html.theme_tomorrow .threadStats, .theme_tomorrow .threadStats {
  color: #707070;
}
html.theme_tomorrow .linkThumb img, .theme_tomorrow .linkThumb img {
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.55);
  border: 2px solid rgba(153, 153, 153, 0);
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- H. Front page / boards list --- */
}
html.theme_tomorrow #divLatestPosts .latestPostCell, .theme_tomorrow #divLatestPosts .latestPostCell {
  background: inherit;
}
html.theme_tomorrow #divLatestImages img, .theme_tomorrow #divLatestImages img {
  border-color: #707070;
}
html.theme_tomorrow #boardsCellHeader span, .theme_tomorrow #boardsCellHeader span {
  background: #282a2e;
  border: 1px solid #111;
  color: #C5C8C6;
}
html.theme_tomorrow .boardsCell:nth-of-type(2n+1) span, .theme_tomorrow .boardsCell:nth-of-type(2n+1) span {
  background-color: #282a2e;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- I. Code highlighting (highlight.js — Tomorrow Night Eighties) --- */
}
html.theme_tomorrow .hljs-comment, html.theme_tomorrow .hljs-quote, .theme_tomorrow .hljs-comment, .theme_tomorrow .hljs-quote {
  color: #999999;
}
html.theme_tomorrow .hljs-variable, html.theme_tomorrow .hljs-template-variable, html.theme_tomorrow .hljs-tag, html.theme_tomorrow .hljs-name,
html.theme_tomorrow .hljs-selector-id, html.theme_tomorrow .hljs-selector-class, html.theme_tomorrow .hljs-regexp, html.theme_tomorrow .hljs-deletion, .theme_tomorrow .hljs-variable, .theme_tomorrow .hljs-template-variable, .theme_tomorrow .hljs-tag, .theme_tomorrow .hljs-name,
.theme_tomorrow .hljs-selector-id, .theme_tomorrow .hljs-selector-class, .theme_tomorrow .hljs-regexp, .theme_tomorrow .hljs-deletion {
  color: #f2777a;
}
html.theme_tomorrow .hljs-number, html.theme_tomorrow .hljs-built_in, html.theme_tomorrow .hljs-builtin-name, html.theme_tomorrow .hljs-literal,
html.theme_tomorrow .hljs-type, html.theme_tomorrow .hljs-params, html.theme_tomorrow .hljs-meta, html.theme_tomorrow .hljs-link, .theme_tomorrow .hljs-number, .theme_tomorrow .hljs-built_in, .theme_tomorrow .hljs-builtin-name, .theme_tomorrow .hljs-literal,
.theme_tomorrow .hljs-type, .theme_tomorrow .hljs-params, .theme_tomorrow .hljs-meta, .theme_tomorrow .hljs-link {
  color: #f99157;
}
html.theme_tomorrow .hljs-attribute, .theme_tomorrow .hljs-attribute {
  color: #ffcc66;
}
html.theme_tomorrow .hljs-string, html.theme_tomorrow .hljs-symbol, html.theme_tomorrow .hljs-bullet, html.theme_tomorrow .hljs-addition, .theme_tomorrow .hljs-string, .theme_tomorrow .hljs-symbol, .theme_tomorrow .hljs-bullet, .theme_tomorrow .hljs-addition {
  color: #99cc99;
}
html.theme_tomorrow .hljs-title, html.theme_tomorrow .hljs-section, .theme_tomorrow .hljs-title, .theme_tomorrow .hljs-section {
  color: #6699cc;
}
html.theme_tomorrow .hljs-keyword, html.theme_tomorrow .hljs-selector-tag, .theme_tomorrow .hljs-keyword, .theme_tomorrow .hljs-selector-tag {
  color: #cc99cc;
}
html.theme_tomorrow .hljs, .theme_tomorrow .hljs {
  display: block;
  overflow-x: auto;
  background: #2d2d2d;
  color: #cccccc;
  padding: 0.5em;
}
html.theme_tomorrow .hljs-emphasis, .theme_tomorrow .hljs-emphasis {
  font-style: italic;
}
html.theme_tomorrow .hljs-strong, .theme_tomorrow .hljs-strong {
  font-weight: bold;
}
html.theme_tomorrow, .theme_tomorrow {
  /* --- J. Badges, indicators & misc --- */
}
html.theme_tomorrow .radiospan, .theme_tomorrow .radiospan {
  color: #fff;
  background-color: #d10000;
}
html.theme_tomorrow .dot, .theme_tomorrow .dot {
  background-color: orange;
}
html.theme_tomorrow .medals .text, .theme_tomorrow .medals .text {
  background-color: #282a2e;
  color: #fff;
}
html.theme_tomorrow .mobileAlert, .theme_tomorrow .mobileAlert {
  color: #F00000;
}
html.theme_tomorrow .linkFollow, .theme_tomorrow .linkFollow {
  color: #adbd68;
}
html.theme_tomorrow .linkFollowAlt, .theme_tomorrow .linkFollowAlt {
  color: #F00000;
}
html.theme_tomorrow .watchedNotification::before, .theme_tomorrow .watchedNotification::before {
  color: #F00000;
}
html.theme_tomorrow #boardContentLinks, .theme_tomorrow #boardContentLinks {
  color: #707070;
}
html.theme_tomorrow #reportActions, .theme_tomorrow #reportActions {
  background-color: #282a2e;
}
html.theme_tomorrow .contentAction, .theme_tomorrow .contentAction {
  background-color: #282a2e;
  border: 1px solid #282a2e;
  float: none;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  width: 25%;
  min-width: 300px;
}
html.theme_tomorrow #labelCaptchaId, .theme_tomorrow #labelCaptchaId {
  color: #ff0000;
}
html.theme_tomorrow #solved, .theme_tomorrow #solved {
  color: #adbd68;
}
html.theme_tomorrow a, html.theme_tomorrow .reportdeletebuttons, .theme_tomorrow a, .theme_tomorrow .reportdeletebuttons {
  color: #81a2be;
  text-decoration: none;
}
html.theme_tomorrow a:hover, .theme_tomorrow a:hover {
  color: #5F89AC;
}
html.theme_tomorrow h2 a:link, .theme_tomorrow h2 a:link {
  color: #C5C8C6;
}
html.theme_tomorrow h2 a:visited, .theme_tomorrow h2 a:visited {
  color: #707070;
}
html.theme_tomorrow .handle a, .theme_tomorrow .handle a {
  color: #C5C8C6;
}
html.theme_tomorrow, .theme_tomorrow {
  /* ==========================================================================
     LAYOUT DELTA — non-color identity of the original tomorrow theme, kept as-is
     ========================================================================== */
}
html.theme_tomorrow #topBox, .theme_tomorrow #topBox {
  text-align: center;
  font-size: 16px;
  padding: 10px 0 20px 0;
}
html.theme_tomorrow #innerWrapper > div, html.theme_tomorrow .infoBox, .theme_tomorrow #innerWrapper > div, .theme_tomorrow .infoBox {
  border: none;
  background: none;
}
html.theme_tomorrow .linkPost img, .theme_tomorrow .linkPost img {
  padding: 6px 0 6px 0;
}
html.theme_tomorrow footer, .theme_tomorrow footer {
  background: none;
  font-size: 10px;
  margin: 20px 0 10px 0;
}
html.theme_tomorrow .settings, .theme_tomorrow .settings {
  background: none;
  border: none;
}
html.theme_tomorrow .logCell, .theme_tomorrow .logCell {
  font-weight: bold;
  font-size: 15px;
  margin: 10px;
  padding: 0 5px 0 0;
}
html.theme_tomorrow .logCell p span, .theme_tomorrow .logCell p span {
  font-weight: normal;
  padding: 10px;
}
html.theme_tomorrow #bannerImage, .theme_tomorrow #bannerImage {
  border: 1px solid #a9a9a9;
  margin-top: -5px;
  margin-bottom: 15px;
}
html.theme_tomorrow #modeBanner, .theme_tomorrow #modeBanner {
  background-color: #1d1f21;
  color: white;
  font-size: 12pt;
  font-weight: bold;
  margin: 1em 0;
}
html.theme_tomorrow .boardHeader p, .theme_tomorrow .boardHeader p {
  font-family: tahoma;
  color: #C5C8C6;
}
html.theme_tomorrow .boardHeader p#labelName, .theme_tomorrow .boardHeader p#labelName {
  font-weight: bold;
  font-size: 22pt;
}
html.theme_tomorrow .boardHeader a, .theme_tomorrow .boardHeader a {
  font-family: arial, sans-serif;
  font-size: 12px;
}
html.theme_tomorrow #divMessage, .theme_tomorrow #divMessage {
  text-align: center;
  color: #F20;
  font-size: 12px;
  font-weight: bold;
}
html.theme_tomorrow .innerPost .uploadCell img, .theme_tomorrow .innerPost .uploadCell img {
  padding: 6px;
  margin-right: 20px;
}
html.theme_tomorrow .divMessage, .theme_tomorrow .divMessage {
  font-size: 13px;
  margin: 12px 19px 12px 28px;
  padding: 0 5px 0 0;
  min-width: 300px; /* fix post number position */
}
html.theme_tomorrow .quoteblock, .theme_tomorrow .quoteblock {
  background: none !important;
}
html.theme_tomorrow .quoteblock .labelCreated, html.theme_tomorrow .quoteblock .linkQuote, html.theme_tomorrow .quoteblock .labelRole,
html.theme_tomorrow .quoteblock .spanId, html.theme_tomorrow .quoteblock .linkSelf, .theme_tomorrow .quoteblock .labelCreated, .theme_tomorrow .quoteblock .linkQuote, .theme_tomorrow .quoteblock .labelRole,
.theme_tomorrow .quoteblock .spanId, .theme_tomorrow .quoteblock .linkSelf {
  font-size: 12px;
  color: #C5C8C6;
}
html.theme_tomorrow .quoteblock .linkSelf, .theme_tomorrow .quoteblock .linkSelf {
  margin-left: 0; /* fix hover post box */
}
html.theme_tomorrow .linkPreview, .theme_tomorrow .linkPreview {
  visibility: collapse;
}
html.theme_tomorrow .linkPreview + .linkSelf, .theme_tomorrow .linkPreview + .linkSelf {
  margin-left: -50px; /* move post number over preview */
}
html.theme_tomorrow #reportFieldReason, .theme_tomorrow #reportFieldReason {
  margin-left: 2.1em;
}
html.theme_tomorrow #deletionFieldPassword, .theme_tomorrow #deletionFieldPassword {
  margin-left: 1em;
}
html.theme_tomorrow img#captchaImageReport, .theme_tomorrow img#captchaImageReport {
  margin-left: auto;
  margin-right: auto;
}
html.theme_tomorrow .divPosts .postCell .innerPost:before,
html.theme_tomorrow .divPosts .postCell .markedPost:before, .theme_tomorrow .divPosts .postCell .innerPost:before,
.theme_tomorrow .divPosts .postCell .markedPost:before {
  margin-left: -20px !important;
  color: #282a2e;
  font-size: 10pt;
}

html.theme_green, .theme_green {
  color-scheme: light;
  /* ==========================================================================
     Green - Complete Theme (rebuilt 2026-08-17, standardization pass)
     Operator verdict: "a carefully made stylish green theme would be a nice
     option." Light green design seeded from the original's three colors
     (#92D17E cells, #317055 headers). Tuned 2026-08-17 to a MID-SAGE canvas
     #adc2b4 (operator pick from green-swatch.html — "halfway between dark and
     light"); subject red -> hunter green; links/dim darkened for contrast on
     the mid ground. Canvas hex is CSP-hashed in the FOUC head script — base.njk
     + VM general.json updated in the same ship.
     ========================================================================== */
  /* Core palette (mid-sage) */
  /* page background — mid sage (CSP-hashed) */
  /* post cells — one tier lighter than canvas */
  /* marked posts */
  /* th / h2 / modal headers — seed color, kept */
  /* was #fff — "stark white" (operator 2026-08-17); soft sage-white, same tone as $gr-cell */
  /* darkened for contrast on mid canvas */
  /* was red #b32424 — "out of place" (operator) */
}
html.theme_green, .theme_green {
  background: #adc2b4 none !important;
  color: #20261f !important;
}
html.theme_green, .theme_green {
  /* --- A. Canvas & page structure --- */
}
html.theme_green body, .theme_green body {
  background: #adc2b4 !important;
  color: #20261f;
}
html.theme_green #footer, .theme_green #footer {
  color: #54685a;
}
html.theme_green #news, .theme_green #news {
  background: #cfe0d2;
  border-color: #8aa28c;
  color: #20261f;
}
html.theme_green .hiddenThread, .theme_green .hiddenThread {
  background: #bcd0bd;
  border-color: #8aa28c;
}
html.theme_green .kCard .kBody,
html.theme_green #indexWrapper #indexLeft > div,
html.theme_green #indexWrapper #indexRight > div,
html.theme_green #subpageWrapper > div,
html.theme_green #redirect > div, .theme_green .kCard .kBody,
.theme_green #indexWrapper #indexLeft > div,
.theme_green #indexWrapper #indexRight > div,
.theme_green #subpageWrapper > div,
.theme_green #redirect > div {
  background-color: #cfe0d2;
  border-left-color: #8aa28c;
  border-right-color: #8aa28c;
  border-bottom-color: #8aa28c;
}
html.theme_green .mCard, .theme_green .mCard {
  background-color: #cfe0d2;
}
html.theme_green .mCard > h2, .theme_green .mCard > h2 {
  background: #317055;
  color: #fff;
}
html.theme_green h1, .theme_green h1 {
  color: #245240;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
html.theme_green, .theme_green {
  /* board/thread title — green shade + soft dark edge (operator: jet-black was flat) */
}
html.theme_green #siteName, .theme_green #siteName {
  color: #245240;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
html.theme_green, .theme_green {
  /* main site title — match h1 (operator: was still jetblack on the sage canvas) */
}
html.theme_green h2, html.theme_green h3, .theme_green h2, .theme_green h3 {
  color: #fff;
  background: #317055;
}
html.theme_green div.titlebar, .theme_green div.titlebar {
  background: #317055;
  color: #fff;
}
html.theme_green #cookieBanner, .theme_green #cookieBanner {
  background-color: #cfe0d2;
  border-bottom-color: #8aa28c;
  color: #20261f;
}
html.theme_green .unimportant, html.theme_green .unimportant *, .theme_green .unimportant, .theme_green .unimportant * {
  color: #99a699 !important;
}
html.theme_green progress, .theme_green progress {
  background: #bcd0bd;
}
html.theme_green progress::-webkit-progress-value, .theme_green progress::-webkit-progress-value {
  background: #2e8b57;
}
html.theme_green progress::-moz-progress-bar, .theme_green progress::-moz-progress-bar {
  background: #2e8b57;
}
html.theme_green *, .theme_green * {
  scrollbar-color: #8aa28c #c9d8cb;
}
html.theme_green hr, .theme_green hr {
  border-color: #8aa28c;
}
html.theme_green ::selection, .theme_green ::selection {
  background: #d5e3d8;
  color: #000;
}
html.theme_green, .theme_green {
  /* --- B. Navigation & menus --- */
}
html.theme_green #topNav, .theme_green #topNav {
  background: transparent;
}
html.theme_green #topNav.fixed, html.theme_green #topNav.active, .theme_green #topNav.fixed, .theme_green #topNav.active {
  background: #c9d8cb;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
html.theme_green .navLinkSpan, .theme_green .navLinkSpan {
  color: #1f5c40;
}
html.theme_green .divPages, html.theme_green #divPages, .theme_green .divPages, .theme_green #divPages {
  border-color: #8aa28c;
}
html.theme_green .extraMenu a, .theme_green .extraMenu a {
  color: #20261f;
  text-decoration: none;
}
html.theme_green .extraMenu div:hover, html.theme_green .hideMenu div:hover, .theme_green .extraMenu div:hover, .theme_green .hideMenu div:hover {
  background: #bcd0bd;
  color: #000;
}
html.theme_green .extraMenu, html.theme_green .hideMenu, .theme_green .extraMenu, .theme_green .hideMenu {
  border-color: #1f5c40;
}
html.theme_green, .theme_green {
  /* --- C. Post cells & thread view --- */
}
html.theme_green .topBoards a, html.theme_green .innerPost, html.theme_green .markedPost, html.theme_green .floatingMenu, .theme_green .topBoards a, .theme_green .innerPost, .theme_green .markedPost, .theme_green .floatingMenu {
  background: #d5e3d8;
}
html.theme_green #watchedMenu .watchedCellLabel a, .theme_green #watchedMenu .watchedCellLabel a {
  color: #1f5c40;
}
html.theme_green, .theme_green {
  /* watched-threads menu links */
}
html.theme_green .markedPost, .theme_green .markedPost {
  background: #c8dac9;
}
html.theme_green .markedPost, html.theme_green div.postCell:target .innerPost, .theme_green .markedPost, .theme_green div.postCell:target .innerPost {
  outline-color: #1f5c40;
}
html.theme_green .quoteTooltip > div, .theme_green .quoteTooltip > div {
  border-color: #1f5c40;
}
html.theme_green .uploadDetails, .theme_green .uploadDetails {
  color: #333;
}
html.theme_green .innerPost .expandLabel, html.theme_green .innerPost .collapseLabel, .theme_green .innerPost .expandLabel, .theme_green .innerPost .collapseLabel {
  background: #d5e3d8;
  color: #1a2418;
}
html.theme_green .markedPost .expandLabel, html.theme_green .markedPost .collapseLabel, .theme_green .markedPost .expandLabel, .theme_green .markedPost .collapseLabel {
  background: #c8dac9;
  color: #1a2418;
}
html.theme_green .innerOP .expandLabel, html.theme_green .innerOP .collapseLabel, .theme_green .innerOP .expandLabel, .theme_green .innerOP .collapseLabel {
  background: #dde9de;
  color: #54685a;
}
html.theme_green .innerPost .bottomGradient, .theme_green .innerPost .bottomGradient {
  background: linear-gradient(transparent, #d5e3d8);
}
html.theme_green .innerOP .bottomGradient, .theme_green .innerOP .bottomGradient {
  background: linear-gradient(transparent, #dde9de);
}
html.theme_green, .theme_green {
  /* upload/selected cells — soft sage-white, one tier lighter than $gr-panel (operator: pure #fff was stark) */
}
html.theme_green .innerPost .panelUploads .uploadCell,
html.theme_green .markedPost .panelUploads .uploadCell, .theme_green .innerPost .panelUploads .uploadCell,
.theme_green .markedPost .panelUploads .uploadCell {
  background: #ecf2ec;
  border: 1px solid #8aa28c;
}
html.theme_green .innerOP .panelUploads .uploadCell,
html.theme_green #selectedDiv .selectedCell,
html.theme_green #selectedDivQr .selectedCell, .theme_green .innerOP .panelUploads .uploadCell,
.theme_green #selectedDiv .selectedCell,
.theme_green #selectedDivQr .selectedCell {
  background: #ecf2ec;
  border: 1px solid #8aa28c;
}
html.theme_green .labelId, .theme_green .labelId {
  color: #fff;
}
html.theme_green, .theme_green {
  /* outline inherited from base _posting.scss */
}
html.theme_green .labelCreated, html.theme_green .relativeTime, html.theme_green .spanId, .theme_green .labelCreated, .theme_green .relativeTime, .theme_green .spanId {
  color: #54685a;
}
html.theme_green .linkName, .theme_green .linkName {
  color: #1f5c40;
  font-weight: bold;
}
html.theme_green .linkName:hover, .theme_green .linkName:hover {
  color: #cc3333;
}
html.theme_green .noEmailName, html.theme_green .noEmailName:hover, .theme_green .noEmailName, .theme_green .noEmailName:hover {
  color: #1f5c40;
}
html.theme_green .linkQuote, html.theme_green .linkSelf, .theme_green .linkQuote, .theme_green .linkSelf {
  color: #20261f !important;
}
html.theme_green .linkQuote:hover, html.theme_green .linkSelf:hover, .theme_green .linkQuote:hover, .theme_green .linkSelf:hover {
  color: #1d4a33 !important;
}
html.theme_green .labelSubject, .theme_green .labelSubject {
  color: #2d6a4f;
  font-weight: bold;
}
html.theme_green .labelRole, .theme_green .labelRole {
  color: #ff0000;
}
html.theme_green .sage, html.theme_green .bumpLockIndicator, .theme_green .sage, .theme_green .bumpLockIndicator {
  color: #cc3333;
}
html.theme_green .divBanMessage, .theme_green .divBanMessage {
  color: #d10000;
}
html.theme_green .contentOmissionIndicator, .theme_green .contentOmissionIndicator {
  color: #54685a;
}
html.theme_green .labelOmission, .theme_green .labelOmission {
  color: #54685a;
}
html.theme_green .panelBacklinks a, .theme_green .panelBacklinks a {
  color: #1f5c40;
  font-style: italic;
}
html.theme_green .panelBacklinks a:hover, .theme_green .panelBacklinks a:hover {
  color: #1d4a33;
}
html.theme_green .quoteLink, html.theme_green .quoteLink:hover, .theme_green .quoteLink, .theme_green .quoteLink:hover {
  color: #1f5c40;
}
html.theme_green, .theme_green {
  /* --- D. Chan markup & spoilers --- */
}
html.theme_green .greenText, html.theme_green .quote, .theme_green .greenText, .theme_green .quote {
  color: #2e8b57;
}
html.theme_green .redText, .theme_green .redText {
  color: #cc3333;
  font-weight: bold;
}
html.theme_green .orangeText, .theme_green .orangeText {
  color: #d97706;
}
html.theme_green .brackets::after, html.theme_green .brackets::before, .theme_green .brackets::after, .theme_green .brackets::before {
  color: #20261f;
}
html.theme_green span.spoiler, .theme_green span.spoiler {
  background: #000;
  color: #000;
}
html.theme_green span.spoiler:hover, .theme_green span.spoiler:hover {
  color: #FFF;
  background-color: #000;
}
html.theme_green span.spoiler > .greenText, .theme_green span.spoiler > .greenText {
  color: #000 !important;
}
html.theme_green span.spoiler > .orangeText, .theme_green span.spoiler > .orangeText {
  color: #000 !important;
}
html.theme_green span.spoiler > a, .theme_green span.spoiler > a {
  color: #000 !important;
}
html.theme_green span.spoiler:hover > .greenText, .theme_green span.spoiler:hover > .greenText {
  color: #2e8b57 !important;
}
html.theme_green span.spoiler:hover > .orangeText, .theme_green span.spoiler:hover > .orangeText {
  color: #d97706 !important;
}
html.theme_green span.spoiler:hover > a, .theme_green span.spoiler:hover > a {
  color: #1f5c40 !important;
}
html.theme_green, .theme_green {
  /* --- E. Posting form (legacy table + .post-card) --- */
}
html.theme_green #postingForm th, html.theme_green .modalTableBody th, .theme_green #postingForm th, .theme_green .modalTableBody th {
  background: #317055;
  color: #fff;
}
html.theme_green, .theme_green {
  /* seed rule, text fixed for contrast */
}
html.theme_green input, html.theme_green textarea, html.theme_green select, .theme_green input, .theme_green textarea, .theme_green select {
  background: #ecf2ec;
  border: 1px solid #8aa28c;
  color: #000;
}
html.theme_green, .theme_green {
  /* Checkboxes/radios (posting form + settings + board options): native box in the
     sage tone, control fill in theme green. accent-color tints the checked state
     (supported Chromium/FF/Safari 12.1+); where unsupported it simply no-ops. */
}
html.theme_green input[type=checkbox], html.theme_green input[type=radio], .theme_green input[type=checkbox], .theme_green input[type=radio] {
  accent-color: #2e8b57;
}
html.theme_green input::placeholder, html.theme_green textarea::placeholder, .theme_green input::placeholder, .theme_green textarea::placeholder {
  color: #999 !important;
  opacity: 1 !important;
}
html.theme_green .postingInput, .theme_green .postingInput {
  border-color: #8aa28c;
}
html.theme_green .dropzone, .theme_green .dropzone {
  color: #555;
  border: 2px dashed #8aa28c;
  background-color: rgba(49, 112, 85, 0.1);
}
html.theme_green .dropzone:hover, .theme_green .dropzone:hover {
  color: #000;
  border-color: #1f5c40;
}
html.theme_green .dragAndDropDiv, html.theme_green .dragAndDropThumb, .theme_green .dragAndDropDiv, .theme_green .dragAndDropThumb {
  color: #000;
  background-color: rgba(255, 255, 255, 0.7);
}
html.theme_green .removeButton, .theme_green .removeButton {
  color: #999;
}
html.theme_green .removeButton:hover, .theme_green .removeButton:hover {
  color: #cc3333;
}
html.theme_green .fileBrowser, .theme_green .fileBrowser {
  background: none;
  color: #20261f;
}
html.theme_green #divOekaki, .theme_green #divOekaki {
  background-color: #fff;
}
html.theme_green, .theme_green {
  /* .post-card (redesigned 2026-08-16) */
}
html.theme_green .post-card, .theme_green .post-card {
  background: #dde9de;
  border-color: #8aa28c;
  color: #20261f;
}
html.theme_green .post-card .postingInput, html.theme_green .post-card textarea, html.theme_green .post-card select, .theme_green .post-card .postingInput, .theme_green .post-card textarea, .theme_green .post-card select {
  background: #ecf2ec;
  border-color: #8aa28c;
  color: #000;
}
html.theme_green .post-card .postingInput:focus, html.theme_green .post-card textarea:focus, html.theme_green .post-card select:focus, .theme_green .post-card .postingInput:focus, .theme_green .post-card textarea:focus, .theme_green .post-card select:focus {
  border-color: #1f5c40;
}
html.theme_green .post-card input::placeholder, html.theme_green .post-card textarea::placeholder, .theme_green .post-card input::placeholder, .theme_green .post-card textarea::placeholder {
  color: #999 !important;
  opacity: 1 !important;
}
html.theme_green .post-card .dropzone, .theme_green .post-card .dropzone {
  border: 2px dashed #8aa28c;
  color: #555;
  background: transparent;
}
html.theme_green .post-card .dropzone:hover, .theme_green .post-card .dropzone:hover {
  border-color: #1f5c40;
  color: #000;
}
html.theme_green .post-card .toggle-badge, .theme_green .post-card .toggle-badge {
  background: #bcd0bd;
  color: #1a2418;
}
html.theme_green .post-card .advanced-drawer, .theme_green .post-card .advanced-drawer {
  background: rgba(255, 255, 255, 0.6);
}
html.theme_green .post-card .drawer-toggle, .theme_green .post-card .drawer-toggle {
  color: #1f5c40;
}
html.theme_green .post-card .btn-submit, .theme_green .post-card .btn-submit {
  background: #317055;
  color: #fff;
}
html.theme_green .post-card .btn-submit:hover, .theme_green .post-card .btn-submit:hover {
  background: #245240;
}
html.theme_green .post-card .post-rules-panel, .theme_green .post-card .post-rules-panel {
  background: #ecf2ec;
  border-color: #8aa28c;
  color: #333;
}
html.theme_green .post-card .post-rules-panel a, .theme_green .post-card .post-rules-panel a {
  color: #1f5c40;
}
html.theme_green .post-card .rules-line, .theme_green .post-card .rules-line {
  color: #54685a;
}
html.theme_green .post-card .rules-line a, .theme_green .post-card .rules-line a {
  color: #1f5c40;
}
html.theme_green .post-card .captchaImage, .theme_green .post-card .captchaImage {
  background: #fff;
}
html.theme_green .post-card .captchaTimer, .theme_green .post-card .captchaTimer {
  color: #54685a;
  opacity: 1;
}
html.theme_green .post-card .no-cookie-link, .theme_green .post-card .no-cookie-link {
  color: #1f5c40;
}
html.theme_green, .theme_green {
  /* --- F. Modals & settings menu --- */
}
html.theme_green .modalPanel, .theme_green .modalPanel {
  background: rgba(0, 0, 0, 0.4);
}
html.theme_green #quick-reply table, .theme_green #quick-reply table {
  background-color: #dde9de;
  outline-color: #8aa28c;
}
html.theme_green #quick-reply td.recaptcha span, .theme_green #quick-reply td.recaptcha span {
  background: #fff;
  border-color: #ccc;
}
html.theme_green .modalHeader, html.theme_green #quick-reply .handle, .theme_green .modalHeader, .theme_green #quick-reply .handle {
  background: #317055;
  color: #fff;
}
html.theme_green .handle a, .theme_green .handle a {
  color: #fff;
}
html.theme_green .modalDecorationPanel, .theme_green .modalDecorationPanel {
  background: #bcd0bd;
  border-color: #8aa28c;
}
html.theme_green .modalInnerDecorationPanel, html.theme_green .post-table, .theme_green .modalInnerDecorationPanel, .theme_green .post-table {
  background-color: #dde9de;
}
html.theme_green .captchaTimer, .theme_green .captchaTimer {
  background: #dde9de;
  border-color: #999;
  color: #54685a;
}
html.theme_green .captchaImage, .theme_green .captchaImage {
  background-color: #fff;
  color: #000;
}
html.theme_green, .theme_green {
  /* Settings menu — full color table (2026-08-17): the base _settingsMenu.scss is
     dark-plum (light pink/purple text #e2d9ec etc.) and green previously overrode
     only 3 of its ~15 colored surfaces → "default light pink/purple text… clashes
     badly" (operator). Now every surface sits in the sage family, same tones as
     .post-card. (Specificity is automatic: every theme rule compiles prefixed with
     `html.theme_green`, so it beats the base's #settingsMenu-scoped rules — but keep
     the #settingsMenu prefix anyway, to stay scoped against this file's own generic
     input/a rules.) */
}
html.theme_green #settingsMenu, .theme_green #settingsMenu {
  background: #dde9de;
  color: #20261f;
  border-color: #8aa28c;
}
html.theme_green #settingsMenu > .header, .theme_green #settingsMenu > .header {
  background: #317055;
  color: #fff;
  border-bottom-color: #8aa28c;
}
html.theme_green #settingsMenu > div:nth-child(3), html.theme_green #settingsMenu > div:nth-child(4), .theme_green #settingsMenu > div:nth-child(3), .theme_green #settingsMenu > div:nth-child(4) {
  background: #dde9de;
  border-left-color: #8aa28c;
  border-right-color: #8aa28c;
  border-top-color: #8aa28c;
  border-bottom-color: #8aa28c;
}
html.theme_green #settingsMenu .settingsTab, .theme_green #settingsMenu .settingsTab {
  color: #54685a;
}
html.theme_green #settingsMenu .settingsTab:hover, html.theme_green #settingsMenu .settingsTab:focus, .theme_green #settingsMenu .settingsTab:hover, .theme_green #settingsMenu .settingsTab:focus {
  background: #cfe0d2;
  color: #20261f;
}
html.theme_green #settingsMenu #selectedTab, .theme_green #settingsMenu #selectedTab {
  background: #317055;
  color: #fff;
}
html.theme_green #settingsMenu .settingsSectionTitle, .theme_green #settingsMenu .settingsSectionTitle {
  color: #2d6a4f;
  border-bottom-color: #8aa28c;
}
html.theme_green #settingsMenu .settingName, .theme_green #settingsMenu .settingName {
  color: #20261f;
}
html.theme_green #settingsMenu .settingDesc, .theme_green #settingsMenu .settingDesc {
  color: #54685a;
}
html.theme_green #settingsMenu .settingsCheckbox, .theme_green #settingsMenu .settingsCheckbox {
  accent-color: #2e8b57;
}
html.theme_green, .theme_green {
  /* matches the posting-form checkbox rule */
}
html.theme_green #settingsMenu .saveButton, .theme_green #settingsMenu .saveButton {
  background: #317055;
  color: #fff;
}
html.theme_green #settingsMenu .saveButton:hover, .theme_green #settingsMenu .saveButton:hover {
  background: #245240;
}
html.theme_green #settingsMenu #newFilterPanel select, html.theme_green #settingsMenu #newFilterPanel input[type=text], .theme_green #settingsMenu #newFilterPanel select, .theme_green #settingsMenu #newFilterPanel input[type=text] {
  background: #ecf2ec;
  color: #20261f;
  border-color: #8aa28c;
}
html.theme_green #settingsMenu #newFilterPanel button, .theme_green #settingsMenu #newFilterPanel button {
  background: #cfe0d2;
  color: #20261f;
  border-color: #8aa28c;
}
html.theme_green #settingsMenu #newFilterPanel button:hover, .theme_green #settingsMenu #newFilterPanel button:hover {
  background: #bcd0bd;
}
html.theme_green #settingsMenu .existingFilterTypeLabel, html.theme_green #settingsMenu .existingFilterContentLabel, .theme_green #settingsMenu .existingFilterTypeLabel, .theme_green #settingsMenu .existingFilterContentLabel {
  color: #20261f;
}
html.theme_green #settingsMenu .filterDeleteButton, .theme_green #settingsMenu .filterDeleteButton {
  color: #54685a;
}
html.theme_green #settingsMenu .filterDeleteButton:hover, .theme_green #settingsMenu .filterDeleteButton:hover {
  color: #cc3333;
}
html.theme_green #settingsMenu #themeSelector, html.theme_green #settingsMenu #cssInput, .theme_green #settingsMenu #themeSelector, .theme_green #settingsMenu #cssInput {
  background: #ecf2ec;
  color: #20261f;
  border-color: #8aa28c;
}
html.theme_green #closeSettingsMenuButton, .theme_green #closeSettingsMenuButton {
  color: #fff;
}
html.theme_green, .theme_green {
  /* sits on the green header bar */
}
html.theme_green .appealForm table tr th, html.theme_green table.modInfo tr th, .theme_green .appealForm table tr th, .theme_green table.modInfo tr th {
  background: #317055;
  color: #fff;
}
html.theme_green, .theme_green {
  /* --- G. Catalog view --- */
}
html.theme_green .catalogCell, .theme_green .catalogCell {
  background: rgba(49, 112, 85, 0.08);
}
html.theme_green .catalogCell .labelSubject, .theme_green .catalogCell .labelSubject {
  color: #2d6a4f;
}
html.theme_green .catalogCell:hover, .theme_green .catalogCell:hover {
  background: #bcd0bd;
}
html.theme_green .catalogCell:hover .divMessage, html.theme_green .catalogCell:focus .divMessage, .theme_green .catalogCell:hover .divMessage, .theme_green .catalogCell:focus .divMessage {
  background: #dde9de;
  outline-color: #8aa28c;
}
html.theme_green .threadStats, .theme_green .threadStats {
  color: #54685a;
}
html.theme_green .linkThumb img, .theme_green .linkThumb img {
  border-color: #8aa28c;
}
html.theme_green, .theme_green {
  /* --- H. Front page / boards list --- */
}
html.theme_green #divLatestPosts .latestPostCell, .theme_green #divLatestPosts .latestPostCell {
  background: #bcd0bd;
}
html.theme_green #divLatestImages img, .theme_green #divLatestImages img {
  border-color: #999;
}
html.theme_green #boardsCellHeader span, .theme_green #boardsCellHeader span {
  background: #bcd0bd;
  color: #20261f;
  border-color: #8aa28c;
}
html.theme_green .boardsCell:nth-of-type(2n+1) span, .theme_green .boardsCell:nth-of-type(2n+1) span {
  background-color: rgba(49, 112, 85, 0.12);
}
html.theme_green, .theme_green {
  /* --- I. Code highlighting (highlight.js — light green) --- */
}
html.theme_green .hljs, .theme_green .hljs {
  display: block;
  overflow-x: auto;
  background: #e0ebe1;
  color: #333;
  padding: 0.5em;
}
html.theme_green .hljs-comment, html.theme_green .hljs-quote, .theme_green .hljs-comment, .theme_green .hljs-quote {
  color: #8a9a8a;
}
html.theme_green .hljs-keyword, html.theme_green .hljs-selector-tag, .theme_green .hljs-keyword, .theme_green .hljs-selector-tag {
  color: #317055;
}
html.theme_green .hljs-string, html.theme_green .hljs-symbol, html.theme_green .hljs-bullet, html.theme_green .hljs-addition, .theme_green .hljs-string, .theme_green .hljs-symbol, .theme_green .hljs-bullet, .theme_green .hljs-addition {
  color: #2e8b57;
}
html.theme_green .hljs-number, html.theme_green .hljs-built_in, html.theme_green .hljs-literal, html.theme_green .hljs-type, html.theme_green .hljs-params, html.theme_green .hljs-meta, html.theme_green .hljs-link, html.theme_green .hljs-attribute, .theme_green .hljs-number, .theme_green .hljs-built_in, .theme_green .hljs-literal, .theme_green .hljs-type, .theme_green .hljs-params, .theme_green .hljs-meta, .theme_green .hljs-link, .theme_green .hljs-attribute {
  color: #b26a00;
}
html.theme_green .hljs-title, html.theme_green .hljs-section, .theme_green .hljs-title, .theme_green .hljs-section {
  color: #1f5c40;
}
html.theme_green .hljs-variable, html.theme_green .hljs-template-variable, html.theme_green .hljs-tag, html.theme_green .hljs-name, html.theme_green .hljs-selector-id, html.theme_green .hljs-selector-class, html.theme_green .hljs-regexp, html.theme_green .hljs-deletion, .theme_green .hljs-variable, .theme_green .hljs-template-variable, .theme_green .hljs-tag, .theme_green .hljs-name, .theme_green .hljs-selector-id, .theme_green .hljs-selector-class, .theme_green .hljs-regexp, .theme_green .hljs-deletion {
  color: #c0392b;
}
html.theme_green, .theme_green {
  /* --- J. Badges, indicators & misc --- */
}
html.theme_green .radiospan, .theme_green .radiospan {
  color: #fff;
  background-color: #d10000;
}
html.theme_green .dot, .theme_green .dot {
  background-color: orange;
}
html.theme_green .medals .text, .theme_green .medals .text {
  background-color: #317055;
  color: #fff;
}
html.theme_green .mobileAlert, .theme_green .mobileAlert {
  color: #d10000;
}
html.theme_green .linkFollow, .theme_green .linkFollow {
  color: #2e8b57;
}
html.theme_green .linkFollowAlt, .theme_green .linkFollowAlt {
  color: #cc3333;
}
html.theme_green .watchedNotification::before, .theme_green .watchedNotification::before {
  color: #cc3333;
}
html.theme_green #boardContentLinks, .theme_green #boardContentLinks {
  color: #54685a;
}
html.theme_green #reportActions, .theme_green #reportActions {
  background-color: #bcd0bd;
}
html.theme_green .contentAction, .theme_green .contentAction {
  background-color: #dde9de;
  border-color: #8aa28c;
}
html.theme_green #labelCaptchaId, .theme_green #labelCaptchaId {
  color: #ff0000;
}
html.theme_green #solved, .theme_green #solved {
  color: #2e8b57;
}
html.theme_green a, html.theme_green .reportdeletebuttons, .theme_green a, .theme_green .reportdeletebuttons {
  color: #1f5c40;
}
html.theme_green a:hover, .theme_green a:hover {
  color: #1d4a33;
}
html.theme_green h2 a:link, .theme_green h2 a:link {
  color: #fff;
}
html.theme_green h2 a:visited, .theme_green h2 a:visited {
  color: #bfe0cc;
}

html.theme_darkreader, .theme_darkreader {
  color-scheme: dark;
  background: rgb(34, 36, 38);
  color: #e8e6e3;
  /* ==========================================================================
     Dark Reader - Complete Theme (standardization pass 2026-08-17)
     Palette carried over from the original (Dark Reader export): gray canvas,
     navy headers/accents. Every colorable element in theme-inventory.md is
     now defined explicitly.
     ========================================================================== */
  /* Core palette */
  /* page background (frozen — CSP-hashed) */
  /* post cells / floating menus / hover */
  /* static panels / settings body */
  /* h2 / modal headers / form th */
  /* input fields */
  /* structural borders */
  /* soft borders (upload cells etc.) */
  /* omission labels / placeholders */
}
html.theme_darkreader, .theme_darkreader {
  background: rgb(34, 36, 38) none !important;
  color: #e8e6e3 !important;
}
html.theme_darkreader, .theme_darkreader {
  /* --- A. Canvas & page structure --- */
}
html.theme_darkreader body, .theme_darkreader body {
  background: rgb(34, 36, 38) !important;
  color: #e8e6e3;
}
html.theme_darkreader #footer, .theme_darkreader #footer {
  color: rgb(168, 160, 149);
}
html.theme_darkreader #news, .theme_darkreader #news {
  background: rgb(43, 47, 49);
  color: #e8e6e3;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader .hiddenThread, .theme_darkreader .hiddenThread {
  background-color: rgb(43, 47, 49);
  background-image: none;
  border-color: rgb(63, 65, 144);
}
html.theme_darkreader .kCard .kBody,
html.theme_darkreader #indexWrapper #indexLeft > div,
html.theme_darkreader #indexWrapper #indexRight > div,
html.theme_darkreader #subpageWrapper > div,
html.theme_darkreader #redirect > div, .theme_darkreader .kCard .kBody,
.theme_darkreader #indexWrapper #indexLeft > div,
.theme_darkreader #indexWrapper #indexRight > div,
.theme_darkreader #subpageWrapper > div,
.theme_darkreader #redirect > div {
  background-color: rgb(43, 47, 49);
  background-image: none;
  border-left-color: rgb(63, 65, 144);
  border-right-color: rgb(63, 65, 144);
  border-bottom-color: rgb(63, 65, 144);
}
html.theme_darkreader .mCard, .theme_darkreader .mCard {
  background-color: rgb(43, 47, 49);
}
html.theme_darkreader .mCard > h2, .theme_darkreader .mCard > h2 {
  background: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader h2, html.theme_darkreader h3, .theme_darkreader h2, .theme_darkreader h3 {
  color: #e8e6e3;
  background-color: rgb(39, 41, 90);
}
html.theme_darkreader div.titlebar, .theme_darkreader div.titlebar {
  background: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader #siteName, .theme_darkreader #siteName {
  color: rgb(121, 159, 225);
}
html.theme_darkreader, .theme_darkreader {
  /* main site title — theme's signature accent (was falling back to base body text) */
}
html.theme_darkreader #cookieBanner, .theme_darkreader #cookieBanner {
  background-color: rgb(43, 47, 49);
  border-bottom-color: rgb(72, 78, 81);
  color: #e8e6e3;
}
html.theme_darkreader .unimportant, html.theme_darkreader .unimportant *, .theme_darkreader .unimportant, .theme_darkreader .unimportant * {
  color: rgb(168, 160, 149) !important;
}
html.theme_darkreader progress, .theme_darkreader progress {
  background: rgb(43, 47, 49);
}
html.theme_darkreader progress::-webkit-progress-value, .theme_darkreader progress::-webkit-progress-value {
  background: rgb(121, 255, 255);
}
html.theme_darkreader progress::-moz-progress-bar, .theme_darkreader progress::-moz-progress-bar {
  background: rgb(121, 255, 255);
}
html.theme_darkreader *, .theme_darkreader * {
  scrollbar-color: #454a4d #202324;
}
html.theme_darkreader hr, .theme_darkreader hr {
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader ::selection, .theme_darkreader ::selection {
  background: rgb(121, 159, 225);
  color: rgb(34, 36, 38);
}
html.theme_darkreader, .theme_darkreader {
  /* --- B. Navigation & menus --- */
}
html.theme_darkreader #topNav, .theme_darkreader #topNav {
  background: transparent;
}
html.theme_darkreader #topNav.fixed, .theme_darkreader #topNav.fixed {
  position: fixed;
  background: rgb(34, 36, 38);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) !important;
}
html.theme_darkreader #topNav.active, .theme_darkreader #topNav.active {
  background: rgb(34, 36, 38);
}
html.theme_darkreader .navLinkSpan, .theme_darkreader .navLinkSpan {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .divPages, html.theme_darkreader #divPages, .theme_darkreader .divPages, .theme_darkreader #divPages {
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader .extraMenu a, .theme_darkreader .extraMenu a {
  color: #e8e6e3;
  text-decoration: none;
}
html.theme_darkreader .extraMenu div:hover, html.theme_darkreader .hideMenu div:hover, .theme_darkreader .extraMenu div:hover, .theme_darkreader .hideMenu div:hover {
  background-color: rgb(43, 47, 49);
  background-image: none;
  color: #e8e6e3;
}
html.theme_darkreader .extraMenu, html.theme_darkreader .hideMenu, .theme_darkreader .extraMenu, .theme_darkreader .hideMenu {
  border-color: rgb(63, 65, 144);
}
html.theme_darkreader, .theme_darkreader {
  /* --- C. Post cells & thread view --- */
}
html.theme_darkreader .floatingMenu, html.theme_darkreader .innerPost, html.theme_darkreader .markedPost, html.theme_darkreader .topBoards a, .theme_darkreader .floatingMenu, .theme_darkreader .innerPost, .theme_darkreader .markedPost, .theme_darkreader .topBoards a {
  background-color: rgb(50, 50, 83);
  background-image: none;
}
html.theme_darkreader #watchedMenu .watchedCellLabel a, .theme_darkreader #watchedMenu .watchedCellLabel a {
  color: rgb(121, 159, 225);
}
html.theme_darkreader, .theme_darkreader {
  /* watched-threads menu links */
}
html.theme_darkreader .markedPost, html.theme_darkreader div.postCell:target .innerPost, .theme_darkreader .markedPost, .theme_darkreader div.postCell:target .innerPost {
  outline-color: rgb(121, 159, 225);
}
html.theme_darkreader .quoteTooltip > div, .theme_darkreader .quoteTooltip > div {
  border-color: rgb(63, 65, 144);
}
html.theme_darkreader .uploadDetails, .theme_darkreader .uploadDetails {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .innerOP .collapseLabel, html.theme_darkreader .innerOP .expandLabel, .theme_darkreader .innerOP .collapseLabel, .theme_darkreader .innerOP .expandLabel {
  background-color: rgb(34, 36, 38);
  background-image: none;
  color: rgb(168, 160, 149);
}
html.theme_darkreader .innerPost .collapseLabel, html.theme_darkreader .innerPost .expandLabel,
html.theme_darkreader .markedPost .collapseLabel, html.theme_darkreader .markedPost .expandLabel, .theme_darkreader .innerPost .collapseLabel, .theme_darkreader .innerPost .expandLabel,
.theme_darkreader .markedPost .collapseLabel, .theme_darkreader .markedPost .expandLabel {
  background-color: rgb(50, 50, 83);
  background-image: none;
  color: #e8e6e3;
}
html.theme_darkreader .innerPost .bottomGradient, .theme_darkreader .innerPost .bottomGradient {
  background-color: rgba(0, 0, 0, 0);
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgb(50, 50, 83));
}
html.theme_darkreader .innerOP .bottomGradient, .theme_darkreader .innerOP .bottomGradient {
  background-color: rgba(0, 0, 0, 0);
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgb(34, 36, 38));
}
html.theme_darkreader .innerPost .panelUploads .uploadCell, html.theme_darkreader .markedPost .panelUploads .uploadCell, .theme_darkreader .innerPost .panelUploads .uploadCell, .theme_darkreader .markedPost .panelUploads .uploadCell {
  background-color: rgb(50, 50, 83);
  background-image: none;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader .innerOP .panelUploads .uploadCell,
html.theme_darkreader #selectedDiv .selectedCell,
html.theme_darkreader #selectedDivQr .selectedCell, .theme_darkreader .innerOP .panelUploads .uploadCell,
.theme_darkreader #selectedDiv .selectedCell,
.theme_darkreader #selectedDivQr .selectedCell {
  background-color: rgb(43, 47, 49);
  background-image: none;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader, .theme_darkreader {
  /* Badge backgrounds are inline per-poster hashes (any hue — light yellow-greens,
     pinks, tans). Light fill + solid dark outline stays readable on all of them;
     the old light-gray-with-no-shadow died on green/pink/tan badges. */
}
html.theme_darkreader .labelId, .theme_darkreader .labelId {
  color: #fff;
  opacity: 0.85;
}
html.theme_darkreader, .theme_darkreader {
  /* outline inherited from base _posting.scss */
}
html.theme_darkreader .labelCreated, html.theme_darkreader .relativeTime, html.theme_darkreader .spanId, .theme_darkreader .labelCreated, .theme_darkreader .relativeTime, .theme_darkreader .spanId {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .linkName, .theme_darkreader .linkName {
  color: rgb(92, 136, 214);
  font-weight: bold;
}
html.theme_darkreader .linkName:hover, .theme_darkreader .linkName:hover {
  color: rgb(163, 192, 240);
}
html.theme_darkreader .noEmailName, html.theme_darkreader .noEmailName:hover, .theme_darkreader .noEmailName, .theme_darkreader .noEmailName:hover {
  color: rgb(92, 136, 214);
}
html.theme_darkreader .linkQuote, html.theme_darkreader .linkSelf, .theme_darkreader .linkQuote, .theme_darkreader .linkSelf {
  color: #e8e6e3 !important;
}
html.theme_darkreader .linkQuote:hover, html.theme_darkreader .linkSelf:hover, .theme_darkreader .linkQuote:hover, .theme_darkreader .linkSelf:hover {
  color: rgb(163, 192, 240) !important;
}
html.theme_darkreader .labelSubject, .theme_darkreader .labelSubject {
  color: rgb(209, 71, 71);
}
html.theme_darkreader .labelRole, .theme_darkreader .labelRole {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .sage, html.theme_darkreader .bumpLockIndicator, .theme_darkreader .sage, .theme_darkreader .bumpLockIndicator {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .divBanMessage, .theme_darkreader .divBanMessage {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .contentOmissionIndicator, .theme_darkreader .contentOmissionIndicator {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .labelOmission, .theme_darkreader .labelOmission {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .panelBacklinks a, .theme_darkreader .panelBacklinks a {
  color: rgb(168, 160, 149);
  font-style: normal;
}
html.theme_darkreader .panelBacklinks a:hover, .theme_darkreader .panelBacklinks a:hover {
  color: rgb(121, 159, 225);
}
html.theme_darkreader .quoteLink, html.theme_darkreader .quoteLink:hover, .theme_darkreader .quoteLink, .theme_darkreader .quoteLink:hover {
  color: rgb(245, 84, 89);
}
html.theme_darkreader, .theme_darkreader {
  /* --- D. Chan markup & spoilers --- */
}
html.theme_darkreader .greenText, html.theme_darkreader .quote, .theme_darkreader .greenText, .theme_darkreader .quote {
  color: rgb(121, 255, 255);
}
html.theme_darkreader .redText, .theme_darkreader .redText {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .orangeText, .theme_darkreader .orangeText {
  color: rgb(255, 107, 47);
}
html.theme_darkreader .brackets::after, html.theme_darkreader .brackets::before, .theme_darkreader .brackets::after, .theme_darkreader .brackets::before {
  color: #e8e6e3;
}
html.theme_darkreader span.spoiler, .theme_darkreader span.spoiler {
  background: rgb(43, 47, 49);
  color: rgb(43, 47, 49);
}
html.theme_darkreader span.spoiler:hover, .theme_darkreader span.spoiler:hover {
  color: #e8e6e3;
}
html.theme_darkreader span.spoiler > .greenText, .theme_darkreader span.spoiler > .greenText {
  color: rgb(43, 47, 49) !important;
}
html.theme_darkreader span.spoiler > .orangeText, .theme_darkreader span.spoiler > .orangeText {
  color: rgb(43, 47, 49) !important;
}
html.theme_darkreader span.spoiler > a, .theme_darkreader span.spoiler > a {
  color: rgb(43, 47, 49) !important;
}
html.theme_darkreader span.spoiler:hover > .greenText, .theme_darkreader span.spoiler:hover > .greenText {
  color: rgb(121, 255, 255) !important;
}
html.theme_darkreader span.spoiler:hover > .orangeText, .theme_darkreader span.spoiler:hover > .orangeText {
  color: rgb(255, 107, 47) !important;
}
html.theme_darkreader span.spoiler:hover > a, .theme_darkreader span.spoiler:hover > a {
  color: rgb(121, 159, 225) !important;
}
html.theme_darkreader, .theme_darkreader {
  /* --- E. Posting form (legacy table + .post-card) --- */
}
html.theme_darkreader #postingForm th, html.theme_darkreader .modalTableBody th, .theme_darkreader #postingForm th, .theme_darkreader .modalTableBody th {
  color: #e8e6e3;
  background-color: rgb(39, 41, 90);
}
html.theme_darkreader input, html.theme_darkreader textarea, html.theme_darkreader select, html.theme_darkreader button, .theme_darkreader input, .theme_darkreader textarea, .theme_darkreader select, .theme_darkreader button {
  background-color: #181a1b;
  border-color: rgb(72, 78, 81);
  color: #e8e6e3;
}
html.theme_darkreader input::placeholder, html.theme_darkreader textarea::placeholder, .theme_darkreader input::placeholder, .theme_darkreader textarea::placeholder {
  color: rgb(168, 160, 149) !important;
  opacity: 1 !important;
}
html.theme_darkreader .postingInput, .theme_darkreader .postingInput {
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader .dropzone, .theme_darkreader .dropzone {
  color: rgba(232, 230, 227, 0.5);
  border-color: rgba(99, 92, 81, 0.4);
  background-color: rgba(55, 60, 62, 0.5);
}
html.theme_darkreader .dropzone:hover, .theme_darkreader .dropzone:hover {
  color: #e8e6e3;
  border-color: rgb(63, 65, 144);
}
html.theme_darkreader .dragAndDropDiv, html.theme_darkreader .dragAndDropThumb, .theme_darkreader .dragAndDropDiv, .theme_darkreader .dragAndDropThumb {
  color: #e8e6e3;
  background-color: rgba(55, 60, 62, 0.5);
}
html.theme_darkreader .removeButton, .theme_darkreader .removeButton {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .removeButton:hover, .theme_darkreader .removeButton:hover {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .fileBrowser, .theme_darkreader .fileBrowser {
  background: none;
  color: #e8e6e3;
}
html.theme_darkreader, .theme_darkreader {
  /* .post-card (redesigned 2026-08-16) */
}
html.theme_darkreader .post-card, .theme_darkreader .post-card {
  background: rgb(43, 47, 49);
  border-color: rgb(72, 78, 81);
  color: #e8e6e3;
}
html.theme_darkreader .post-card .postingInput, html.theme_darkreader .post-card textarea, html.theme_darkreader .post-card select, .theme_darkreader .post-card .postingInput, .theme_darkreader .post-card textarea, .theme_darkreader .post-card select {
  background-color: #181a1b;
  border-color: rgb(72, 78, 81);
  color: #e8e6e3;
}
html.theme_darkreader .post-card .postingInput:focus, html.theme_darkreader .post-card textarea:focus, html.theme_darkreader .post-card select:focus, .theme_darkreader .post-card .postingInput:focus, .theme_darkreader .post-card textarea:focus, .theme_darkreader .post-card select:focus {
  border-color: rgb(121, 159, 225);
}
html.theme_darkreader .post-card input::placeholder, html.theme_darkreader .post-card textarea::placeholder, .theme_darkreader .post-card input::placeholder, .theme_darkreader .post-card textarea::placeholder {
  color: rgb(168, 160, 149) !important;
  opacity: 1 !important;
}
html.theme_darkreader .post-card .dropzone, .theme_darkreader .post-card .dropzone {
  border-color: rgb(72, 78, 81);
  color: rgba(232, 230, 227, 0.5);
  background: transparent;
}
html.theme_darkreader .post-card .dropzone:hover, .theme_darkreader .post-card .dropzone:hover {
  border-color: rgb(121, 159, 225);
  color: #e8e6e3;
}
html.theme_darkreader .post-card .toggle-badge, .theme_darkreader .post-card .toggle-badge {
  background: rgb(50, 50, 83);
  color: #e8e6e3;
}
html.theme_darkreader .post-card .advanced-drawer, .theme_darkreader .post-card .advanced-drawer {
  background: #181a1b;
}
html.theme_darkreader .post-card .drawer-toggle, .theme_darkreader .post-card .drawer-toggle {
  color: rgb(121, 159, 225);
}
html.theme_darkreader .post-card .btn-submit, .theme_darkreader .post-card .btn-submit {
  background: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader .post-card .btn-submit:hover, .theme_darkreader .post-card .btn-submit:hover {
  background: rgb(63, 65, 144);
}
html.theme_darkreader .post-card .post-rules-panel, .theme_darkreader .post-card .post-rules-panel {
  background: rgb(43, 47, 49);
  border-color: rgb(72, 78, 81);
  color: rgb(168, 160, 149);
}
html.theme_darkreader .post-card .post-rules-panel a, .theme_darkreader .post-card .post-rules-panel a {
  color: rgb(121, 159, 225);
}
html.theme_darkreader .post-card .rules-line, .theme_darkreader .post-card .rules-line {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .post-card .rules-line a, .theme_darkreader .post-card .rules-line a {
  color: rgb(121, 159, 225);
}
html.theme_darkreader .post-card .captchaImage, .theme_darkreader .post-card .captchaImage {
  background: rgb(43, 47, 49);
}
html.theme_darkreader .post-card .captchaTimer, .theme_darkreader .post-card .captchaTimer {
  color: rgb(168, 160, 149);
  opacity: 1;
}
html.theme_darkreader .post-card .no-cookie-link, .theme_darkreader .post-card .no-cookie-link {
  color: rgb(121, 159, 225);
}
html.theme_darkreader, .theme_darkreader {
  /* --- F. Modals & settings menu --- */
}
html.theme_darkreader .modalPanel, .theme_darkreader .modalPanel {
  background: rgba(0, 0, 0, 0.7);
}
html.theme_darkreader #quick-reply table, .theme_darkreader #quick-reply table {
  background-color: rgb(34, 36, 38);
  outline-color: rgb(63, 65, 144);
}
html.theme_darkreader #quick-reply td.recaptcha span, .theme_darkreader #quick-reply td.recaptcha span {
  background: #181a1b;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader .modalDecorationPanel, .theme_darkreader .modalDecorationPanel {
  background-color: rgb(50, 50, 83);
  background-image: none;
}
html.theme_darkreader .modalHeader, html.theme_darkreader #quick-reply .handle, .theme_darkreader .modalHeader, .theme_darkreader #quick-reply .handle {
  background-color: rgb(39, 41, 90);
  background-image: none;
  color: #e8e6e3;
}
html.theme_darkreader .modalInnerDecorationPanel, html.theme_darkreader .post-table, .theme_darkreader .modalInnerDecorationPanel, .theme_darkreader .post-table {
  background-color: rgb(34, 36, 38);
}
html.theme_darkreader .captchaTimer, .theme_darkreader .captchaTimer {
  background-color: rgb(34, 36, 38);
  background-image: none;
  border-color: rgb(140, 130, 115);
  color: rgb(168, 160, 149);
}
html.theme_darkreader .captchaImage, .theme_darkreader .captchaImage {
  background-color: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader, .theme_darkreader {
  /* Settings menu — full color table (2026-08-17): base _settingsMenu.scss is
     dark-plum; now every surface uses the Dark Reader palette (same surface set as green). */
}
html.theme_darkreader #settingsMenu, .theme_darkreader #settingsMenu {
  background-color: rgb(34, 36, 38);
  background-image: none;
  color: #e8e6e3;
  border-color: rgb(63, 65, 144);
}
html.theme_darkreader #settingsMenu > .header, .theme_darkreader #settingsMenu > .header {
  background-color: rgb(39, 41, 90);
  background-image: none;
  color: #e8e6e3;
  border-bottom-color: rgb(63, 65, 144);
}
html.theme_darkreader #settingsMenu > div:nth-child(3), .theme_darkreader #settingsMenu > div:nth-child(3) {
  border-left-color: rgb(63, 65, 144);
  background-color: rgb(34, 36, 38);
  background-image: none;
  border-bottom-color: rgb(63, 65, 144);
  border-right-color: rgb(63, 65, 144);
}
html.theme_darkreader #settingsMenu > div:nth-child(4), .theme_darkreader #settingsMenu > div:nth-child(4) {
  border-left-color: rgb(63, 65, 144);
  background-color: rgb(34, 36, 38);
  background-image: none;
  border-top-color: rgb(63, 65, 144);
  border-right-color: rgb(63, 65, 144);
}
html.theme_darkreader #settingsMenu .settingsTab, .theme_darkreader #settingsMenu .settingsTab {
  color: rgb(168, 160, 149);
}
html.theme_darkreader #settingsMenu .settingsTab:hover, html.theme_darkreader #settingsMenu .settingsTab:focus, .theme_darkreader #settingsMenu .settingsTab:hover, .theme_darkreader #settingsMenu .settingsTab:focus {
  background-color: rgb(50, 50, 83);
  color: #e8e6e3;
}
html.theme_darkreader #settingsMenu #selectedTab, .theme_darkreader #settingsMenu #selectedTab {
  background-color: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader #settingsMenu .settingsSectionTitle, .theme_darkreader #settingsMenu .settingsSectionTitle {
  color: rgb(168, 160, 149);
  border-bottom-color: rgb(72, 78, 81);
}
html.theme_darkreader #settingsMenu .settingName, .theme_darkreader #settingsMenu .settingName {
  color: #e8e6e3;
}
html.theme_darkreader #settingsMenu .settingDesc, .theme_darkreader #settingsMenu .settingDesc {
  color: rgb(168, 160, 149);
}
html.theme_darkreader #settingsMenu .settingsCheckbox, .theme_darkreader #settingsMenu .settingsCheckbox {
  accent-color: rgb(121, 159, 225);
}
html.theme_darkreader #settingsMenu .saveButton, .theme_darkreader #settingsMenu .saveButton {
  background-color: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader #settingsMenu .saveButton:hover, .theme_darkreader #settingsMenu .saveButton:hover {
  background-color: rgb(63, 65, 144);
}
html.theme_darkreader #settingsMenu #newFilterPanel select, html.theme_darkreader #settingsMenu #newFilterPanel input[type=text], .theme_darkreader #settingsMenu #newFilterPanel select, .theme_darkreader #settingsMenu #newFilterPanel input[type=text] {
  background-color: #181a1b;
  color: #e8e6e3;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader #settingsMenu #newFilterPanel button, .theme_darkreader #settingsMenu #newFilterPanel button {
  background-color: rgb(50, 50, 83);
  color: #e8e6e3;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader #settingsMenu #newFilterPanel button:hover, .theme_darkreader #settingsMenu #newFilterPanel button:hover {
  background-color: rgb(39, 41, 90);
}
html.theme_darkreader #settingsMenu .existingFilterTypeLabel, html.theme_darkreader #settingsMenu .existingFilterContentLabel, .theme_darkreader #settingsMenu .existingFilterTypeLabel, .theme_darkreader #settingsMenu .existingFilterContentLabel {
  color: rgb(168, 160, 149);
}
html.theme_darkreader #settingsMenu .filterDeleteButton, .theme_darkreader #settingsMenu .filterDeleteButton {
  color: rgb(168, 160, 149);
}
html.theme_darkreader #settingsMenu .filterDeleteButton:hover, .theme_darkreader #settingsMenu .filterDeleteButton:hover {
  color: rgb(245, 84, 89);
}
html.theme_darkreader #settingsMenu #themeSelector, html.theme_darkreader #settingsMenu #cssInput, .theme_darkreader #settingsMenu #themeSelector, .theme_darkreader #settingsMenu #cssInput {
  background-color: #181a1b;
  color: #e8e6e3;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader #closeSettingsMenuButton, .theme_darkreader #closeSettingsMenuButton {
  color: #e8e6e3;
}
html.theme_darkreader .appealForm table tr th, html.theme_darkreader table.modInfo tr th, .theme_darkreader .appealForm table tr th, .theme_darkreader table.modInfo tr th {
  background: rgb(39, 41, 90);
  color: #e8e6e3;
}
html.theme_darkreader, .theme_darkreader {
  /* --- G. Catalog view --- */
}
html.theme_darkreader .catalogCell, .theme_darkreader .catalogCell {
  background: rgba(255, 255, 255, 0.04);
}
html.theme_darkreader .catalogCell:hover, .theme_darkreader .catalogCell:hover {
  background-color: rgb(50, 50, 83);
  background-image: none;
}
html.theme_darkreader .catalogCell:focus .divMessage, html.theme_darkreader .catalogCell:hover .divMessage, .theme_darkreader .catalogCell:focus .divMessage, .theme_darkreader .catalogCell:hover .divMessage {
  background-color: rgb(50, 50, 83);
  background-image: none;
  outline-color: rgb(50, 50, 83);
}
html.theme_darkreader .catalogCell .labelSubject, .theme_darkreader .catalogCell .labelSubject {
  color: rgb(209, 71, 71);
}
html.theme_darkreader .threadStats, .theme_darkreader .threadStats {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .linkThumb img, .theme_darkreader .linkThumb img {
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader, .theme_darkreader {
  /* --- H. Front page / boards list --- */
}
html.theme_darkreader #divLatestPosts .latestPostCell, .theme_darkreader #divLatestPosts .latestPostCell {
  background-color: rgb(50, 50, 83);
  background-image: none;
}
html.theme_darkreader #divLatestImages img, .theme_darkreader #divLatestImages img {
  border-color: rgb(140, 130, 115);
}
html.theme_darkreader .boardlist, .theme_darkreader .boardlist {
  background: rgb(50, 50, 83);
}
html.theme_darkreader ul.boardlist li:hover, html.theme_darkreader ul.toplist li:hover, .theme_darkreader ul.boardlist li:hover, .theme_darkreader ul.toplist li:hover {
  background-color: rgb(43, 47, 49);
  background-image: none;
}
html.theme_darkreader #boardsCellHeader span, .theme_darkreader #boardsCellHeader span {
  background: rgb(43, 47, 49);
  color: #e8e6e3;
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader .boardsCell:nth-of-type(2n+1) span, .theme_darkreader .boardsCell:nth-of-type(2n+1) span {
  background-color: rgba(255, 255, 255, 0.04);
}
html.theme_darkreader, .theme_darkreader {
  /* --- I. Code highlighting (highlight.js) --- */
}
html.theme_darkreader .hljs, .theme_darkreader .hljs {
  display: block;
  overflow-x: auto;
  background: #181a1b;
  color: #e8e6e3;
  padding: 0.5em;
}
html.theme_darkreader .hljs-comment, html.theme_darkreader .hljs-quote, .theme_darkreader .hljs-comment, .theme_darkreader .hljs-quote {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .hljs-keyword, html.theme_darkreader .hljs-selector-tag, .theme_darkreader .hljs-keyword, .theme_darkreader .hljs-selector-tag {
  color: rgb(163, 192, 240);
}
html.theme_darkreader .hljs-string, html.theme_darkreader .hljs-symbol, html.theme_darkreader .hljs-bullet, html.theme_darkreader .hljs-addition, .theme_darkreader .hljs-string, .theme_darkreader .hljs-symbol, .theme_darkreader .hljs-bullet, .theme_darkreader .hljs-addition {
  color: rgb(121, 255, 255);
}
html.theme_darkreader .hljs-number, html.theme_darkreader .hljs-built_in, html.theme_darkreader .hljs-literal, html.theme_darkreader .hljs-type, html.theme_darkreader .hljs-params, html.theme_darkreader .hljs-meta, html.theme_darkreader .hljs-link, html.theme_darkreader .hljs-attribute, .theme_darkreader .hljs-number, .theme_darkreader .hljs-built_in, .theme_darkreader .hljs-literal, .theme_darkreader .hljs-type, .theme_darkreader .hljs-params, .theme_darkreader .hljs-meta, .theme_darkreader .hljs-link, .theme_darkreader .hljs-attribute {
  color: rgb(255, 107, 47);
}
html.theme_darkreader .hljs-title, html.theme_darkreader .hljs-section, .theme_darkreader .hljs-title, .theme_darkreader .hljs-section {
  color: rgb(92, 136, 214);
}
html.theme_darkreader .hljs-variable, html.theme_darkreader .hljs-template-variable, html.theme_darkreader .hljs-tag, html.theme_darkreader .hljs-name, html.theme_darkreader .hljs-selector-id, html.theme_darkreader .hljs-selector-class, html.theme_darkreader .hljs-regexp, html.theme_darkreader .hljs-deletion, .theme_darkreader .hljs-variable, .theme_darkreader .hljs-template-variable, .theme_darkreader .hljs-tag, .theme_darkreader .hljs-name, .theme_darkreader .hljs-selector-id, .theme_darkreader .hljs-selector-class, .theme_darkreader .hljs-regexp, .theme_darkreader .hljs-deletion {
  color: rgb(245, 84, 89);
}
html.theme_darkreader, .theme_darkreader {
  /* --- J. Badges, indicators & misc --- */
}
html.theme_darkreader .radiospan, .theme_darkreader .radiospan {
  color: #fff;
  background-color: rgb(245, 84, 89);
}
html.theme_darkreader .dot, .theme_darkreader .dot {
  background-color: rgb(255, 107, 47);
}
html.theme_darkreader .medals .text, .theme_darkreader .medals .text {
  background-color: rgb(39, 41, 90);
  color: #fff;
}
html.theme_darkreader .mobileAlert, .theme_darkreader .mobileAlert {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .linkFollow, .theme_darkreader .linkFollow {
  color: rgb(121, 255, 255);
}
html.theme_darkreader .linkFollowAlt, .theme_darkreader .linkFollowAlt {
  color: rgb(245, 84, 89);
}
html.theme_darkreader .watchedNotification::before, .theme_darkreader .watchedNotification::before {
  color: rgb(245, 84, 89);
}
html.theme_darkreader #boardContentLinks, .theme_darkreader #boardContentLinks {
  color: rgb(168, 160, 149);
}
html.theme_darkreader #reportActions, .theme_darkreader #reportActions {
  background-color: rgb(43, 47, 49);
}
html.theme_darkreader .contentAction, .theme_darkreader .contentAction {
  background-color: rgb(43, 47, 49);
  border-color: rgb(72, 78, 81);
}
html.theme_darkreader #labelCaptchaId, .theme_darkreader #labelCaptchaId {
  color: rgb(245, 84, 89);
}
html.theme_darkreader #solved, .theme_darkreader #solved {
  color: rgb(121, 255, 255);
}
html.theme_darkreader a, html.theme_darkreader .reportdeletebuttons, .theme_darkreader a, .theme_darkreader .reportdeletebuttons {
  color: rgb(121, 159, 225);
}
html.theme_darkreader a:hover, .theme_darkreader a:hover {
  color: rgb(163, 192, 240);
}
html.theme_darkreader h2 a:link, .theme_darkreader h2 a:link {
  color: #e8e6e3;
}
html.theme_darkreader h2 a:visited, .theme_darkreader h2 a:visited {
  color: rgb(168, 160, 149);
}
html.theme_darkreader .handle a, .theme_darkreader .handle a {
  color: #e8e6e3;
}

html.theme_yotsubaB, .theme_yotsubaB {
  color-scheme: light;
  font-family: arial, helvetica, sans-serif;
  background: #eef2ff url(/.static/images/7pornw.png) top center repeat-x !important;
  /* NO root font-size override: the old `font-size: 10pt !important` shrank the
     rem base to 13.3px, silently scaling every rem-based size (mobile nav glyphs,
     padding, selects) ~17% smaller than all other themes. Removed 2026-08-19 so
     yotsubaB uses the same 16px root as the rest of the theme set. */
  /* ==========================================================================
     Kohlchan-Yotsuba-B - Complete Theme (standardization pass 2026-08-17)
     Light legacy blue/lavender look. Original colors carried over; every
     colorable element in theme-inventory.md is now defined explicitly.
     Non-color identity (Tahoma titles, arrow margins, font sizes) kept below.
     ========================================================================== */
  /* Core palette */
  /* page background (frozen — CSP-hashed) + 7pornw.png strip from wrapper */
  /* post cells / panels */
  /* structural borders */
  /* form th / modal headers (purple) */
  /* h2 "mode" banner (orange — original identity) */
}
html.theme_yotsubaB, .theme_yotsubaB {
  background: #eef2ff none !important;
  color: #000000 !important;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- A. Canvas & page structure --- */
}
html.theme_yotsubaB body, .theme_yotsubaB body {
  background: #eef2ff !important;
  color: #000000;
}
html.theme_yotsubaB #footer, .theme_yotsubaB #footer {
  color: #555;
}
html.theme_yotsubaB #news, .theme_yotsubaB #news {
  background: #D6DAF0;
  border-color: #B7C5D9;
  color: #000000;
}
html.theme_yotsubaB .hiddenThread, .theme_yotsubaB .hiddenThread {
  background: #D6DAF0;
  border-color: #B7C5D9;
}
html.theme_yotsubaB .kCard .kBody,
html.theme_yotsubaB #indexWrapper #indexLeft > div,
html.theme_yotsubaB #indexWrapper #indexRight > div,
html.theme_yotsubaB #subpageWrapper > div,
html.theme_yotsubaB #redirect > div, .theme_yotsubaB .kCard .kBody,
.theme_yotsubaB #indexWrapper #indexLeft > div,
.theme_yotsubaB #indexWrapper #indexRight > div,
.theme_yotsubaB #subpageWrapper > div,
.theme_yotsubaB #redirect > div {
  background-color: #D6DAF0;
  border-left-color: #B7C5D9;
  border-right-color: #B7C5D9;
  border-bottom-color: #B7C5D9;
}
html.theme_yotsubaB .mCard, .theme_yotsubaB .mCard {
  background-color: #D6DAF0;
}
html.theme_yotsubaB .mCard > h2, .theme_yotsubaB .mCard > h2 {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB h2, .theme_yotsubaB h2 {
  background-color: #E04000;
  color: #fff;
}
html.theme_yotsubaB h3, .theme_yotsubaB h3 {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB div.titlebar, .theme_yotsubaB div.titlebar {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB #cookieBanner, .theme_yotsubaB #cookieBanner {
  background-color: #D6DAF0;
  border-bottom-color: #B7C5D9;
  color: #000000;
}
html.theme_yotsubaB .unimportant, html.theme_yotsubaB .unimportant *, .theme_yotsubaB .unimportant, .theme_yotsubaB .unimportant * {
  color: #888 !important;
}
html.theme_yotsubaB progress, .theme_yotsubaB progress {
  background: #eef2ff;
}
html.theme_yotsubaB progress::-webkit-progress-value, .theme_yotsubaB progress::-webkit-progress-value {
  background: #789922;
}
html.theme_yotsubaB progress::-moz-progress-bar, .theme_yotsubaB progress::-moz-progress-bar {
  background: #789922;
}
html.theme_yotsubaB *, .theme_yotsubaB * {
  scrollbar-color: #b7c5d9 #eef2ff;
}
html.theme_yotsubaB hr, .theme_yotsubaB hr {
  border-top: transparent;
  border-color: #B7C5D9 !important;
}
html.theme_yotsubaB ::selection, .theme_yotsubaB ::selection {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- B. Navigation & menus --- */
}
html.theme_yotsubaB #topNav, .theme_yotsubaB #topNav {
  box-shadow: none;
  background: transparent;
}
html.theme_yotsubaB #topNav.fixed, html.theme_yotsubaB #topNav.active, .theme_yotsubaB #topNav.fixed, .theme_yotsubaB #topNav.active {
  background: #eef2ff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
html.theme_yotsubaB .navLinkSpan, .theme_yotsubaB .navLinkSpan {
  color: #34345c;
}
html.theme_yotsubaB .divPages, html.theme_yotsubaB #divPages, .theme_yotsubaB .divPages, .theme_yotsubaB #divPages {
  border-color: #B7C5D9;
}
html.theme_yotsubaB .extraMenu a, .theme_yotsubaB .extraMenu a {
  text-decoration: none;
  color: #34345c !important;
}
html.theme_yotsubaB .extraMenu div:hover, html.theme_yotsubaB .hideMenu div:hover, .theme_yotsubaB .extraMenu div:hover, .theme_yotsubaB .hideMenu div:hover {
  background: #D6DAF0;
  color: #000;
}
html.theme_yotsubaB .extraMenu, html.theme_yotsubaB .hideMenu, .theme_yotsubaB .extraMenu, .theme_yotsubaB .hideMenu {
  border-color: #000;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- C. Post cells & thread view --- */
}
html.theme_yotsubaB .innerPost, .theme_yotsubaB .innerPost {
  background-color: #D6DAF0; /* replies */
  border-right: 1px solid #B7C5D9;
  border-bottom: 1px solid #B7C5D9;
}
html.theme_yotsubaB .markedPost, .theme_yotsubaB .markedPost {
  border-top: none;
  border-left: none;
  border-right: 1px solid #B7C5D9;
  border-bottom: 1px solid #B7C5D9;
  background-color: #D6BAD0;
}
html.theme_yotsubaB .topBoards a, html.theme_yotsubaB .floatingMenu, .theme_yotsubaB .topBoards a, .theme_yotsubaB .floatingMenu {
  background: #D6DAF0;
}
html.theme_yotsubaB .floatingMenu, .theme_yotsubaB .floatingMenu {
  border: 1px solid #000 !important;
}
html.theme_yotsubaB #watchedMenu .watchedCellLabel a, .theme_yotsubaB #watchedMenu .watchedCellLabel a {
  color: #34345c;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* watched-threads menu links */
}
html.theme_yotsubaB .markedPost, html.theme_yotsubaB div.postCell:target .innerPost, .theme_yotsubaB .markedPost, .theme_yotsubaB div.postCell:target .innerPost {
  outline-color: #34345c;
}
html.theme_yotsubaB .quoteTooltip > div, .theme_yotsubaB .quoteTooltip > div {
  border-color: #34345c;
}
html.theme_yotsubaB .uploadDetails, .theme_yotsubaB .uploadDetails {
  background-color: transparent !important;
  color: #333;
}
html.theme_yotsubaB .innerPost .expandLabel, html.theme_yotsubaB .innerPost .collapseLabel, .theme_yotsubaB .innerPost .expandLabel, .theme_yotsubaB .innerPost .collapseLabel {
  background: #D6DAF0;
  color: #333;
}
html.theme_yotsubaB .markedPost .expandLabel, html.theme_yotsubaB .markedPost .collapseLabel, .theme_yotsubaB .markedPost .expandLabel, .theme_yotsubaB .markedPost .collapseLabel {
  background: #D6BAD0;
  color: #333;
}
html.theme_yotsubaB .innerOP .expandLabel, html.theme_yotsubaB .innerOP .collapseLabel, .theme_yotsubaB .innerOP .expandLabel, .theme_yotsubaB .innerOP .collapseLabel {
  background: #eef2ff;
  color: #555;
}
html.theme_yotsubaB .innerPost .bottomGradient, .theme_yotsubaB .innerPost .bottomGradient {
  background: linear-gradient(transparent, #D6DAF0);
}
html.theme_yotsubaB .innerOP .bottomGradient, .theme_yotsubaB .innerOP .bottomGradient {
  background: linear-gradient(transparent, #eef2ff);
}
html.theme_yotsubaB .innerPost .panelUploads .uploadCell,
html.theme_yotsubaB .markedPost .panelUploads .uploadCell, .theme_yotsubaB .innerPost .panelUploads .uploadCell,
.theme_yotsubaB .markedPost .panelUploads .uploadCell {
  float: left;
  margin: 5px 20px 20px 5px;
  background: transparent;
  border: none;
  text-align: left;
  display: inline-block;
  width: auto;
}
html.theme_yotsubaB .innerOP .panelUploads .uploadCell,
html.theme_yotsubaB #selectedDiv .selectedCell,
html.theme_yotsubaB #selectedDivQr .selectedCell, .theme_yotsubaB .innerOP .panelUploads .uploadCell,
.theme_yotsubaB #selectedDiv .selectedCell,
.theme_yotsubaB #selectedDivQr .selectedCell {
  background: #D6DAF0;
  border-color: #B7C5D9;
}
html.theme_yotsubaB .labelId, .theme_yotsubaB .labelId {
  color: #fff;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* outline inherited from base _posting.scss */
}
html.theme_yotsubaB .labelCreated, html.theme_yotsubaB .relativeTime, html.theme_yotsubaB .spanId, .theme_yotsubaB .labelCreated, .theme_yotsubaB .relativeTime, .theme_yotsubaB .spanId {
  color: #666;
}
html.theme_yotsubaB .linkName, html.theme_yotsubaB .linkName:hover, .theme_yotsubaB .linkName, .theme_yotsubaB .linkName:hover {
  color: #117743;
  font-weight: 700 !important;
}
html.theme_yotsubaB .noEmailName, html.theme_yotsubaB .noEmailName:hover, .theme_yotsubaB .noEmailName, .theme_yotsubaB .noEmailName:hover {
  color: #117743;
}
html.theme_yotsubaB .linkQuote, html.theme_yotsubaB .linkSelf, .theme_yotsubaB .linkQuote, .theme_yotsubaB .linkSelf {
  color: #000 !important;
}
html.theme_yotsubaB .linkQuote:hover, html.theme_yotsubaB .linkSelf:hover, .theme_yotsubaB .linkQuote:hover, .theme_yotsubaB .linkSelf:hover {
  font-weight: normal;
  color: #d00 !important;
}
html.theme_yotsubaB .labelSubject, .theme_yotsubaB .labelSubject {
  color: #0f0c5d;
  font-size: inherit !important;
}
html.theme_yotsubaB .labelRole, .theme_yotsubaB .labelRole {
  color: #ff0000;
}
html.theme_yotsubaB .sage, html.theme_yotsubaB .bumpLockIndicator, .theme_yotsubaB .sage, .theme_yotsubaB .bumpLockIndicator {
  color: #ff0000;
}
html.theme_yotsubaB .divBanMessage, .theme_yotsubaB .divBanMessage {
  color: #d10000;
}
html.theme_yotsubaB .contentOmissionIndicator, .theme_yotsubaB .contentOmissionIndicator {
  color: #888;
}
html.theme_yotsubaB .labelOmission, .theme_yotsubaB .labelOmission {
  color: #888;
}
html.theme_yotsubaB .panelBacklinks a, .theme_yotsubaB .panelBacklinks a {
  color: #34345c !important;
  font-style: normal !important;
}
html.theme_yotsubaB .panelBacklinks a:hover, .theme_yotsubaB .panelBacklinks a:hover {
  color: #d00 !important;
}
html.theme_yotsubaB .quoteLink, html.theme_yotsubaB .quoteLink:hover, .theme_yotsubaB .quoteLink, .theme_yotsubaB .quoteLink:hover {
  color: #d00;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* >>0000 */
  /* --- D. Chan markup & spoilers --- */
}
html.theme_yotsubaB .greenText, .theme_yotsubaB .greenText {
  color: #789922;
}
html.theme_yotsubaB .redText, .theme_yotsubaB .redText {
  color: #d00;
}
html.theme_yotsubaB .orangeText, .theme_yotsubaB .orangeText {
  color: #E04000;
}
html.theme_yotsubaB .brackets::after, html.theme_yotsubaB .brackets::before, .theme_yotsubaB .brackets::after, .theme_yotsubaB .brackets::before {
  color: #000000;
}
html.theme_yotsubaB span.spoiler, .theme_yotsubaB span.spoiler {
  background: #000;
  color: #000;
}
html.theme_yotsubaB span.spoiler:hover, .theme_yotsubaB span.spoiler:hover {
  color: #FFF;
  background-color: #000;
}
html.theme_yotsubaB span.spoiler > .greenText, .theme_yotsubaB span.spoiler > .greenText {
  color: #000 !important;
}
html.theme_yotsubaB span.spoiler > .orangeText, .theme_yotsubaB span.spoiler > .orangeText {
  color: #000 !important;
}
html.theme_yotsubaB span.spoiler > a, .theme_yotsubaB span.spoiler > a {
  color: #000 !important;
}
html.theme_yotsubaB span.spoiler:hover > .greenText, .theme_yotsubaB span.spoiler:hover > .greenText {
  color: #789922 !important;
}
html.theme_yotsubaB span.spoiler:hover > .orangeText, .theme_yotsubaB span.spoiler:hover > .orangeText {
  color: #E04000 !important;
}
html.theme_yotsubaB span.spoiler:hover > a, .theme_yotsubaB span.spoiler:hover > a {
  color: #34345c !important;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- E. Posting form (legacy table + .post-card) --- */
}
html.theme_yotsubaB #postingForm th, html.theme_yotsubaB .modalTableBody th, .theme_yotsubaB #postingForm th, .theme_yotsubaB .modalTableBody th {
  background-color: #9988EE;
  color: black;
  border: 1px solid black;
}
html.theme_yotsubaB input, html.theme_yotsubaB textarea, html.theme_yotsubaB select, .theme_yotsubaB input, .theme_yotsubaB textarea, .theme_yotsubaB select {
  background: #fff;
  border: 1px solid #B7C5D9;
  color: #000;
}
html.theme_yotsubaB input::placeholder, html.theme_yotsubaB textarea::placeholder, .theme_yotsubaB input::placeholder, .theme_yotsubaB textarea::placeholder {
  color: #999 !important;
  opacity: 1 !important;
}
html.theme_yotsubaB .postingInput, .theme_yotsubaB .postingInput {
  border-color: #B7C5D9;
}
html.theme_yotsubaB .dropzone, .theme_yotsubaB .dropzone {
  color: #555;
  border: 2px dashed #B7C5D9;
  background-color: rgba(214, 218, 240, 0.5);
}
html.theme_yotsubaB .dropzone:hover, .theme_yotsubaB .dropzone:hover {
  color: #000;
  border-color: #34345c;
}
html.theme_yotsubaB .dragAndDropDiv, html.theme_yotsubaB .dragAndDropThumb, .theme_yotsubaB .dragAndDropDiv, .theme_yotsubaB .dragAndDropThumb {
  color: #000;
  background-color: rgba(214, 218, 240, 0.5);
}
html.theme_yotsubaB .removeButton, .theme_yotsubaB .removeButton {
  color: #999;
}
html.theme_yotsubaB .removeButton:hover, .theme_yotsubaB .removeButton:hover {
  color: #d00;
}
html.theme_yotsubaB .fileBrowser, .theme_yotsubaB .fileBrowser {
  background: none;
  color: #000000;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* .post-card (redesigned 2026-08-16) */
}
html.theme_yotsubaB .post-card, .theme_yotsubaB .post-card {
  background: #D6DAF0;
  border-color: #B7C5D9;
  color: #000000;
}
html.theme_yotsubaB .post-card .postingInput, html.theme_yotsubaB .post-card textarea, html.theme_yotsubaB .post-card select, .theme_yotsubaB .post-card .postingInput, .theme_yotsubaB .post-card textarea, .theme_yotsubaB .post-card select {
  background: #fff;
  border-color: #B7C5D9;
  color: #000;
}
html.theme_yotsubaB .post-card .postingInput:focus, html.theme_yotsubaB .post-card textarea:focus, html.theme_yotsubaB .post-card select:focus, .theme_yotsubaB .post-card .postingInput:focus, .theme_yotsubaB .post-card textarea:focus, .theme_yotsubaB .post-card select:focus {
  border-color: #34345c;
}
html.theme_yotsubaB .post-card input::placeholder, html.theme_yotsubaB .post-card textarea::placeholder, .theme_yotsubaB .post-card input::placeholder, .theme_yotsubaB .post-card textarea::placeholder {
  color: #999 !important;
  opacity: 1 !important;
}
html.theme_yotsubaB .post-card .dropzone, .theme_yotsubaB .post-card .dropzone {
  border: 2px dashed #B7C5D9;
  color: #555;
  background: transparent;
}
html.theme_yotsubaB .post-card .dropzone:hover, .theme_yotsubaB .post-card .dropzone:hover {
  border-color: #34345c;
  color: #000;
}
html.theme_yotsubaB .post-card .toggle-badge, .theme_yotsubaB .post-card .toggle-badge {
  background: #fff;
  color: #000;
}
html.theme_yotsubaB .post-card .advanced-drawer, .theme_yotsubaB .post-card .advanced-drawer {
  background: rgba(255, 255, 255, 0.6);
}
html.theme_yotsubaB .post-card .drawer-toggle, .theme_yotsubaB .post-card .drawer-toggle {
  color: #34345c;
}
html.theme_yotsubaB .post-card .btn-submit, .theme_yotsubaB .post-card .btn-submit {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB .post-card .btn-submit:hover, .theme_yotsubaB .post-card .btn-submit:hover {
  background: #8877ee;
}
html.theme_yotsubaB .post-card .post-rules-panel, .theme_yotsubaB .post-card .post-rules-panel {
  background: #fff;
  border-color: #B7C5D9;
  color: #333;
}
html.theme_yotsubaB .post-card .post-rules-panel a, .theme_yotsubaB .post-card .post-rules-panel a {
  color: #34345c;
}
html.theme_yotsubaB .post-card .rules-line, .theme_yotsubaB .post-card .rules-line {
  color: #555;
}
html.theme_yotsubaB .post-card .rules-line a, .theme_yotsubaB .post-card .rules-line a {
  color: #34345c;
}
html.theme_yotsubaB .post-card .captchaImage, .theme_yotsubaB .post-card .captchaImage {
  background: #fff;
}
html.theme_yotsubaB .post-card .captchaTimer, .theme_yotsubaB .post-card .captchaTimer {
  color: #888;
  opacity: 1;
}
html.theme_yotsubaB .post-card .no-cookie-link, .theme_yotsubaB .post-card .no-cookie-link {
  color: #34345c;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- F. Modals & settings menu --- */
}
html.theme_yotsubaB .modalPanel, .theme_yotsubaB .modalPanel {
  background: rgba(0, 0, 0, 0.4);
}
html.theme_yotsubaB #quick-reply, .theme_yotsubaB #quick-reply {
  border: 1px solid #aaa;
}
html.theme_yotsubaB #quick-reply table, .theme_yotsubaB #quick-reply table {
  background-color: #eef2ff;
  outline-color: #aaa;
}
html.theme_yotsubaB #quick-reply td.recaptcha span, .theme_yotsubaB #quick-reply td.recaptcha span {
  background: #fff;
  border-color: #ccc;
}
html.theme_yotsubaB .modalHeader, html.theme_yotsubaB .modalTableBody th, .theme_yotsubaB .modalHeader, .theme_yotsubaB .modalTableBody th {
  background-color: #9988EE;
  color: black;
}
html.theme_yotsubaB .handle, html.theme_yotsubaB #qrclose, .theme_yotsubaB .handle, .theme_yotsubaB #qrclose {
  background-color: #98e !important;
  color: black !important;
}
html.theme_yotsubaB .handle a, .theme_yotsubaB .handle a {
  color: #000;
}
html.theme_yotsubaB .modalDecorationPanel, .theme_yotsubaB .modalDecorationPanel {
  background-color: #D6DAF0;
  border-color: #B7C5D9;
}
html.theme_yotsubaB .modalInnerDecorationPanel, html.theme_yotsubaB .post-table, .theme_yotsubaB .modalInnerDecorationPanel, .theme_yotsubaB .post-table {
  background-color: #eef2ff;
}
html.theme_yotsubaB .captchaTimer, .theme_yotsubaB .captchaTimer {
  background: #eef2ff;
  border-color: #999;
  color: #555;
}
html.theme_yotsubaB .captchaImage, .theme_yotsubaB .captchaImage {
  background-color: #fff;
  color: #000;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* Settings menu — full color table (2026-08-17): base _settingsMenu.scss is a
     dark-plum sheet (near-black #141118 inputs, purple save button, light-pink text)
     and only the frame rules below overrode it → unreadable on this light theme.
     Now every surface uses the yotsubaB palette; .settingDesc also gets a size bump
     (base 0.74rem was "too small and thin to read" — operator 2026-08-17). */
}
html.theme_yotsubaB #settingsMenu, .theme_yotsubaB #settingsMenu {
  background: #eef2ff;
  color: #000000;
  border-color: #aaa;
}
html.theme_yotsubaB #settingsMenu > .header, .theme_yotsubaB #settingsMenu > .header {
  background: #9988EE;
  color: #000;
  border-bottom-color: #aaa;
}
html.theme_yotsubaB #settingsMenu > div:nth-child(3), html.theme_yotsubaB #settingsMenu > div:nth-child(4), .theme_yotsubaB #settingsMenu > div:nth-child(3), .theme_yotsubaB #settingsMenu > div:nth-child(4) {
  background: #eef2ff;
  border-left-color: #B7C5D9;
  border-right-color: #B7C5D9;
  border-top-color: #B7C5D9;
  border-bottom-color: #B7C5D9;
}
html.theme_yotsubaB #settingsMenu .settingsTab, .theme_yotsubaB #settingsMenu .settingsTab {
  color: #34345c;
}
html.theme_yotsubaB #settingsMenu .settingsTab:hover, html.theme_yotsubaB #settingsMenu .settingsTab:focus, .theme_yotsubaB #settingsMenu .settingsTab:hover, .theme_yotsubaB #settingsMenu .settingsTab:focus {
  background: #D6DAF0;
  color: #000;
}
html.theme_yotsubaB #settingsMenu #selectedTab, .theme_yotsubaB #settingsMenu #selectedTab {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB #settingsMenu .settingsSectionTitle, .theme_yotsubaB #settingsMenu .settingsSectionTitle {
  color: #34345c;
  border-bottom-color: #B7C5D9;
}
html.theme_yotsubaB #settingsMenu .settingName, .theme_yotsubaB #settingsMenu .settingName {
  color: #000;
}
html.theme_yotsubaB #settingsMenu .settingDesc, .theme_yotsubaB #settingsMenu .settingDesc {
  color: #444;
  font-size: 0.8rem;
}
html.theme_yotsubaB #settingsMenu .settingsCheckbox, .theme_yotsubaB #settingsMenu .settingsCheckbox {
  accent-color: #9988EE;
}
html.theme_yotsubaB #settingsMenu .saveButton, .theme_yotsubaB #settingsMenu .saveButton {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB #settingsMenu .saveButton:hover, .theme_yotsubaB #settingsMenu .saveButton:hover {
  background: #8877ee;
}
html.theme_yotsubaB #settingsMenu #newFilterPanel select, html.theme_yotsubaB #settingsMenu #newFilterPanel input[type=text], .theme_yotsubaB #settingsMenu #newFilterPanel select, .theme_yotsubaB #settingsMenu #newFilterPanel input[type=text] {
  background: #fff;
  color: #000;
  border-color: #B7C5D9;
}
html.theme_yotsubaB #settingsMenu #newFilterPanel button, .theme_yotsubaB #settingsMenu #newFilterPanel button {
  background: #D6DAF0;
  color: #000;
  border-color: #B7C5D9;
}
html.theme_yotsubaB #settingsMenu #newFilterPanel button:hover, .theme_yotsubaB #settingsMenu #newFilterPanel button:hover {
  background: #c8d4e6;
}
html.theme_yotsubaB #settingsMenu .existingFilterTypeLabel, html.theme_yotsubaB #settingsMenu .existingFilterContentLabel, .theme_yotsubaB #settingsMenu .existingFilterTypeLabel, .theme_yotsubaB #settingsMenu .existingFilterContentLabel {
  color: #333;
}
html.theme_yotsubaB #settingsMenu .filterDeleteButton, .theme_yotsubaB #settingsMenu .filterDeleteButton {
  color: #555;
}
html.theme_yotsubaB #settingsMenu .filterDeleteButton:hover, .theme_yotsubaB #settingsMenu .filterDeleteButton:hover {
  color: #d00;
}
html.theme_yotsubaB #settingsMenu #themeSelector, html.theme_yotsubaB #settingsMenu #cssInput, .theme_yotsubaB #settingsMenu #themeSelector, .theme_yotsubaB #settingsMenu #cssInput {
  background: #fff;
  color: #000;
  border-color: #B7C5D9;
}
html.theme_yotsubaB #closeSettingsMenuButton, .theme_yotsubaB #closeSettingsMenuButton {
  color: #000;
}
html.theme_yotsubaB #closeSettingsMenuButton:hover, .theme_yotsubaB #closeSettingsMenuButton:hover {
  color: #fff;
}
html.theme_yotsubaB .appealForm table tr th, html.theme_yotsubaB table.modInfo tr th, .theme_yotsubaB .appealForm table tr th, .theme_yotsubaB table.modInfo tr th {
  background: #9988EE;
  color: #000;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- G. Catalog view --- */
}
html.theme_yotsubaB .catalogCell, .theme_yotsubaB .catalogCell {
  background-color: #B7C5D9;
}
html.theme_yotsubaB .catalogCell > .catalogHeader > .labelSubject, .theme_yotsubaB .catalogCell > .catalogHeader > .labelSubject {
  color: black;
}
html.theme_yotsubaB .catalogCell .labelSubject, .theme_yotsubaB .catalogCell .labelSubject {
  color: black;
}
html.theme_yotsubaB .catalogCell:hover, .theme_yotsubaB .catalogCell:hover {
  background-color: #c8d4e6;
}
html.theme_yotsubaB .catalogCell:hover .divMessage, html.theme_yotsubaB .catalogCell:focus .divMessage, .theme_yotsubaB .catalogCell:hover .divMessage, .theme_yotsubaB .catalogCell:focus .divMessage {
  background: #D6DAF0;
  outline-color: #B7C5D9;
}
html.theme_yotsubaB .threadStats, .theme_yotsubaB .threadStats {
  color: #555;
}
html.theme_yotsubaB .linkThumb img, .theme_yotsubaB .linkThumb img {
  border-color: #B7C5D9;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- H. Front page / boards list --- */
}
html.theme_yotsubaB #divLatestPosts .latestPostCell, .theme_yotsubaB #divLatestPosts .latestPostCell {
  background: #D6DAF0;
}
html.theme_yotsubaB #divLatestImages img, .theme_yotsubaB #divLatestImages img {
  border-color: #000000;
}
html.theme_yotsubaB #boardsCellHeader span, .theme_yotsubaB #boardsCellHeader span {
  background: #D6DAF0;
  color: #000;
  border-color: #B7C5D9;
}
html.theme_yotsubaB .boardsCell:nth-of-type(2n+1) span, .theme_yotsubaB .boardsCell:nth-of-type(2n+1) span {
  background-color: rgba(183, 197, 217, 0.4);
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- I. Code highlighting (highlight.js — light) --- */
}
html.theme_yotsubaB .hljs, .theme_yotsubaB .hljs {
  display: block;
  overflow-x: auto;
  background: #f4f6ff;
  color: #333;
  padding: 0.5em;
}
html.theme_yotsubaB .hljs-comment, html.theme_yotsubaB .hljs-quote, .theme_yotsubaB .hljs-comment, .theme_yotsubaB .hljs-quote {
  color: #888;
}
html.theme_yotsubaB .hljs-keyword, html.theme_yotsubaB .hljs-selector-tag, .theme_yotsubaB .hljs-keyword, .theme_yotsubaB .hljs-selector-tag {
  color: #9988EE;
}
html.theme_yotsubaB .hljs-string, html.theme_yotsubaB .hljs-symbol, html.theme_yotsubaB .hljs-bullet, html.theme_yotsubaB .hljs-addition, .theme_yotsubaB .hljs-string, .theme_yotsubaB .hljs-symbol, .theme_yotsubaB .hljs-bullet, .theme_yotsubaB .hljs-addition {
  color: #789922;
}
html.theme_yotsubaB .hljs-number, html.theme_yotsubaB .hljs-built_in, html.theme_yotsubaB .hljs-literal, html.theme_yotsubaB .hljs-type, html.theme_yotsubaB .hljs-params, html.theme_yotsubaB .hljs-meta, html.theme_yotsubaB .hljs-link, html.theme_yotsubaB .hljs-attribute, .theme_yotsubaB .hljs-number, .theme_yotsubaB .hljs-built_in, .theme_yotsubaB .hljs-literal, .theme_yotsubaB .hljs-type, .theme_yotsubaB .hljs-params, .theme_yotsubaB .hljs-meta, .theme_yotsubaB .hljs-link, .theme_yotsubaB .hljs-attribute {
  color: #b26a00;
}
html.theme_yotsubaB .hljs-title, html.theme_yotsubaB .hljs-section, .theme_yotsubaB .hljs-title, .theme_yotsubaB .hljs-section {
  color: #34345c;
}
html.theme_yotsubaB .hljs-variable, html.theme_yotsubaB .hljs-template-variable, html.theme_yotsubaB .hljs-tag, html.theme_yotsubaB .hljs-name, html.theme_yotsubaB .hljs-selector-id, html.theme_yotsubaB .hljs-selector-class, html.theme_yotsubaB .hljs-regexp, html.theme_yotsubaB .hljs-deletion, .theme_yotsubaB .hljs-variable, .theme_yotsubaB .hljs-template-variable, .theme_yotsubaB .hljs-tag, .theme_yotsubaB .hljs-name, .theme_yotsubaB .hljs-selector-id, .theme_yotsubaB .hljs-selector-class, .theme_yotsubaB .hljs-regexp, .theme_yotsubaB .hljs-deletion {
  color: #c0392b;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* --- J. Badges, indicators & misc --- */
}
html.theme_yotsubaB .radiospan, .theme_yotsubaB .radiospan {
  color: #fff;
  background-color: #d10000;
}
html.theme_yotsubaB .dot, .theme_yotsubaB .dot {
  background-color: orange;
}
html.theme_yotsubaB .medals .text, .theme_yotsubaB .medals .text {
  background-color: #9988EE;
  color: #fff;
}
html.theme_yotsubaB .mobileAlert, .theme_yotsubaB .mobileAlert {
  color: #d10000;
}
html.theme_yotsubaB .linkFollow, .theme_yotsubaB .linkFollow {
  color: #789922;
}
html.theme_yotsubaB .linkFollowAlt, .theme_yotsubaB .linkFollowAlt {
  color: #d00;
}
html.theme_yotsubaB .watchedNotification::before, .theme_yotsubaB .watchedNotification::before {
  color: #d00;
}
html.theme_yotsubaB #boardContentLinks, .theme_yotsubaB #boardContentLinks {
  color: #555;
}
html.theme_yotsubaB #reportActions, .theme_yotsubaB #reportActions {
  background-color: #D6DAF0;
}
html.theme_yotsubaB .contentAction, .theme_yotsubaB .contentAction {
  background-color: #D6DAF0;
  border-color: #B7C5D9;
}
html.theme_yotsubaB #labelCaptchaId, .theme_yotsubaB #labelCaptchaId {
  color: #ff0000;
}
html.theme_yotsubaB #solved, .theme_yotsubaB #solved {
  color: #789922;
}
html.theme_yotsubaB a, html.theme_yotsubaB a:visited, .theme_yotsubaB a, .theme_yotsubaB a:visited {
  color: #34345c;
}
html.theme_yotsubaB a:hover, .theme_yotsubaB a:hover {
  color: #d00;
}
html.theme_yotsubaB a.brackets, html.theme_yotsubaB .reportdeletebuttons, .theme_yotsubaB a.brackets, .theme_yotsubaB .reportdeletebuttons {
  text-decoration: none;
  color: #34345c !important;
}
html.theme_yotsubaB h2 a:link, .theme_yotsubaB h2 a:link {
  color: #fff;
}
html.theme_yotsubaB h2 a:visited, .theme_yotsubaB h2 a:visited {
  color: #ffd0c0;
}
html.theme_yotsubaB, .theme_yotsubaB {
  /* ==========================================================================
     IDENTITY DELTA — non-color rules from the original yotsubaB, kept as-is
     ========================================================================== */
}
html.theme_yotsubaB textarea, .theme_yotsubaB textarea {
  font-family: arial, sans-serif;
  font-size: 10pt;
}
html.theme_yotsubaB #labelName, html.theme_yotsubaB #siteName, .theme_yotsubaB #labelName, .theme_yotsubaB #siteName {
  font-family: Tahoma, sans-serif;
  font-weight: bold;
  letter-spacing: -2px;
  font-size: 28px;
  color: #af0a0f;
}
html.theme_yotsubaB #bannerImage, .theme_yotsubaB #bannerImage {
  border: 1px solid #34345c;
}
html.theme_yotsubaB .divPosts .postCell .innerPost:before,
html.theme_yotsubaB .divPosts .postCell .markedPost:before, .theme_yotsubaB .divPosts .postCell .innerPost:before,
.theme_yotsubaB .divPosts .postCell .markedPost:before {
  margin-left: -20px !important;
  color: #B7C5D9;
  font-size: 10pt;
}

html.theme_catppuccin, .theme_catppuccin {
  color-scheme: dark;
  background: #1e1e2e none;
  color: #cdd6f4;
  /* ==========================================================================
     Catppuccin Mocha - Complete 100% Coverage Theme for Lynxchan/JSChan
     Scoped inside .theme_catppuccin via the catppuccin mixin included in _themes.scss
     ========================================================================== */
  /* Surface Palette — defined on .theme_catppuccin via & (parent selector) */
}
html.theme_catppuccin, .theme_catppuccin {
  --mocha-base: #1e1e2e;
  --mocha-mantle: #181825;
  --mocha-crust: #11111b;
  --mocha-surface0: #313244;
  --mocha-surface1: #45475a;
  --mocha-surface2: #585b70;
  /* Text Palette */
  --mocha-text: #cdd6f4;
  --mocha-subtext0: #a6adc8;
  --mocha-overlay0: #6c7086;
  /* Accents */
  --mocha-blue: #89b4fa;
  --mocha-lavender: #b4befe;
  --mocha-sapphire: #74c7ec;
  --mocha-green: #a6e3a1;
  --mocha-red: #f38ba8;
  --mocha-peach: #fab387;
  --mocha-yellow: #f9e2af;
  --mocha-mauve: #cba6f7;
  --mocha-pink: #f5c2e7;
  --mocha-teal: #94e2d5;
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Global / Page Structure --- */
}
html.theme_catppuccin body, .theme_catppuccin body {
  background: var(--mocha-base) !important;
  color: var(--mocha-text);
}
html.theme_catppuccin #footer, .theme_catppuccin #footer {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin #news, .theme_catppuccin #news {
  background: var(--mocha-mantle);
  color: var(--mocha-text);
}
html.theme_catppuccin .hiddenThread, .theme_catppuccin .hiddenThread {
  background: var(--mocha-surface0);
}
html.theme_catppuccin .kCard .kBody, html.theme_catppuccin #indexWrapper #indexLeft > div, html.theme_catppuccin #indexWrapper #indexRight > div,
html.theme_catppuccin #subpageWrapper > div, html.theme_catppuccin #redirect > div, .theme_catppuccin .kCard .kBody, .theme_catppuccin #indexWrapper #indexLeft > div, .theme_catppuccin #indexWrapper #indexRight > div,
.theme_catppuccin #subpageWrapper > div, .theme_catppuccin #redirect > div {
  background-color: var(--mocha-mantle);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin .mCard, .theme_catppuccin .mCard {
  background-color: var(--mocha-mantle);
}
html.theme_catppuccin .mCard > h2, .theme_catppuccin .mCard > h2 {
  background: var(--mocha-surface0);
  color: var(--mocha-mauve);
}
html.theme_catppuccin .unimportant, html.theme_catppuccin .unimportant *, .theme_catppuccin .unimportant, .theme_catppuccin .unimportant * {
  color: var(--mocha-overlay0) !important;
}
html.theme_catppuccin #cookieBanner, .theme_catppuccin #cookieBanner {
  background-color: var(--mocha-surface0);
  color: var(--mocha-text);
}
html.theme_catppuccin h2, html.theme_catppuccin h3, .theme_catppuccin h2, .theme_catppuccin h3 {
  color: var(--mocha-mauve);
  background: var(--mocha-surface0);
}
html.theme_catppuccin progress, .theme_catppuccin progress {
  background: var(--mocha-surface0) !important;
}
html.theme_catppuccin progress::-webkit-progress-value, .theme_catppuccin progress::-webkit-progress-value {
  background: var(--mocha-green);
}
html.theme_catppuccin progress::-moz-progress-bar, .theme_catppuccin progress::-moz-progress-bar {
  background: var(--mocha-green);
}
html.theme_catppuccin, .theme_catppuccin {
  /* Scrollbars, rules & selection (standardization pass) */
}
html.theme_catppuccin *, .theme_catppuccin * {
  scrollbar-color: var(--mocha-surface1) var(--mocha-crust);
}
html.theme_catppuccin hr, .theme_catppuccin hr {
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin ::selection, .theme_catppuccin ::selection {
  background: var(--mocha-blue);
  color: var(--mocha-base);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Posts & Reply Cells --- */
}
html.theme_catppuccin .topBoards a, html.theme_catppuccin .innerPost, html.theme_catppuccin .markedPost, html.theme_catppuccin .floatingMenu, .theme_catppuccin .topBoards a, .theme_catppuccin .innerPost, .theme_catppuccin .markedPost, .theme_catppuccin .floatingMenu {
  background: var(--mocha-surface0);
}
html.theme_catppuccin #watchedMenu .watchedCellLabel a, .theme_catppuccin #watchedMenu .watchedCellLabel a {
  color: var(--mocha-blue);
}
html.theme_catppuccin, .theme_catppuccin {
  /* watched-threads menu links (theme's general link token) */
}
html.theme_catppuccin .markedPost, html.theme_catppuccin div.postCell:target .innerPost, .theme_catppuccin .markedPost, .theme_catppuccin div.postCell:target .innerPost {
  outline-color: var(--mocha-blue);
}
html.theme_catppuccin .quoteTooltip > div, .theme_catppuccin .quoteTooltip > div {
  border-color: var(--mocha-blue);
}
html.theme_catppuccin .uploadDetails, .theme_catppuccin .uploadDetails {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .innerOP .expandLabel, html.theme_catppuccin .innerOP .collapseLabel, .theme_catppuccin .innerOP .expandLabel, .theme_catppuccin .innerOP .collapseLabel {
  background: var(--mocha-mantle);
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .innerOP .bottomGradient, .theme_catppuccin .innerOP .bottomGradient {
  background: linear-gradient(transparent, var(--mocha-mantle));
}
html.theme_catppuccin .innerPost .expandLabel, html.theme_catppuccin .innerPost .collapseLabel, .theme_catppuccin .innerPost .expandLabel, .theme_catppuccin .innerPost .collapseLabel {
  background: var(--mocha-surface0);
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .markedPost .expandLabel, html.theme_catppuccin .markedPost .collapseLabel, .theme_catppuccin .markedPost .expandLabel, .theme_catppuccin .markedPost .collapseLabel {
  background: var(--mocha-surface0);
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .innerPost .bottomGradient, .theme_catppuccin .innerPost .bottomGradient {
  background: linear-gradient(transparent, var(--mocha-surface0));
}
html.theme_catppuccin .innerPost .panelUploads .uploadCell, html.theme_catppuccin .markedPost .panelUploads .uploadCell, .theme_catppuccin .innerPost .panelUploads .uploadCell, .theme_catppuccin .markedPost .panelUploads .uploadCell {
  background: var(--mocha-surface1);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Catalog View --- */
}
html.theme_catppuccin .catalogCell, .theme_catppuccin .catalogCell {
  background: rgba(255, 255, 255, 0.03);
}
html.theme_catppuccin .catalogCell .labelSubject, .theme_catppuccin .catalogCell .labelSubject {
  color: var(--mocha-red);
}
html.theme_catppuccin .catalogCell:hover, .theme_catppuccin .catalogCell:hover {
  background: var(--mocha-surface1) !important;
}
html.theme_catppuccin .catalogCell:hover .divMessage, html.theme_catppuccin .catalogCell:focus .divMessage, .theme_catppuccin .catalogCell:hover .divMessage, .theme_catppuccin .catalogCell:focus .divMessage {
  background: var(--mocha-surface1);
  outline-color: var(--mocha-surface1);
}
html.theme_catppuccin .threadStats, .theme_catppuccin .threadStats {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .linkThumb img, .theme_catppuccin .linkThumb img {
  border: 1px solid var(--mocha-surface1);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Navigation & Menus --- */
}
html.theme_catppuccin #topNav, .theme_catppuccin #topNav {
  background: transparent;
}
html.theme_catppuccin #topNav.active, html.theme_catppuccin #topNav.fixed, .theme_catppuccin #topNav.active, .theme_catppuccin #topNav.fixed {
  background: var(--mocha-mantle);
  border-bottom: 1px solid var(--mocha-surface1);
}
html.theme_catppuccin .divPages, html.theme_catppuccin #divPages, .theme_catppuccin .divPages, .theme_catppuccin #divPages {
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin .extraMenu a, .theme_catppuccin .extraMenu a {
  color: var(--mocha-text);
}
html.theme_catppuccin .extraMenu div:hover, html.theme_catppuccin .hideMenu div:hover, .theme_catppuccin .extraMenu div:hover, .theme_catppuccin .hideMenu div:hover {
  background: var(--mocha-surface1);
  color: var(--mocha-text);
}
html.theme_catppuccin .extraMenu, html.theme_catppuccin .hideMenu, .theme_catppuccin .extraMenu, .theme_catppuccin .hideMenu {
  border-color: var(--mocha-blue);
}
html.theme_catppuccin .modalHeader, html.theme_catppuccin #quick-reply .handle, .theme_catppuccin .modalHeader, .theme_catppuccin #quick-reply .handle {
  background: var(--mocha-surface0);
  color: var(--mocha-mauve);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Links & Interactive Text --- */
}
html.theme_catppuccin a, html.theme_catppuccin .reportdeletebuttons, .theme_catppuccin a, .theme_catppuccin .reportdeletebuttons {
  color: var(--mocha-blue);
}
html.theme_catppuccin a:hover, .theme_catppuccin a:hover {
  color: var(--mocha-lavender);
}
html.theme_catppuccin .handle a, .theme_catppuccin .handle a {
  color: var(--mocha-mauve);
}
html.theme_catppuccin .linkName, .theme_catppuccin .linkName {
  color: var(--mocha-pink);
}
html.theme_catppuccin .linkName:hover, .theme_catppuccin .linkName:hover {
  color: var(--mocha-red);
}
html.theme_catppuccin .linkQuote, html.theme_catppuccin .linkSelf, .theme_catppuccin .linkQuote, .theme_catppuccin .linkSelf {
  color: var(--mocha-text) !important;
}
html.theme_catppuccin h2 a:link, .theme_catppuccin h2 a:link {
  color: var(--mocha-mauve);
}
html.theme_catppuccin h2 a:visited, .theme_catppuccin h2 a:visited {
  color: var(--mocha-sapphire);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Chan Markup & Spoilers --- */
}
html.theme_catppuccin .greenText, html.theme_catppuccin .quote, .theme_catppuccin .greenText, .theme_catppuccin .quote {
  color: var(--mocha-green);
}
html.theme_catppuccin .redText, .theme_catppuccin .redText {
  color: var(--mocha-red);
}
html.theme_catppuccin .orangeText, .theme_catppuccin .orangeText {
  color: var(--mocha-peach);
}
html.theme_catppuccin .brackets::after, html.theme_catppuccin .brackets::before, .theme_catppuccin .brackets::after, .theme_catppuccin .brackets::before {
  color: var(--mocha-overlay0);
}
html.theme_catppuccin span.spoiler, .theme_catppuccin span.spoiler {
  background: var(--mocha-surface1);
  color: var(--mocha-surface1);
}
html.theme_catppuccin span.spoiler:hover, .theme_catppuccin span.spoiler:hover {
  color: var(--mocha-text);
}
html.theme_catppuccin span.spoiler > .greenText, .theme_catppuccin span.spoiler > .greenText {
  color: var(--mocha-surface1) !important;
}
html.theme_catppuccin span.spoiler > .orangeText, .theme_catppuccin span.spoiler > .orangeText {
  color: var(--mocha-surface1) !important;
}
html.theme_catppuccin span.spoiler > a, .theme_catppuccin span.spoiler > a {
  color: var(--mocha-surface1) !important;
}
html.theme_catppuccin span.spoiler:hover > .greenText, .theme_catppuccin span.spoiler:hover > .greenText {
  color: var(--mocha-green) !important;
}
html.theme_catppuccin span.spoiler:hover > .orangeText, .theme_catppuccin span.spoiler:hover > .orangeText {
  color: var(--mocha-peach) !important;
}
html.theme_catppuccin span.spoiler:hover > a, .theme_catppuccin span.spoiler:hover > a {
  color: var(--mocha-blue) !important;
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Forms & Inputs (legacy table layout) --- */
}
html.theme_catppuccin #postingForm th, html.theme_catppuccin .modalTableBody th, .theme_catppuccin #postingForm th, .theme_catppuccin .modalTableBody th {
  color: var(--mocha-mauve);
  background: var(--mocha-surface0);
}
html.theme_catppuccin .dragAndDropDiv, html.theme_catppuccin .dragAndDropThumb, .theme_catppuccin .dragAndDropDiv, .theme_catppuccin .dragAndDropThumb {
  color: var(--mocha-text);
  background-color: rgba(69, 71, 90, 0.5);
}
html.theme_catppuccin .dropzone, .theme_catppuccin .dropzone {
  color: var(--mocha-subtext0);
  background-color: rgba(49, 50, 68, 0.5);
  border-color: var(--mocha-surface2);
}
html.theme_catppuccin .dropzone:hover, .theme_catppuccin .dropzone:hover {
  color: var(--mocha-text);
  background-color: var(--mocha-surface1);
}
html.theme_catppuccin .innerOP .panelUploads .uploadCell, .theme_catppuccin .innerOP .panelUploads .uploadCell {
  background: var(--mocha-mantle);
}
html.theme_catppuccin #selectedDiv .selectedCell, html.theme_catppuccin #selectedDivQr .selectedCell, .theme_catppuccin #selectedDiv .selectedCell, .theme_catppuccin #selectedDivQr .selectedCell {
  background: var(--mocha-surface0);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin .removeButton, .theme_catppuccin .removeButton {
  color: var(--mocha-overlay0);
}
html.theme_catppuccin .removeButton:hover, .theme_catppuccin .removeButton:hover {
  color: var(--mocha-red);
}
html.theme_catppuccin input::placeholder, html.theme_catppuccin textarea::placeholder, .theme_catppuccin input::placeholder, .theme_catppuccin textarea::placeholder {
  color: var(--mocha-overlay0) !important;
}
html.theme_catppuccin input, html.theme_catppuccin textarea, html.theme_catppuccin select, .theme_catppuccin input, .theme_catppuccin textarea, .theme_catppuccin select {
  background-color: var(--mocha-mantle);
  color: var(--mocha-text);
  border: 1px solid var(--mocha-surface1);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Posting form card (.post-card — redesigned 2026-08-16) --- */
}
html.theme_catppuccin .post-card, .theme_catppuccin .post-card {
  background: var(--mocha-mantle);
  border-color: var(--mocha-surface1);
  color: var(--mocha-text);
}
html.theme_catppuccin .post-card .postingInput, html.theme_catppuccin .post-card textarea, html.theme_catppuccin .post-card select, .theme_catppuccin .post-card .postingInput, .theme_catppuccin .post-card textarea, .theme_catppuccin .post-card select {
  background-color: var(--mocha-crust);
  border-color: var(--mocha-surface1);
  color: var(--mocha-text);
}
html.theme_catppuccin .post-card .postingInput:focus, html.theme_catppuccin .post-card textarea:focus, html.theme_catppuccin .post-card select:focus, .theme_catppuccin .post-card .postingInput:focus, .theme_catppuccin .post-card textarea:focus, .theme_catppuccin .post-card select:focus {
  border-color: var(--mocha-blue);
}
html.theme_catppuccin .post-card input::placeholder, html.theme_catppuccin .post-card textarea::placeholder, .theme_catppuccin .post-card input::placeholder, .theme_catppuccin .post-card textarea::placeholder {
  color: var(--mocha-overlay0) !important;
  opacity: 1 !important;
}
html.theme_catppuccin .post-card .dropzone, .theme_catppuccin .post-card .dropzone {
  border-color: var(--mocha-surface2);
  color: var(--mocha-subtext0);
  background: transparent;
}
html.theme_catppuccin .post-card .dropzone:hover, .theme_catppuccin .post-card .dropzone:hover {
  border-color: var(--mocha-blue);
  color: var(--mocha-text);
}
html.theme_catppuccin .post-card .toggle-badge, .theme_catppuccin .post-card .toggle-badge {
  background: var(--mocha-surface0);
  color: var(--mocha-text);
}
html.theme_catppuccin .post-card .advanced-drawer, .theme_catppuccin .post-card .advanced-drawer {
  background: var(--mocha-crust);
}
html.theme_catppuccin .post-card .drawer-toggle, .theme_catppuccin .post-card .drawer-toggle {
  color: var(--mocha-mauve);
}
html.theme_catppuccin .post-card .btn-submit, .theme_catppuccin .post-card .btn-submit {
  background: var(--mocha-mauve);
  color: var(--mocha-base);
}
html.theme_catppuccin .post-card .btn-submit:hover, .theme_catppuccin .post-card .btn-submit:hover {
  background: var(--mocha-lavender);
}
html.theme_catppuccin .post-card .post-rules-panel, .theme_catppuccin .post-card .post-rules-panel {
  background: var(--mocha-mantle);
  border-color: var(--mocha-surface1);
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .post-card .post-rules-panel a, .theme_catppuccin .post-card .post-rules-panel a {
  color: var(--mocha-mauve);
}
html.theme_catppuccin .post-card .rules-line, .theme_catppuccin .post-card .rules-line {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .post-card .rules-line a, .theme_catppuccin .post-card .rules-line a {
  color: var(--mocha-mauve);
}
html.theme_catppuccin .post-card .captchaImage, .theme_catppuccin .post-card .captchaImage {
  background: var(--mocha-surface0);
}
html.theme_catppuccin .post-card .captchaTimer, .theme_catppuccin .post-card .captchaTimer {
  color: var(--mocha-overlay0);
  opacity: 1;
}
html.theme_catppuccin .post-card .no-cookie-link, .theme_catppuccin .post-card .no-cookie-link {
  color: var(--mocha-mauve);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Modals & Settings Menu --- */
}
html.theme_catppuccin #quick-reply table, html.theme_catppuccin .modalDecorationPanel, .theme_catppuccin #quick-reply table, .theme_catppuccin .modalDecorationPanel {
  background: var(--mocha-mantle);
  border-color: var(--mocha-surface1);
  outline-color: var(--mocha-surface1);
}
html.theme_catppuccin, .theme_catppuccin {
  /* Settings menu — full color table (2026-08-17): base _settingsMenu.scss is
     dark-plum; now every surface uses the Mocha palette (same surface set as green). */
}
html.theme_catppuccin #settingsMenu, .theme_catppuccin #settingsMenu {
  background: var(--mocha-base);
  color: var(--mocha-text);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin #settingsMenu > .header, .theme_catppuccin #settingsMenu > .header {
  background: var(--mocha-surface0);
  color: var(--mocha-mauve);
  border-bottom-color: var(--mocha-surface1);
}
html.theme_catppuccin #settingsMenu > div:nth-child(3), html.theme_catppuccin #settingsMenu > div:nth-child(4), .theme_catppuccin #settingsMenu > div:nth-child(3), .theme_catppuccin #settingsMenu > div:nth-child(4) {
  background: var(--mocha-mantle);
}
html.theme_catppuccin #settingsMenu .settingsTab, .theme_catppuccin #settingsMenu .settingsTab {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin #settingsMenu .settingsTab:hover, html.theme_catppuccin #settingsMenu .settingsTab:focus, .theme_catppuccin #settingsMenu .settingsTab:hover, .theme_catppuccin #settingsMenu .settingsTab:focus {
  background: var(--mocha-surface0);
  color: var(--mocha-text);
}
html.theme_catppuccin #settingsMenu #selectedTab, .theme_catppuccin #settingsMenu #selectedTab {
  background: var(--mocha-mauve);
  color: var(--mocha-base);
}
html.theme_catppuccin #settingsMenu .settingsSectionTitle, .theme_catppuccin #settingsMenu .settingsSectionTitle {
  color: var(--mocha-subtext0);
  border-bottom-color: var(--mocha-surface1);
}
html.theme_catppuccin #settingsMenu .settingName, .theme_catppuccin #settingsMenu .settingName {
  color: var(--mocha-text);
}
html.theme_catppuccin #settingsMenu .settingDesc, .theme_catppuccin #settingsMenu .settingDesc {
  color: var(--mocha-overlay0);
}
html.theme_catppuccin #settingsMenu .settingsCheckbox, .theme_catppuccin #settingsMenu .settingsCheckbox {
  accent-color: var(--mocha-mauve);
}
html.theme_catppuccin #settingsMenu .saveButton, .theme_catppuccin #settingsMenu .saveButton {
  background: var(--mocha-mauve);
  color: var(--mocha-base);
}
html.theme_catppuccin #settingsMenu .saveButton:hover, .theme_catppuccin #settingsMenu .saveButton:hover {
  background: var(--mocha-lavender);
}
html.theme_catppuccin #settingsMenu #newFilterPanel select, html.theme_catppuccin #settingsMenu #newFilterPanel input[type=text], .theme_catppuccin #settingsMenu #newFilterPanel select, .theme_catppuccin #settingsMenu #newFilterPanel input[type=text] {
  background: var(--mocha-crust);
  color: var(--mocha-text);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin #settingsMenu #newFilterPanel button, .theme_catppuccin #settingsMenu #newFilterPanel button {
  background: var(--mocha-surface0);
  color: var(--mocha-text);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin #settingsMenu #newFilterPanel button:hover, .theme_catppuccin #settingsMenu #newFilterPanel button:hover {
  background: var(--mocha-surface1);
}
html.theme_catppuccin #settingsMenu .existingFilterTypeLabel, html.theme_catppuccin #settingsMenu .existingFilterContentLabel, .theme_catppuccin #settingsMenu .existingFilterTypeLabel, .theme_catppuccin #settingsMenu .existingFilterContentLabel {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin #settingsMenu .filterDeleteButton, .theme_catppuccin #settingsMenu .filterDeleteButton {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin #settingsMenu .filterDeleteButton:hover, .theme_catppuccin #settingsMenu .filterDeleteButton:hover {
  color: var(--mocha-red);
}
html.theme_catppuccin #settingsMenu #themeSelector, html.theme_catppuccin #settingsMenu #cssInput, .theme_catppuccin #settingsMenu #themeSelector, .theme_catppuccin #settingsMenu #cssInput {
  background: var(--mocha-crust);
  color: var(--mocha-text);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin #closeSettingsMenuButton, .theme_catppuccin #closeSettingsMenuButton {
  color: var(--mocha-mauve);
}
html.theme_catppuccin .captchaTimer, .theme_catppuccin .captchaTimer {
  background: var(--mocha-mantle);
  color: var(--mocha-text);
}
html.theme_catppuccin .modalInnerDecorationPanel, html.theme_catppuccin .post-table, .theme_catppuccin .modalInnerDecorationPanel, .theme_catppuccin .post-table {
  background-color: var(--mocha-mantle);
}
html.theme_catppuccin .modalPanel, .theme_catppuccin .modalPanel {
  background: rgba(17, 17, 27, 0.85);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Labels & Metadata --- */
  /* ID badge text: full-strength teal (base opacity was .6). The black text
     outline is inherited from base _posting.scss (canonical guard against
     hash-color collisions). */
}
html.theme_catppuccin .labelId, .theme_catppuccin .labelId {
  color: var(--mocha-teal);
  opacity: 1;
}
html.theme_catppuccin .labelCreated, html.theme_catppuccin .spanId, .theme_catppuccin .labelCreated, .theme_catppuccin .spanId {
  color: var(--mocha-overlay0);
}
html.theme_catppuccin .labelRole, .theme_catppuccin .labelRole {
  color: var(--mocha-red);
}
html.theme_catppuccin .labelSubject, .theme_catppuccin .labelSubject {
  color: var(--mocha-red);
}
html.theme_catppuccin .labelOmission, .theme_catppuccin .labelOmission {
  color: var(--mocha-overlay0);
}
html.theme_catppuccin .panelBacklinks a, .theme_catppuccin .panelBacklinks a {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .panelBacklinks a:hover, .theme_catppuccin .panelBacklinks a:hover {
  color: var(--mocha-blue);
}
html.theme_catppuccin .quoteLink, html.theme_catppuccin .quoteLink:hover, .theme_catppuccin .quoteLink, .theme_catppuccin .quoteLink:hover {
  color: var(--mocha-blue);
}
html.theme_catppuccin .navLinkSpan, .theme_catppuccin .navLinkSpan {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Upload & Preview Area --- */
}
html.theme_catppuccin #divOekaki, .theme_catppuccin #divOekaki {
  background-color: var(--mocha-mantle);
}
html.theme_catppuccin #previewContainer, .theme_catppuccin #previewContainer {
  background: rgba(17, 17, 27, 0.7);
}
html.theme_catppuccin .fileBrowser, .theme_catppuccin .fileBrowser {
  background: none;
  color: var(--mocha-text);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Front Page / Latest Posts --- */
}
html.theme_catppuccin #divLatestPosts .latestPostCell, .theme_catppuccin #divLatestPosts .latestPostCell {
  background: var(--mocha-surface0);
}
html.theme_catppuccin #divLatestImages img, .theme_catppuccin #divLatestImages img {
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Boards list --- */
}
html.theme_catppuccin #boardsCellHeader span, .theme_catppuccin #boardsCellHeader span {
  background: var(--mocha-mantle);
  color: var(--mocha-text);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin .boardsCell:nth-of-type(2n+1) span, .theme_catppuccin .boardsCell:nth-of-type(2n+1) span {
  background-color: rgba(255, 255, 255, 0.03);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Code Highlighting (highlight.js) --- */
}
html.theme_catppuccin .hljs, .theme_catppuccin .hljs {
  background: var(--mocha-crust);
  color: var(--mocha-text);
}
html.theme_catppuccin .hljs-comment, html.theme_catppuccin .hljs-quote, .theme_catppuccin .hljs-comment, .theme_catppuccin .hljs-quote {
  color: var(--mocha-overlay0);
}
html.theme_catppuccin .hljs-keyword, .theme_catppuccin .hljs-keyword {
  color: var(--mocha-mauve);
}
html.theme_catppuccin .hljs-string, .theme_catppuccin .hljs-string {
  color: var(--mocha-green);
}
html.theme_catppuccin .hljs-number, .theme_catppuccin .hljs-number {
  color: var(--mocha-peach);
}
html.theme_catppuccin .hljs-title, .theme_catppuccin .hljs-title {
  color: var(--mocha-blue);
}
html.theme_catppuccin .hljs-variable, .theme_catppuccin .hljs-variable {
  color: var(--mocha-red);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Captcha, Bans & Misc --- */
}
html.theme_catppuccin #labelCaptchaId, .theme_catppuccin #labelCaptchaId {
  color: var(--mocha-red);
}
html.theme_catppuccin #solved, .theme_catppuccin #solved {
  color: var(--mocha-green);
}
html.theme_catppuccin .divBanMessage, .theme_catppuccin .divBanMessage {
  color: var(--mocha-red);
}
html.theme_catppuccin .dot, .theme_catppuccin .dot {
  background-color: var(--mocha-peach);
}
html.theme_catppuccin .medals .text, .theme_catppuccin .medals .text {
  background-color: var(--mocha-surface0);
  color: var(--mocha-text);
}
html.theme_catppuccin .mobileAlert, .theme_catppuccin .mobileAlert {
  color: var(--mocha-red);
}
html.theme_catppuccin .radiospan, .theme_catppuccin .radiospan {
  color: var(--mocha-crust);
  background-color: var(--mocha-red);
}
html.theme_catppuccin, .theme_catppuccin {
  /* --- Other --- */
}
html.theme_catppuccin #boardContentLinks, .theme_catppuccin #boardContentLinks {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin #reportActions, .theme_catppuccin #reportActions {
  background-color: var(--mocha-surface0);
}
html.theme_catppuccin .contentAction, .theme_catppuccin .contentAction {
  background: var(--mocha-mantle);
  border-color: var(--mocha-surface1);
}
html.theme_catppuccin .appealForm table tr th, html.theme_catppuccin table.modInfo tr th, .theme_catppuccin .appealForm table tr th, .theme_catppuccin table.modInfo tr th {
  background: var(--mocha-surface0);
  color: var(--mocha-mauve);
}
html.theme_catppuccin .captchaImage, .theme_catppuccin .captchaImage {
  background-color: var(--mocha-mantle);
  color: var(--mocha-text);
}
html.theme_catppuccin .contentOmissionIndicator, .theme_catppuccin .contentOmissionIndicator {
  color: var(--mocha-subtext0);
}
html.theme_catppuccin .linkFollow, .theme_catppuccin .linkFollow {
  color: var(--mocha-green);
}
html.theme_catppuccin .linkFollowAlt, .theme_catppuccin .linkFollowAlt {
  color: var(--mocha-red);
}
html.theme_catppuccin .mFixed, .theme_catppuccin .mFixed {
  background: var(--mocha-mantle);
}
html.theme_catppuccin .noEmailName, .theme_catppuccin .noEmailName {
  color: var(--mocha-pink);
}
html.theme_catppuccin .sage, html.theme_catppuccin .bumpLockIndicator, .theme_catppuccin .sage, .theme_catppuccin .bumpLockIndicator {
  color: var(--mocha-red);
}
html.theme_catppuccin .watchedNotification::before, .theme_catppuccin .watchedNotification::before {
  color: var(--mocha-red);
}
html.theme_catppuccin div.titlebar, .theme_catppuccin div.titlebar {
  background: var(--mocha-surface0);
  color: var(--mocha-mauve);
}
html.theme_catppuccin #siteName, .theme_catppuccin #siteName {
  color: var(--mocha-mauve);
}
html.theme_catppuccin, .theme_catppuccin {
  /* main site title — theme's title accent (was falling back to base body text) */
}

html.theme_gitgudv2, .theme_gitgudv2 {
  color-scheme: dark;
  background: #211f26 none;
  color: #e2ded9;
  /* ==========================================================================
     GitGud V2 (Modernized) - Theme File for KohlNumbra / Lynxchan
     ========================================================================== */
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 1. DESIGN TOKENS --- */
  /* Color Tokens */
  --gg-bg-base: #211f26; /* Deep dark plum background */
  --gg-bg-mantle: #1a181e; /* Darker inputs / panels */
  --gg-bg-crust: #121115; /* Code blocks / deepest layer */
  --gg-bg-surface0: #2e2b36; /* Post cards / floating menus */
  --gg-bg-surface1: #3d3a47; /* Hover highlights / upload cells */
  --gg-bg-header: #3e2a47; /* Signature GitGud deep purple header */
  --gg-text-main: #e2ded9; /* Off-white / cream text */
  --gg-text-sub: #b3aba2; /* Muted brown-gray text */
  --gg-text-dim: #857d75; /* Borders / muted icons */
  --gg-accent-purple: #a872cc; /* Links / interactive elements */
  --gg-accent-hover: #c28fe6; /* Link hover */
  --gg-accent-brown: #cbb092; /* Header titles / names */
  --gg-accent-green: #87b279; /* Sage quote text */
  --gg-accent-red: #d96c6c; /* Subjects / errors */
  --gg-accent-orange: #e09867; /* Warnings */
  /* Structural & Shape Tokens */
  --gg-radius-sm: 4px;
  --gg-radius-md: 8px;
  --gg-radius-lg: 12px;
  --gg-radius-full: 9999px;
  --gg-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.2);
  --gg-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
  --gg-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --gg-font-mono: "JetBrains Mono", "Fira Code", monospace;
  --gg-trans-fast: 150ms ease;
  --gg-trans-normal: 250ms ease;
  /* Global Properties */
  scroll-behavior: smooth !important;
  font-family: var(--gg-font-body) !important;
  background: var(--gg-bg-base) !important;
  color: var(--gg-text-main) !important;
  /* --- 2. GLOBAL STRUCTURE & LAYOUT --- */
}
html.theme_gitgudv2 body, .theme_gitgudv2 body {
  background: var(--gg-bg-base) !important;
  color: var(--gg-text-main) !important;
  font-family: var(--gg-font-body) !important;
}
html.theme_gitgudv2 #footer, .theme_gitgudv2 #footer {
  color: var(--gg-text-sub) !important;
  padding: 12px 0 !important;
}
html.theme_gitgudv2 #news, .theme_gitgudv2 #news {
  background: var(--gg-bg-mantle) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-md) !important;
}
html.theme_gitgudv2 .hiddenThread, .theme_gitgudv2 .hiddenThread {
  background: var(--gg-bg-surface0) !important;
  border-radius: var(--gg-radius-md) !important;
}
html.theme_gitgudv2 .kCard .kBody,
html.theme_gitgudv2 #indexWrapper #indexLeft > div,
html.theme_gitgudv2 #indexWrapper #indexRight > div,
html.theme_gitgudv2 #subpageWrapper > div,
html.theme_gitgudv2 #redirect > div, .theme_gitgudv2 .kCard .kBody,
.theme_gitgudv2 #indexWrapper #indexLeft > div,
.theme_gitgudv2 #indexWrapper #indexRight > div,
.theme_gitgudv2 #subpageWrapper > div,
.theme_gitgudv2 #redirect > div {
  background-color: var(--gg-bg-mantle) !important;
  border: 1px solid var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-md) !important;
  box-shadow: var(--gg-shadow-sm) !important;
}
html.theme_gitgudv2 .mCard, .theme_gitgudv2 .mCard {
  background-color: var(--gg-bg-mantle) !important;
  border-radius: var(--gg-radius-md) !important;
}
html.theme_gitgudv2 .mCard > h2, .theme_gitgudv2 .mCard > h2 {
  background: var(--gg-bg-header) !important;
  color: var(--gg-accent-brown) !important;
  border-radius: var(--gg-radius-md) var(--gg-radius-md) 0 0 !important;
}
html.theme_gitgudv2 .unimportant, html.theme_gitgudv2 .unimportant *, .theme_gitgudv2 .unimportant, .theme_gitgudv2 .unimportant * {
  color: var(--gg-text-dim) !important;
}
html.theme_gitgudv2 #cookieBanner, .theme_gitgudv2 #cookieBanner {
  background-color: var(--gg-bg-surface0) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-md) !important;
}
html.theme_gitgudv2 h2, html.theme_gitgudv2 h3, .theme_gitgudv2 h2, .theme_gitgudv2 h3 {
  color: var(--gg-accent-brown) !important;
  background: var(--gg-bg-header) !important;
  border-radius: var(--gg-radius-sm) !important;
  padding: 6px 12px !important;
}
html.theme_gitgudv2 progress, .theme_gitgudv2 progress {
  background: var(--gg-bg-surface0) !important;
  border-radius: var(--gg-radius-full) !important;
}
html.theme_gitgudv2 progress::-webkit-progress-value, .theme_gitgudv2 progress::-webkit-progress-value {
  background: var(--gg-accent-green) !important;
  border-radius: var(--gg-radius-full) !important;
}
html.theme_gitgudv2 progress::-moz-progress-bar, .theme_gitgudv2 progress::-moz-progress-bar {
  background: var(--gg-accent-green) !important;
  border-radius: var(--gg-radius-full) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Custom Scrollbar */
}
html.theme_gitgudv2 *, .theme_gitgudv2 * {
  scrollbar-color: var(--gg-bg-surface1) var(--gg-bg-crust) !important;
}
html.theme_gitgudv2 hr, .theme_gitgudv2 hr {
  border-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 ::selection, .theme_gitgudv2 ::selection {
  background: var(--gg-accent-purple) !important;
  color: var(--gg-bg-base) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 3. POST CARDS & REPLY CELLS --- */
}
html.theme_gitgudv2 .markedPost, html.theme_gitgudv2 div.postCell:target .innerPost, .theme_gitgudv2 .markedPost, .theme_gitgudv2 div.postCell:target .innerPost {
  outline-color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .quoteTooltip > div, .theme_gitgudv2 .quoteTooltip > div {
  border-color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .innerPost, html.theme_gitgudv2 .markedPost, .theme_gitgudv2 .innerPost, .theme_gitgudv2 .markedPost {
  background: var(--gg-bg-surface0) !important;
  border-radius: var(--gg-radius-md) !important;
  border: 1px solid var(--gg-bg-surface1) !important;
  box-shadow: var(--gg-shadow-sm) !important;
  padding: 10px 14px !important;
  transition: transform var(--gg-trans-fast), box-shadow var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 .innerPost:hover, html.theme_gitgudv2 .markedPost:hover, .theme_gitgudv2 .innerPost:hover, .theme_gitgudv2 .markedPost:hover {
  box-shadow: var(--gg-shadow-md) !important;
  transform: translateY(-1px) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Remove ancient visual clutter ">>" prefix */
}
html.theme_gitgudv2 .divPosts .postCell .innerPost::before, .theme_gitgudv2 .divPosts .postCell .innerPost::before {
  content: "" !important;
}
html.theme_gitgudv2 .topBoards a, html.theme_gitgudv2 .floatingMenu, .theme_gitgudv2 .topBoards a, .theme_gitgudv2 .floatingMenu {
  background: var(--gg-bg-surface0) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 #watchedMenu .watchedCellLabel a, .theme_gitgudv2 #watchedMenu .watchedCellLabel a {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 { /* watched-threads menu links (theme's interactive accent) */ }
html.theme_gitgudv2 .innerOP .expandLabel, html.theme_gitgudv2 .innerOP .collapseLabel, .theme_gitgudv2 .innerOP .expandLabel, .theme_gitgudv2 .innerOP .collapseLabel {
  background: var(--gg-bg-mantle) !important;
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .innerOP .bottomGradient, .theme_gitgudv2 .innerOP .bottomGradient {
  background: linear-gradient(transparent, var(--gg-bg-mantle)) !important;
}
html.theme_gitgudv2 .innerPost .expandLabel, html.theme_gitgudv2 .innerPost .collapseLabel, .theme_gitgudv2 .innerPost .expandLabel, .theme_gitgudv2 .innerPost .collapseLabel {
  background: var(--gg-bg-surface0) !important;
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .markedPost .expandLabel, html.theme_gitgudv2 .markedPost .collapseLabel, .theme_gitgudv2 .markedPost .expandLabel, .theme_gitgudv2 .markedPost .collapseLabel {
  background: var(--gg-bg-surface0) !important;
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .innerPost .bottomGradient, .theme_gitgudv2 .innerPost .bottomGradient {
  background: linear-gradient(transparent, var(--gg-bg-surface0)) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Rounded Thumbnails & Hover Overlay */
}
html.theme_gitgudv2 .innerPost .panelUploads .uploadCell,
html.theme_gitgudv2 .markedPost .panelUploads .uploadCell, .theme_gitgudv2 .innerPost .panelUploads .uploadCell,
.theme_gitgudv2 .markedPost .panelUploads .uploadCell {
  background: var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-sm) !important;
  padding: 6px !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Upload metadata opacity reveal on hover */
}
html.theme_gitgudv2 .uploadDetails, .theme_gitgudv2 .uploadDetails {
  opacity: 0.6 !important;
  transition: opacity var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 .uploadCell:hover .uploadDetails, .theme_gitgudv2 .uploadCell:hover .uploadDetails {
  opacity: 1 !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 4. CATALOG VIEW --- */
}
html.theme_gitgudv2 .catalogCell, .theme_gitgudv2 .catalogCell {
  background: var(--gg-bg-surface0) !important;
  border-radius: var(--gg-radius-lg) !important;
  border: 1px solid var(--gg-bg-surface1) !important;
  transition: transform var(--gg-trans-fast), box-shadow var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 .catalogCell:hover, .theme_gitgudv2 .catalogCell:hover {
  background: var(--gg-bg-surface1) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--gg-shadow-md) !important;
}
html.theme_gitgudv2 .catalogCell:hover .divMessage, html.theme_gitgudv2 .catalogCell:focus .divMessage, .theme_gitgudv2 .catalogCell:hover .divMessage, .theme_gitgudv2 .catalogCell:focus .divMessage {
  background: transparent !important;
  outline-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 .catalogCell .labelSubject, .theme_gitgudv2 .catalogCell .labelSubject {
  color: var(--gg-accent-red) !important;
  font-weight: 600 !important;
}
html.theme_gitgudv2 .threadStats, .theme_gitgudv2 .threadStats {
  color: var(--gg-text-sub) !important;
  font-size: 0.85em !important;
}
html.theme_gitgudv2 .linkThumb img, .theme_gitgudv2 .linkThumb img {
  border: 1px solid var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 5. POSTING FORM (MODERN LAYOUT OVERHAUL) --- */
  /* Hide the 2005-era table headers on the left */
}
html.theme_gitgudv2 div#postingForm > form > table#postingTable > tbody > tr > th,
html.theme_gitgudv2 #postingForm th,
html.theme_gitgudv2 .modalTableBody th, .theme_gitgudv2 div#postingForm > form > table#postingTable > tbody > tr > th,
.theme_gitgudv2 #postingForm th,
.theme_gitgudv2 .modalTableBody th {
  display: none !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Hide rules row */
}
html.theme_gitgudv2 #rules_row, .theme_gitgudv2 #rules_row {
  display: none !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Input fields styling */
}
html.theme_gitgudv2 input, html.theme_gitgudv2 textarea, html.theme_gitgudv2 select, .theme_gitgudv2 input, .theme_gitgudv2 textarea, .theme_gitgudv2 select {
  background-color: var(--gg-bg-mantle) !important;
  color: var(--gg-text-main) !important;
  border: 1px solid var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-sm) !important;
  padding: 8px 12px !important;
  transition: border-color var(--gg-trans-fast), box-shadow var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 input:focus, html.theme_gitgudv2 textarea:focus, html.theme_gitgudv2 select:focus, .theme_gitgudv2 input:focus, .theme_gitgudv2 textarea:focus, .theme_gitgudv2 select:focus {
  border-color: var(--gg-accent-purple) !important;
  box-shadow: 0 0 0 2px rgba(168, 114, 204, 0.25) !important;
  outline: none !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Unhide Placeholders */
}
html.theme_gitgudv2 input::placeholder, html.theme_gitgudv2 textarea::placeholder, .theme_gitgudv2 input::placeholder, .theme_gitgudv2 textarea::placeholder {
  color: var(--gg-text-dim) !important;
  opacity: 1 !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Card shell + chips + drawer + button (standardization pass) */
}
html.theme_gitgudv2 .post-card, .theme_gitgudv2 .post-card {
  background: var(--gg-bg-mantle) !important;
  border-color: var(--gg-bg-surface1) !important;
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 .post-card .toggle-badge, .theme_gitgudv2 .post-card .toggle-badge {
  background: var(--gg-bg-surface0) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .post-card .advanced-drawer, .theme_gitgudv2 .post-card .advanced-drawer {
  background: var(--gg-bg-crust) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .post-card .drawer-toggle, .theme_gitgudv2 .post-card .drawer-toggle {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .post-card .btn-submit, .theme_gitgudv2 .post-card .btn-submit {
  background: var(--gg-accent-purple) !important;
  color: var(--gg-bg-base) !important;
  border-radius: var(--gg-radius-sm) !important;
  transition: background var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 .post-card .btn-submit:hover, .theme_gitgudv2 .post-card .btn-submit:hover {
  background: var(--gg-accent-hover) !important;
}
html.theme_gitgudv2 .post-card .post-rules-panel, .theme_gitgudv2 .post-card .post-rules-panel {
  background: var(--gg-bg-mantle) !important;
  border-color: var(--gg-bg-surface1) !important;
  color: var(--gg-text-sub) !important;
  box-shadow: var(--gg-shadow-md) !important;
}
html.theme_gitgudv2 .post-card .post-rules-panel a, .theme_gitgudv2 .post-card .post-rules-panel a {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .post-card .rules-line, .theme_gitgudv2 .post-card .rules-line {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .post-card .rules-line a, .theme_gitgudv2 .post-card .rules-line a {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .post-card .captchaImage, .theme_gitgudv2 .post-card .captchaImage {
  background: var(--gg-bg-surface0) !important;
}
html.theme_gitgudv2 .post-card .captchaTimer, .theme_gitgudv2 .post-card .captchaTimer {
  color: var(--gg-text-dim) !important;
  opacity: 1 !important;
}
html.theme_gitgudv2 .post-card .no-cookie-link, .theme_gitgudv2 .post-card .no-cookie-link {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Modern Dropzone Target */
}
html.theme_gitgudv2 .dropzone, .theme_gitgudv2 .dropzone {
  color: var(--gg-text-sub) !important;
  background-color: rgba(46, 43, 54, 0.5) !important;
  border: 2px dashed var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-md) !important;
  padding: 16px !important;
  transition: all var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 .dropzone:hover, .theme_gitgudv2 .dropzone:hover {
  color: var(--gg-text-main) !important;
  background-color: var(--gg-bg-surface1) !important;
  border-color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .dragAndDropDiv, html.theme_gitgudv2 .dragAndDropThumb, .theme_gitgudv2 .dragAndDropDiv, .theme_gitgudv2 .dragAndDropThumb {
  color: var(--gg-text-main) !important;
  background-color: rgba(61, 58, 71, 0.5) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .innerOP .panelUploads .uploadCell, .theme_gitgudv2 .innerOP .panelUploads .uploadCell {
  background: var(--gg-bg-mantle) !important;
}
html.theme_gitgudv2 #selectedDiv .selectedCell, .theme_gitgudv2 #selectedDiv .selectedCell {
  background: var(--gg-bg-surface0) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .removeButton, .theme_gitgudv2 .removeButton {
  color: var(--gg-text-dim) !important;
  transition: color var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 .removeButton:hover, .theme_gitgudv2 .removeButton:hover {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 6. NAVIGATION & MENUS --- */
}
html.theme_gitgudv2 #topNav, .theme_gitgudv2 #topNav {
  background: transparent !important;
}
html.theme_gitgudv2 #topNav.active, html.theme_gitgudv2 #topNav.fixed, .theme_gitgudv2 #topNav.active, .theme_gitgudv2 #topNav.fixed {
  background: rgba(26, 24, 30, 0.85) !important;
  backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid var(--gg-bg-surface1) !important;
  box-shadow: var(--gg-shadow-sm) !important;
}
html.theme_gitgudv2 .divPages, html.theme_gitgudv2 #divPages, .theme_gitgudv2 .divPages, .theme_gitgudv2 #divPages {
  border-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 .extraMenu a, .theme_gitgudv2 .extraMenu a {
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 .extraMenu div:hover, html.theme_gitgudv2 .hideMenu div:hover, .theme_gitgudv2 .extraMenu div:hover, .theme_gitgudv2 .hideMenu div:hover {
  background: var(--gg-bg-surface1) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .extraMenu, html.theme_gitgudv2 .hideMenu, .theme_gitgudv2 .extraMenu, .theme_gitgudv2 .hideMenu {
  border-color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .modalHeader, html.theme_gitgudv2 #quick-reply .handle, .theme_gitgudv2 .modalHeader, .theme_gitgudv2 #quick-reply .handle {
  background: var(--gg-bg-header) !important;
  color: var(--gg-accent-brown) !important;
  border-radius: var(--gg-radius-md) var(--gg-radius-md) 0 0 !important;
  padding: 6px 12px !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 7. LINKS & INTERACTIVE TEXT --- */
}
html.theme_gitgudv2 a, html.theme_gitgudv2 .reportdeletebuttons, .theme_gitgudv2 a, .theme_gitgudv2 .reportdeletebuttons {
  color: var(--gg-accent-purple) !important;
  transition: color var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 a:hover, .theme_gitgudv2 a:hover {
  color: var(--gg-accent-hover) !important;
  text-decoration: none !important;
}
html.theme_gitgudv2 .handle a, .theme_gitgudv2 .handle a {
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2 .linkName, .theme_gitgudv2 .linkName {
  color: var(--gg-accent-brown) !important;
  font-weight: 600 !important;
}
html.theme_gitgudv2 .linkName:hover, .theme_gitgudv2 .linkName:hover {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .linkQuote, html.theme_gitgudv2 .linkSelf, .theme_gitgudv2 .linkQuote, .theme_gitgudv2 .linkSelf {
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 h2 a:link, .theme_gitgudv2 h2 a:link {
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2 h2 a:visited, .theme_gitgudv2 h2 a:visited {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 8. CHAN MARKUP & SPOILERS --- */
}
html.theme_gitgudv2 .greenText, html.theme_gitgudv2 .quote, .theme_gitgudv2 .greenText, .theme_gitgudv2 .quote {
  color: var(--gg-accent-green) !important;
}
html.theme_gitgudv2 .redText, .theme_gitgudv2 .redText {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .orangeText, .theme_gitgudv2 .orangeText {
  color: var(--gg-accent-orange) !important;
}
html.theme_gitgudv2 .brackets::after, html.theme_gitgudv2 .brackets::before, .theme_gitgudv2 .brackets::after, .theme_gitgudv2 .brackets::before {
  color: var(--gg-text-dim) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Modern Spoilers */
}
html.theme_gitgudv2 span.spoiler, .theme_gitgudv2 span.spoiler {
  background: var(--gg-bg-surface1) !important;
  color: var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-sm) !important;
  padding: 0 4px !important;
  transition: all var(--gg-trans-fast) !important;
}
html.theme_gitgudv2 span.spoiler:hover, .theme_gitgudv2 span.spoiler:hover {
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 span.spoiler > .greenText, .theme_gitgudv2 span.spoiler > .greenText {
  color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 span.spoiler > .orangeText, .theme_gitgudv2 span.spoiler > .orangeText {
  color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 span.spoiler > a, .theme_gitgudv2 span.spoiler > a {
  color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 span.spoiler:hover > .greenText, .theme_gitgudv2 span.spoiler:hover > .greenText {
  color: var(--gg-accent-green) !important;
}
html.theme_gitgudv2 span.spoiler:hover > .orangeText, .theme_gitgudv2 span.spoiler:hover > .orangeText {
  color: var(--gg-accent-orange) !important;
}
html.theme_gitgudv2 span.spoiler:hover > a, .theme_gitgudv2 span.spoiler:hover > a {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 9. MODALS, PANELS & GLASSMORPHISM --- */
}
html.theme_gitgudv2 #quick-reply table, html.theme_gitgudv2 .modalDecorationPanel, .theme_gitgudv2 #quick-reply table, .theme_gitgudv2 .modalDecorationPanel {
  background: var(--gg-bg-mantle) !important;
  border: 1px solid var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-md) !important;
  box-shadow: var(--gg-shadow-md) !important;
  outline-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Settings menu — full color table (2026-08-17): base _settingsMenu.scss is
     dark-plum; now every surface uses the GitGud V2 palette (same surface set as green). */
}
html.theme_gitgudv2 #settingsMenu, .theme_gitgudv2 #settingsMenu {
  background: var(--gg-bg-base) !important;
  color: var(--gg-text-main) !important;
  border-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #settingsMenu > .header, .theme_gitgudv2 #settingsMenu > .header {
  background: var(--gg-bg-header) !important;
  color: var(--gg-accent-brown) !important;
  border-bottom-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #settingsMenu > div:nth-child(3), html.theme_gitgudv2 #settingsMenu > div:nth-child(4), .theme_gitgudv2 #settingsMenu > div:nth-child(3), .theme_gitgudv2 #settingsMenu > div:nth-child(4) {
  background: var(--gg-bg-mantle) !important;
}
html.theme_gitgudv2 #settingsMenu .settingsTab, .theme_gitgudv2 #settingsMenu .settingsTab {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 #settingsMenu .settingsTab:hover, html.theme_gitgudv2 #settingsMenu .settingsTab:focus, .theme_gitgudv2 #settingsMenu .settingsTab:hover, .theme_gitgudv2 #settingsMenu .settingsTab:focus {
  background: var(--gg-bg-surface0) !important;
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 #settingsMenu #selectedTab, .theme_gitgudv2 #settingsMenu #selectedTab {
  background: var(--gg-accent-purple) !important;
  color: var(--gg-bg-base) !important;
}
html.theme_gitgudv2 #settingsMenu .settingsSectionTitle, .theme_gitgudv2 #settingsMenu .settingsSectionTitle {
  color: var(--gg-text-sub) !important;
  border-bottom-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #settingsMenu .settingName, .theme_gitgudv2 #settingsMenu .settingName {
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 #settingsMenu .settingDesc, .theme_gitgudv2 #settingsMenu .settingDesc {
  color: var(--gg-text-dim) !important;
}
html.theme_gitgudv2 #settingsMenu .settingsCheckbox, .theme_gitgudv2 #settingsMenu .settingsCheckbox {
  accent-color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 #settingsMenu .saveButton, .theme_gitgudv2 #settingsMenu .saveButton {
  background: var(--gg-accent-purple) !important;
  color: var(--gg-bg-base) !important;
}
html.theme_gitgudv2 #settingsMenu .saveButton:hover, .theme_gitgudv2 #settingsMenu .saveButton:hover {
  background: var(--gg-accent-hover) !important;
}
html.theme_gitgudv2 #settingsMenu #newFilterPanel select, html.theme_gitgudv2 #settingsMenu #newFilterPanel input[type=text], .theme_gitgudv2 #settingsMenu #newFilterPanel select, .theme_gitgudv2 #settingsMenu #newFilterPanel input[type=text] {
  background: var(--gg-bg-crust) !important;
  color: var(--gg-text-main) !important;
  border-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #settingsMenu #newFilterPanel button, .theme_gitgudv2 #settingsMenu #newFilterPanel button {
  background: var(--gg-bg-surface0) !important;
  color: var(--gg-text-main) !important;
  border-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #settingsMenu #newFilterPanel button:hover, .theme_gitgudv2 #settingsMenu #newFilterPanel button:hover {
  background: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #settingsMenu .existingFilterTypeLabel, html.theme_gitgudv2 #settingsMenu .existingFilterContentLabel, .theme_gitgudv2 #settingsMenu .existingFilterTypeLabel, .theme_gitgudv2 #settingsMenu .existingFilterContentLabel {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 #settingsMenu .filterDeleteButton, .theme_gitgudv2 #settingsMenu .filterDeleteButton {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 #settingsMenu .filterDeleteButton:hover, .theme_gitgudv2 #settingsMenu .filterDeleteButton:hover {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 #settingsMenu #themeSelector, html.theme_gitgudv2 #settingsMenu #cssInput, .theme_gitgudv2 #settingsMenu #themeSelector, .theme_gitgudv2 #settingsMenu #cssInput {
  background: var(--gg-bg-crust) !important;
  color: var(--gg-text-main) !important;
  border-color: var(--gg-bg-surface1) !important;
}
html.theme_gitgudv2 #closeSettingsMenuButton, .theme_gitgudv2 #closeSettingsMenuButton {
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2 .captchaTimer, .theme_gitgudv2 .captchaTimer {
  background: var(--gg-bg-mantle) !important;
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2 .modalInnerDecorationPanel, html.theme_gitgudv2 .post-table, .theme_gitgudv2 .modalInnerDecorationPanel, .theme_gitgudv2 .post-table {
  background-color: var(--gg-bg-mantle) !important;
}
html.theme_gitgudv2 .modalPanel, .theme_gitgudv2 .modalPanel {
  background: rgba(18, 17, 21, 0.75) !important;
  backdrop-filter: blur(8px) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 10. LABELS, METADATA & BADGES --- */
  /* Desktop-only: on <=479px .labelId is the color-coded ID dot (inline
     background-color:#<idhash> + font-size:0 sphere in _posting.scss) — these
     !important rules would stomp the dot's identity and re-expose the ID text. */
}
@media (min-width: 500px) {
  html.theme_gitgudv2 .labelId, .theme_gitgudv2 .labelId {
    color: var(--gg-accent-brown) !important;
    background: var(--gg-bg-mantle) !important;
    padding: 1px 6px !important;
    border-radius: var(--gg-radius-full) !important;
    font-size: 0.85em !important;
  }
}
html.theme_gitgudv2 .labelCreated, html.theme_gitgudv2 .spanId, .theme_gitgudv2 .labelCreated, .theme_gitgudv2 .spanId {
  color: var(--gg-text-dim) !important;
}
html.theme_gitgudv2 .labelRole, .theme_gitgudv2 .labelRole {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .labelSubject, .theme_gitgudv2 .labelSubject {
  color: var(--gg-accent-red) !important;
  font-weight: 600 !important;
}
html.theme_gitgudv2 .labelOmission, .theme_gitgudv2 .labelOmission {
  color: var(--gg-text-dim) !important;
}
html.theme_gitgudv2 .panelBacklinks a, .theme_gitgudv2 .panelBacklinks a {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .panelBacklinks a:hover, .theme_gitgudv2 .panelBacklinks a:hover {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .quoteLink, html.theme_gitgudv2 .quoteLink:hover, .theme_gitgudv2 .quoteLink, .theme_gitgudv2 .quoteLink:hover {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .uploadDetails, .theme_gitgudv2 .uploadDetails {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .navLinkSpan, .theme_gitgudv2 .navLinkSpan {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Upload & Preview Area */
}
html.theme_gitgudv2 #divOekaki, .theme_gitgudv2 #divOekaki {
  background-color: var(--gg-bg-mantle) !important;
  border-radius: var(--gg-radius-md) !important;
}
html.theme_gitgudv2 #previewContainer, .theme_gitgudv2 #previewContainer {
  background: rgba(18, 17, 21, 0.85) !important;
  backdrop-filter: blur(6px) !important;
}
html.theme_gitgudv2 .fileBrowser, .theme_gitgudv2 .fileBrowser {
  background: none !important;
  color: var(--gg-text-main) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Front Page / Latest Posts */
}
html.theme_gitgudv2 #divLatestPosts .latestPostCell, .theme_gitgudv2 #divLatestPosts .latestPostCell {
  background: var(--gg-bg-surface0) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* border-radius intentionally NOT set here (2026-08-21): the base _index.scss
     rule gives every theme a uniform 8px radius on these cells; an earlier 4px
     !important override made gitgudv2's corners differ from all other themes. */
}
html.theme_gitgudv2 #divLatestImages img, .theme_gitgudv2 #divLatestImages img {
  border-color: var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* Boards list */
}
html.theme_gitgudv2 #boardsCellHeader span, .theme_gitgudv2 #boardsCellHeader span {
  background: var(--gg-bg-mantle) !important;
  color: var(--gg-text-main) !important;
  border-color: var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .boardsCell:nth-of-type(2n+1) span, .theme_gitgudv2 .boardsCell:nth-of-type(2n+1) span {
  background-color: rgba(255, 255, 255, 0.03) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 11. CODE HIGHLIGHTING (HIGHLIGHT.JS) --- */
}
html.theme_gitgudv2 .hljs, .theme_gitgudv2 .hljs {
  background: var(--gg-bg-crust) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-md) !important;
  font-family: var(--gg-font-mono) !important;
  padding: 12px !important;
}
html.theme_gitgudv2 .hljs-comment, html.theme_gitgudv2 .hljs-quote, .theme_gitgudv2 .hljs-comment, .theme_gitgudv2 .hljs-quote {
  color: var(--gg-text-dim) !important;
}
html.theme_gitgudv2 .hljs-keyword, .theme_gitgudv2 .hljs-keyword {
  color: var(--gg-accent-purple) !important;
}
html.theme_gitgudv2 .hljs-string, .theme_gitgudv2 .hljs-string {
  color: var(--gg-accent-green) !important;
}
html.theme_gitgudv2 .hljs-number, .theme_gitgudv2 .hljs-number {
  color: var(--gg-accent-orange) !important;
}
html.theme_gitgudv2 .hljs-title, .theme_gitgudv2 .hljs-title {
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2 .hljs-variable, .theme_gitgudv2 .hljs-variable {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 {
  /* --- 12. CAPTCHA, BANS & MISC OVERRIDES --- */
}
html.theme_gitgudv2 #labelCaptchaId, .theme_gitgudv2 #labelCaptchaId {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 #solved, .theme_gitgudv2 #solved {
  color: var(--gg-accent-green) !important;
}
html.theme_gitgudv2 .divBanMessage, .theme_gitgudv2 .divBanMessage {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .dot, .theme_gitgudv2 .dot {
  background-color: var(--gg-accent-orange) !important;
}
html.theme_gitgudv2 .medals .text, .theme_gitgudv2 .medals .text {
  background-color: var(--gg-bg-surface0) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .mobileAlert, .theme_gitgudv2 .mobileAlert {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .radiospan, .theme_gitgudv2 .radiospan {
  color: var(--gg-bg-crust) !important;
  background-color: var(--gg-accent-red) !important;
  border-radius: var(--gg-radius-full) !important;
}
html.theme_gitgudv2 #boardContentLinks, .theme_gitgudv2 #boardContentLinks {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 #reportActions, .theme_gitgudv2 #reportActions {
  background-color: var(--gg-bg-surface0) !important;
}
html.theme_gitgudv2 .contentAction, .theme_gitgudv2 .contentAction {
  background: var(--gg-bg-mantle) !important;
  border-color: var(--gg-bg-surface1) !important;
  border-radius: var(--gg-radius-md) !important;
}
html.theme_gitgudv2 .appealForm table tr th, html.theme_gitgudv2 table.modInfo tr th, .theme_gitgudv2 .appealForm table tr th, .theme_gitgudv2 table.modInfo tr th {
  background: var(--gg-bg-header) !important;
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2 .captchaImage, .theme_gitgudv2 .captchaImage {
  background-color: var(--gg-bg-mantle) !important;
  color: var(--gg-text-main) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 .contentOmissionIndicator, .theme_gitgudv2 .contentOmissionIndicator {
  color: var(--gg-text-sub) !important;
}
html.theme_gitgudv2 .linkFollow, .theme_gitgudv2 .linkFollow {
  color: var(--gg-accent-green) !important;
}
html.theme_gitgudv2 .linkFollowAlt, .theme_gitgudv2 .linkFollowAlt {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .mFixed, .theme_gitgudv2 .mFixed {
  background: var(--gg-bg-mantle) !important;
}
html.theme_gitgudv2 .noEmailName, .theme_gitgudv2 .noEmailName {
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2 .sage, html.theme_gitgudv2 .bumpLockIndicator, .theme_gitgudv2 .sage, .theme_gitgudv2 .bumpLockIndicator {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 .watchedNotification::before, .theme_gitgudv2 .watchedNotification::before {
  color: var(--gg-accent-red) !important;
}
html.theme_gitgudv2 div.titlebar, .theme_gitgudv2 div.titlebar {
  background: var(--gg-bg-header) !important;
  color: var(--gg-accent-brown) !important;
  border-radius: var(--gg-radius-sm) !important;
}
html.theme_gitgudv2 #siteName, .theme_gitgudv2 #siteName {
  color: var(--gg-accent-brown) !important;
}
html.theme_gitgudv2, .theme_gitgudv2 { /* main site title — theme's header-title hue (was falling back to base body text) */ }

html.theme_gitgud, .theme_gitgud {
  color-scheme: dark;
  background: #211f26 none;
  color: #e2ded9;
  /* ==========================================================================
     GitGud Dark Plum / Brown / Cream - Fully Overridden Theme File
     ========================================================================== */
}
html.theme_gitgud, .theme_gitgud {
  /* Core Variables */
  /* Deep dark plum background */
  /* Darker inputs / panels */
  /* Code blocks / deepest layer */
  /* Post cards / floating menus */
  /* Hover highlights / upload cells */
  /* Signature GitGud deep purple header */
  /* Off-white / cream text */
  /* Muted brown-gray text */
  /* Borders / muted icons */
  /* Links / interactive elements */
  /* Link hover */
  /* Header titles / names */
  /* Sage quote text */
  /* Subjects / errors */
  /* Warnings */
  /* Base Structure & Page Elements */
  background: #211f26 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud body, .theme_gitgud body {
  background: #211f26 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud #footer, .theme_gitgud #footer {
  color: #b3aba2 !important;
}
html.theme_gitgud #news, .theme_gitgud #news {
  background: #1a181e !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .hiddenThread, .theme_gitgud .hiddenThread {
  background: #2e2b36 !important;
}
html.theme_gitgud .kCard .kBody,
html.theme_gitgud #indexWrapper #indexLeft > div,
html.theme_gitgud #indexWrapper #indexRight > div,
html.theme_gitgud #subpageWrapper > div,
html.theme_gitgud #redirect > div, .theme_gitgud .kCard .kBody,
.theme_gitgud #indexWrapper #indexLeft > div,
.theme_gitgud #indexWrapper #indexRight > div,
.theme_gitgud #subpageWrapper > div,
.theme_gitgud #redirect > div {
  background-color: #1a181e !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud .mCard, .theme_gitgud .mCard {
  background-color: #1a181e !important;
}
html.theme_gitgud .mCard > h2, .theme_gitgud .mCard > h2 {
  background: #3e2a47 !important;
  color: #cbb092 !important;
}
html.theme_gitgud .unimportant, html.theme_gitgud .unimportant *, .theme_gitgud .unimportant, .theme_gitgud .unimportant * {
  color: #857d75 !important;
}
html.theme_gitgud #cookieBanner, .theme_gitgud #cookieBanner {
  background-color: #2e2b36 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud h2, html.theme_gitgud h3, .theme_gitgud h2, .theme_gitgud h3 {
  color: #cbb092 !important;
  background: #3e2a47 !important;
}
html.theme_gitgud progress, .theme_gitgud progress {
  background: #2e2b36 !important;
}
html.theme_gitgud progress::-webkit-progress-value, .theme_gitgud progress::-webkit-progress-value {
  background: #87b279 !important;
}
html.theme_gitgud progress::-moz-progress-bar, .theme_gitgud progress::-moz-progress-bar {
  background: #87b279 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Scrollbars, rules & selection (standardization pass) */
}
html.theme_gitgud *, .theme_gitgud * {
  scrollbar-color: #3d3a47 #121115 !important;
}
html.theme_gitgud hr, .theme_gitgud hr {
  border-color: #3d3a47 !important;
}
html.theme_gitgud ::selection, .theme_gitgud ::selection {
  background: #a872cc !important;
  color: #211f26 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Posts & Reply Cells */
}
html.theme_gitgud .topBoards a, html.theme_gitgud .innerPost, html.theme_gitgud .markedPost, html.theme_gitgud .floatingMenu, .theme_gitgud .topBoards a, .theme_gitgud .innerPost, .theme_gitgud .markedPost, .theme_gitgud .floatingMenu {
  background: #2e2b36 !important;
}
html.theme_gitgud #watchedMenu .watchedCellLabel a, .theme_gitgud #watchedMenu .watchedCellLabel a {
  color: #cbb092 !important;
}
html.theme_gitgud, .theme_gitgud { /* watched-threads menu links (theme's name/link token) */ }
html.theme_gitgud .markedPost, html.theme_gitgud div.postCell:target .innerPost, .theme_gitgud .markedPost, .theme_gitgud div.postCell:target .innerPost {
  outline-color: #a872cc !important;
}
html.theme_gitgud .quoteTooltip > div, .theme_gitgud .quoteTooltip > div {
  border-color: #a872cc !important;
}
html.theme_gitgud .uploadDetails, .theme_gitgud .uploadDetails {
  color: #b3aba2 !important;
}
html.theme_gitgud .innerOP .expandLabel, html.theme_gitgud .innerOP .collapseLabel, .theme_gitgud .innerOP .expandLabel, .theme_gitgud .innerOP .collapseLabel {
  background: #1a181e !important;
  color: #b3aba2 !important;
}
html.theme_gitgud .innerOP .bottomGradient, .theme_gitgud .innerOP .bottomGradient {
  background: linear-gradient(transparent, #1a181e) !important;
}
html.theme_gitgud .innerPost .expandLabel, html.theme_gitgud .innerPost .collapseLabel, .theme_gitgud .innerPost .expandLabel, .theme_gitgud .innerPost .collapseLabel {
  background: #2e2b36 !important;
  color: #b3aba2 !important;
}
html.theme_gitgud .markedPost .expandLabel, html.theme_gitgud .markedPost .collapseLabel, .theme_gitgud .markedPost .expandLabel, .theme_gitgud .markedPost .collapseLabel {
  background: #2e2b36 !important;
  color: #b3aba2 !important;
}
html.theme_gitgud .innerPost .bottomGradient, .theme_gitgud .innerPost .bottomGradient {
  background: linear-gradient(transparent, #2e2b36) !important;
}
html.theme_gitgud .innerPost .panelUploads .uploadCell, html.theme_gitgud .markedPost .panelUploads .uploadCell, .theme_gitgud .innerPost .panelUploads .uploadCell, .theme_gitgud .markedPost .panelUploads .uploadCell {
  background: #3d3a47 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Catalog View */
}
html.theme_gitgud .catalogCell, .theme_gitgud .catalogCell {
  background: rgba(255, 255, 255, 0.03) !important;
}
html.theme_gitgud .catalogCell .labelSubject, .theme_gitgud .catalogCell .labelSubject {
  color: #d96c6c !important;
}
html.theme_gitgud .catalogCell:hover, .theme_gitgud .catalogCell:hover {
  background: #3d3a47 !important;
}
html.theme_gitgud .catalogCell:hover .divMessage, html.theme_gitgud .catalogCell:focus .divMessage, .theme_gitgud .catalogCell:hover .divMessage, .theme_gitgud .catalogCell:focus .divMessage {
  background: #3d3a47 !important;
  outline-color: #3d3a47 !important;
}
html.theme_gitgud .threadStats, .theme_gitgud .threadStats {
  color: #b3aba2 !important;
}
html.theme_gitgud .linkThumb img, .theme_gitgud .linkThumb img {
  border: 1px solid #3d3a47 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Navigation & Menus */
}
html.theme_gitgud #topNav, .theme_gitgud #topNav {
  background: transparent !important;
}
html.theme_gitgud #topNav.active, html.theme_gitgud #topNav.fixed, .theme_gitgud #topNav.active, .theme_gitgud #topNav.fixed {
  background: #1a181e !important;
  border-bottom: 1px solid #3d3a47 !important;
}
html.theme_gitgud .divPages, html.theme_gitgud #divPages, .theme_gitgud .divPages, .theme_gitgud #divPages {
  border-color: #3d3a47 !important;
}
html.theme_gitgud .extraMenu a, .theme_gitgud .extraMenu a {
  color: #e2ded9 !important;
}
html.theme_gitgud .extraMenu div:hover, html.theme_gitgud .hideMenu div:hover, .theme_gitgud .extraMenu div:hover, .theme_gitgud .hideMenu div:hover {
  background: #3d3a47 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .extraMenu, html.theme_gitgud .hideMenu, .theme_gitgud .extraMenu, .theme_gitgud .hideMenu {
  border-color: #a872cc !important;
}
html.theme_gitgud .modalHeader, html.theme_gitgud #quick-reply .handle, .theme_gitgud .modalHeader, .theme_gitgud #quick-reply .handle {
  background: #3e2a47 !important;
  color: #cbb092 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Links & Interactive Text */
}
html.theme_gitgud a, html.theme_gitgud .reportdeletebuttons, .theme_gitgud a, .theme_gitgud .reportdeletebuttons {
  color: #a872cc !important;
}
html.theme_gitgud a:hover, .theme_gitgud a:hover {
  color: #c28fe6 !important;
}
html.theme_gitgud .handle a, .theme_gitgud .handle a {
  color: #cbb092 !important;
}
html.theme_gitgud .linkName, .theme_gitgud .linkName {
  color: #cbb092 !important;
}
html.theme_gitgud .linkName:hover, .theme_gitgud .linkName:hover {
  color: #d96c6c !important;
}
html.theme_gitgud .linkQuote, html.theme_gitgud .linkSelf, .theme_gitgud .linkQuote, .theme_gitgud .linkSelf {
  color: #e2ded9 !important;
}
html.theme_gitgud h2 a:link, .theme_gitgud h2 a:link {
  color: #cbb092 !important;
}
html.theme_gitgud h2 a:visited, .theme_gitgud h2 a:visited {
  color: #b3aba2 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Chan Markup & Spoilers */
}
html.theme_gitgud .greenText, html.theme_gitgud .quote, .theme_gitgud .greenText, .theme_gitgud .quote {
  color: #87b279 !important;
}
html.theme_gitgud .redText, .theme_gitgud .redText {
  color: #d96c6c !important;
}
html.theme_gitgud .orangeText, .theme_gitgud .orangeText {
  color: #e09867 !important;
}
html.theme_gitgud .brackets::after, html.theme_gitgud .brackets::before, .theme_gitgud .brackets::after, .theme_gitgud .brackets::before {
  color: #857d75 !important;
}
html.theme_gitgud span.spoiler, .theme_gitgud span.spoiler {
  background: #3d3a47 !important;
  color: #3d3a47 !important;
}
html.theme_gitgud span.spoiler:hover, .theme_gitgud span.spoiler:hover {
  color: #e2ded9 !important;
}
html.theme_gitgud span.spoiler > .greenText, .theme_gitgud span.spoiler > .greenText {
  color: #3d3a47 !important;
}
html.theme_gitgud span.spoiler > .orangeText, .theme_gitgud span.spoiler > .orangeText {
  color: #3d3a47 !important;
}
html.theme_gitgud span.spoiler > a, .theme_gitgud span.spoiler > a {
  color: #3d3a47 !important;
}
html.theme_gitgud span.spoiler:hover > .greenText, .theme_gitgud span.spoiler:hover > .greenText {
  color: #87b279 !important;
}
html.theme_gitgud span.spoiler:hover > .orangeText, .theme_gitgud span.spoiler:hover > .orangeText {
  color: #e09867 !important;
}
html.theme_gitgud span.spoiler:hover > a, .theme_gitgud span.spoiler:hover > a {
  color: #a872cc !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Forms & Inputs (legacy table layout) */
}
html.theme_gitgud #postingForm th, html.theme_gitgud .modalTableBody th, .theme_gitgud #postingForm th, .theme_gitgud .modalTableBody th {
  color: #cbb092 !important;
  background: #3e2a47 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Posting form card (.post-card — redesigned 2026-08-16) */
}
html.theme_gitgud .post-card, .theme_gitgud .post-card {
  background: #1a181e !important;
  border-color: #3d3a47 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .post-card .postingInput, html.theme_gitgud .post-card textarea, html.theme_gitgud .post-card select, .theme_gitgud .post-card .postingInput, .theme_gitgud .post-card textarea, .theme_gitgud .post-card select {
  background-color: #121115 !important;
  border-color: #3d3a47 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .post-card .postingInput:focus, html.theme_gitgud .post-card textarea:focus, html.theme_gitgud .post-card select:focus, .theme_gitgud .post-card .postingInput:focus, .theme_gitgud .post-card textarea:focus, .theme_gitgud .post-card select:focus {
  border-color: #a872cc !important;
}
html.theme_gitgud .post-card input::placeholder, html.theme_gitgud .post-card textarea::placeholder, .theme_gitgud .post-card input::placeholder, .theme_gitgud .post-card textarea::placeholder {
  color: #857d75 !important;
  opacity: 1 !important;
}
html.theme_gitgud .post-card .dropzone, .theme_gitgud .post-card .dropzone {
  border-color: #3d3a47 !important;
  color: #b3aba2 !important;
  background: transparent !important;
}
html.theme_gitgud .post-card .dropzone:hover, .theme_gitgud .post-card .dropzone:hover {
  border-color: #a872cc !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .dragAndDropDiv, html.theme_gitgud .dragAndDropThumb, .theme_gitgud .dragAndDropDiv, .theme_gitgud .dragAndDropThumb {
  color: #e2ded9 !important;
  background-color: rgba(61, 58, 71, 0.5) !important;
}
html.theme_gitgud #selectedDiv .selectedCell, html.theme_gitgud #selectedDivQr .selectedCell, .theme_gitgud #selectedDiv .selectedCell, .theme_gitgud #selectedDivQr .selectedCell {
  background: #2e2b36 !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud .removeButton, .theme_gitgud .removeButton {
  color: #857d75 !important;
}
html.theme_gitgud .removeButton:hover, .theme_gitgud .removeButton:hover {
  color: #d96c6c !important;
}
html.theme_gitgud .post-card .toggle-badge, .theme_gitgud .post-card .toggle-badge {
  background: #2e2b36 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .post-card .advanced-drawer, .theme_gitgud .post-card .advanced-drawer {
  background: #121115 !important;
}
html.theme_gitgud .post-card .drawer-toggle, .theme_gitgud .post-card .drawer-toggle {
  color: #a872cc !important;
}
html.theme_gitgud .post-card .btn-submit, .theme_gitgud .post-card .btn-submit {
  background: #a872cc !important;
  color: #211f26 !important;
}
html.theme_gitgud .post-card .btn-submit:hover, .theme_gitgud .post-card .btn-submit:hover {
  background: #c28fe6 !important;
}
html.theme_gitgud .post-card .post-rules-panel, .theme_gitgud .post-card .post-rules-panel {
  background: #1a181e !important;
  border-color: #3d3a47 !important;
  color: #b3aba2 !important;
}
html.theme_gitgud .post-card .post-rules-panel a, .theme_gitgud .post-card .post-rules-panel a {
  color: #a872cc !important;
}
html.theme_gitgud .post-card .rules-line, .theme_gitgud .post-card .rules-line {
  color: #b3aba2 !important;
}
html.theme_gitgud .post-card .rules-line a, .theme_gitgud .post-card .rules-line a {
  color: #a872cc !important;
}
html.theme_gitgud .post-card .captchaImage, .theme_gitgud .post-card .captchaImage {
  background: #2e2b36 !important;
}
html.theme_gitgud .post-card .captchaTimer, .theme_gitgud .post-card .captchaTimer {
  color: #857d75 !important;
  opacity: 1 !important;
}
html.theme_gitgud .post-card .no-cookie-link, .theme_gitgud .post-card .no-cookie-link {
  color: #a872cc !important;
}
html.theme_gitgud .dragAndDropDiv, html.theme_gitgud .dragAndDropThumb, .theme_gitgud .dragAndDropDiv, .theme_gitgud .dragAndDropThumb {
  color: #e2ded9 !important;
  background-color: rgba(61, 58, 71, 0.5) !important;
}
html.theme_gitgud .dropzone, .theme_gitgud .dropzone {
  color: #b3aba2 !important;
  background-color: rgba(46, 43, 54, 0.5) !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud .dropzone:hover, .theme_gitgud .dropzone:hover {
  color: #e2ded9 !important;
  background-color: #3d3a47 !important;
}
html.theme_gitgud .innerOP .panelUploads .uploadCell, .theme_gitgud .innerOP .panelUploads .uploadCell {
  background: #1a181e !important;
}
html.theme_gitgud #selectedDiv .selectedCell, .theme_gitgud #selectedDiv .selectedCell {
  background: #2e2b36 !important;
}
html.theme_gitgud .removeButton, .theme_gitgud .removeButton {
  color: #857d75 !important;
}
html.theme_gitgud .removeButton:hover, .theme_gitgud .removeButton:hover {
  color: #d96c6c !important;
}
html.theme_gitgud input::placeholder, html.theme_gitgud textarea::placeholder, .theme_gitgud input::placeholder, .theme_gitgud textarea::placeholder {
  color: #857d75 !important;
}
html.theme_gitgud input, html.theme_gitgud textarea, html.theme_gitgud select, .theme_gitgud input, .theme_gitgud textarea, .theme_gitgud select {
  background-color: #1a181e !important;
  color: #e2ded9 !important;
  border: 1px solid #3d3a47 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Modals & Settings Menu */
}
html.theme_gitgud #quick-reply table, html.theme_gitgud .modalDecorationPanel, .theme_gitgud #quick-reply table, .theme_gitgud .modalDecorationPanel {
  background: #1a181e !important;
  border-color: #3d3a47 !important;
  outline-color: #3d3a47 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Settings menu — full color table (2026-08-17): base _settingsMenu.scss is
     dark-plum and only these frame rules overrode it, leaving tabs/titles/
     inputs/save-button on the base purple. Now every surface uses GitGud's own
     palette (same surface set as green's table). */
}
html.theme_gitgud #settingsMenu, .theme_gitgud #settingsMenu {
  background: #211f26 !important;
  color: #e2ded9 !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud #settingsMenu > .header, .theme_gitgud #settingsMenu > .header {
  background: #3e2a47 !important;
  color: #cbb092 !important;
  border-bottom-color: #3d3a47 !important;
}
html.theme_gitgud #settingsMenu > div:nth-child(3), html.theme_gitgud #settingsMenu > div:nth-child(4), .theme_gitgud #settingsMenu > div:nth-child(3), .theme_gitgud #settingsMenu > div:nth-child(4) {
  background: #1a181e !important;
}
html.theme_gitgud #settingsMenu .settingsTab, .theme_gitgud #settingsMenu .settingsTab {
  color: #b3aba2 !important;
}
html.theme_gitgud #settingsMenu .settingsTab:hover, html.theme_gitgud #settingsMenu .settingsTab:focus, .theme_gitgud #settingsMenu .settingsTab:hover, .theme_gitgud #settingsMenu .settingsTab:focus {
  background: #2e2b36 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud #settingsMenu #selectedTab, .theme_gitgud #settingsMenu #selectedTab {
  background: #a872cc !important;
  color: #211f26 !important;
}
html.theme_gitgud #settingsMenu .settingsSectionTitle, .theme_gitgud #settingsMenu .settingsSectionTitle {
  color: #b3aba2 !important;
  border-bottom-color: #3d3a47 !important;
}
html.theme_gitgud #settingsMenu .settingName, .theme_gitgud #settingsMenu .settingName {
  color: #e2ded9 !important;
}
html.theme_gitgud #settingsMenu .settingDesc, .theme_gitgud #settingsMenu .settingDesc {
  color: #857d75 !important;
}
html.theme_gitgud #settingsMenu .settingsCheckbox, .theme_gitgud #settingsMenu .settingsCheckbox {
  accent-color: #a872cc !important;
}
html.theme_gitgud #settingsMenu .saveButton, .theme_gitgud #settingsMenu .saveButton {
  background: #a872cc !important;
  color: #211f26 !important;
}
html.theme_gitgud #settingsMenu .saveButton:hover, .theme_gitgud #settingsMenu .saveButton:hover {
  background: #c28fe6 !important;
}
html.theme_gitgud #settingsMenu #newFilterPanel select, html.theme_gitgud #settingsMenu #newFilterPanel input[type=text], .theme_gitgud #settingsMenu #newFilterPanel select, .theme_gitgud #settingsMenu #newFilterPanel input[type=text] {
  background: #121115 !important;
  color: #e2ded9 !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud #settingsMenu #newFilterPanel button, .theme_gitgud #settingsMenu #newFilterPanel button {
  background: #2e2b36 !important;
  color: #e2ded9 !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud #settingsMenu #newFilterPanel button:hover, .theme_gitgud #settingsMenu #newFilterPanel button:hover {
  background: #3d3a47 !important;
}
html.theme_gitgud #settingsMenu .existingFilterTypeLabel, html.theme_gitgud #settingsMenu .existingFilterContentLabel, .theme_gitgud #settingsMenu .existingFilterTypeLabel, .theme_gitgud #settingsMenu .existingFilterContentLabel {
  color: #b3aba2 !important;
}
html.theme_gitgud #settingsMenu .filterDeleteButton, .theme_gitgud #settingsMenu .filterDeleteButton {
  color: #b3aba2 !important;
}
html.theme_gitgud #settingsMenu .filterDeleteButton:hover, .theme_gitgud #settingsMenu .filterDeleteButton:hover {
  color: #d96c6c !important;
}
html.theme_gitgud #settingsMenu #themeSelector, html.theme_gitgud #settingsMenu #cssInput, .theme_gitgud #settingsMenu #themeSelector, .theme_gitgud #settingsMenu #cssInput {
  background: #121115 !important;
  color: #e2ded9 !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud #closeSettingsMenuButton, .theme_gitgud #closeSettingsMenuButton {
  color: #cbb092 !important;
}
html.theme_gitgud .captchaTimer, .theme_gitgud .captchaTimer {
  background: #1a181e !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .modalInnerDecorationPanel, html.theme_gitgud .post-table, .theme_gitgud .modalInnerDecorationPanel, .theme_gitgud .post-table {
  background-color: #1a181e !important;
}
html.theme_gitgud .modalPanel, .theme_gitgud .modalPanel {
  background: rgba(18, 17, 21, 0.85) !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Labels & Metadata */
  /* ID badge text: full-cream like the name field (.linkName) — base opacity
     was .6, bump to 1. The black text outline is inherited from base
     _posting.scss (canonical guard against hash-color collisions). */
}
html.theme_gitgud .labelId, .theme_gitgud .labelId {
  color: #cbb092 !important;
  opacity: 1 !important;
}
html.theme_gitgud .labelCreated, html.theme_gitgud .spanId, .theme_gitgud .labelCreated, .theme_gitgud .spanId {
  color: #857d75 !important;
}
html.theme_gitgud .labelRole, .theme_gitgud .labelRole {
  color: #d96c6c !important;
}
html.theme_gitgud .labelSubject, .theme_gitgud .labelSubject {
  color: #d96c6c !important;
}
html.theme_gitgud .labelOmission, .theme_gitgud .labelOmission {
  color: #857d75 !important;
}
html.theme_gitgud .panelBacklinks a, .theme_gitgud .panelBacklinks a {
  color: #b3aba2 !important;
}
html.theme_gitgud .panelBacklinks a:hover, .theme_gitgud .panelBacklinks a:hover {
  color: #a872cc !important;
}
html.theme_gitgud .quoteLink, html.theme_gitgud .quoteLink:hover, .theme_gitgud .quoteLink, .theme_gitgud .quoteLink:hover {
  color: #a872cc !important;
}
html.theme_gitgud .navLinkSpan, .theme_gitgud .navLinkSpan {
  color: #b3aba2 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Upload & Preview Area */
}
html.theme_gitgud #divOekaki, .theme_gitgud #divOekaki {
  background-color: #1a181e !important;
}
html.theme_gitgud #previewContainer, .theme_gitgud #previewContainer {
  background: rgba(18, 17, 21, 0.7) !important;
}
html.theme_gitgud .fileBrowser, .theme_gitgud .fileBrowser {
  background: none !important;
  color: #e2ded9 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Front Page / Latest Posts */
}
html.theme_gitgud #divLatestPosts .latestPostCell, .theme_gitgud #divLatestPosts .latestPostCell {
  background: #2e2b36 !important;
}
html.theme_gitgud #divLatestImages img, .theme_gitgud #divLatestImages img {
  border-color: #3d3a47 !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Boards list */
}
html.theme_gitgud #boardsCellHeader span, .theme_gitgud #boardsCellHeader span {
  background: #1a181e !important;
  color: #e2ded9 !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud .boardsCell:nth-of-type(2n+1) span, .theme_gitgud .boardsCell:nth-of-type(2n+1) span {
  background-color: rgba(255, 255, 255, 0.03) !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Code Highlighting (highlight.js) */
}
html.theme_gitgud .hljs, .theme_gitgud .hljs {
  background: #121115 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .hljs-comment, html.theme_gitgud .hljs-quote, .theme_gitgud .hljs-comment, .theme_gitgud .hljs-quote {
  color: #857d75 !important;
}
html.theme_gitgud .hljs-keyword, .theme_gitgud .hljs-keyword {
  color: #a872cc !important;
}
html.theme_gitgud .hljs-string, .theme_gitgud .hljs-string {
  color: #87b279 !important;
}
html.theme_gitgud .hljs-number, .theme_gitgud .hljs-number {
  color: #e09867 !important;
}
html.theme_gitgud .hljs-title, .theme_gitgud .hljs-title {
  color: #cbb092 !important;
}
html.theme_gitgud .hljs-variable, .theme_gitgud .hljs-variable {
  color: #d96c6c !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Captcha, Bans & Misc */
}
html.theme_gitgud #labelCaptchaId, .theme_gitgud #labelCaptchaId {
  color: #d96c6c !important;
}
html.theme_gitgud #solved, .theme_gitgud #solved {
  color: #87b279 !important;
}
html.theme_gitgud .divBanMessage, .theme_gitgud .divBanMessage {
  color: #d96c6c !important;
}
html.theme_gitgud .dot, .theme_gitgud .dot {
  background-color: #e09867 !important;
}
html.theme_gitgud .medals .text, .theme_gitgud .medals .text {
  background-color: #2e2b36 !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .mobileAlert, .theme_gitgud .mobileAlert {
  color: #d96c6c !important;
}
html.theme_gitgud .radiospan, .theme_gitgud .radiospan {
  color: #121115 !important;
  background-color: #d96c6c !important;
}
html.theme_gitgud, .theme_gitgud {
  /* Other Base Overrides */
}
html.theme_gitgud #boardContentLinks, .theme_gitgud #boardContentLinks {
  color: #b3aba2 !important;
}
html.theme_gitgud #reportActions, .theme_gitgud #reportActions {
  background-color: #2e2b36 !important;
}
html.theme_gitgud .contentAction, .theme_gitgud .contentAction {
  background: #1a181e !important;
  border-color: #3d3a47 !important;
}
html.theme_gitgud .appealForm table tr th, html.theme_gitgud table.modInfo tr th, .theme_gitgud .appealForm table tr th, .theme_gitgud table.modInfo tr th {
  background: #3e2a47 !important;
  color: #cbb092 !important;
}
html.theme_gitgud .captchaImage, .theme_gitgud .captchaImage {
  background-color: #1a181e !important;
  color: #e2ded9 !important;
}
html.theme_gitgud .contentOmissionIndicator, .theme_gitgud .contentOmissionIndicator {
  color: #b3aba2 !important;
}
html.theme_gitgud .linkFollow, .theme_gitgud .linkFollow {
  color: #87b279 !important;
}
html.theme_gitgud .linkFollowAlt, .theme_gitgud .linkFollowAlt {
  color: #d96c6c !important;
}
html.theme_gitgud .mFixed, .theme_gitgud .mFixed {
  background: #1a181e !important;
}
html.theme_gitgud .noEmailName, .theme_gitgud .noEmailName {
  color: #cbb092 !important;
}
html.theme_gitgud .sage, html.theme_gitgud .bumpLockIndicator, .theme_gitgud .sage, .theme_gitgud .bumpLockIndicator {
  color: #d96c6c !important;
}
html.theme_gitgud .watchedNotification::before, .theme_gitgud .watchedNotification::before {
  color: #d96c6c !important;
}
html.theme_gitgud div.titlebar, .theme_gitgud div.titlebar {
  background: #3e2a47 !important;
  color: #cbb092 !important;
}
html.theme_gitgud #siteName, .theme_gitgud #siteName {
  color: #cbb092 !important;
}
html.theme_gitgud, .theme_gitgud { /* main site title — theme's header-title hue (was falling back to base body text) */ }
/*# sourceMappingURL=maps/style.css.map */