/* musechan — yotsuba B. the authentic 4chan experience. */

* { box-sizing: border-box; }

body {
  background: #FFFFEE;
  color: #800000;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10pt;
  margin: 0;
  padding: 0 0 40px 0;
}

a { color: #0000EE; text-decoration: none; }
a:hover { color: #DD0000; }

/* ---- top board nav ---- */
#boardNav {
  font-size: 9pt;
  padding: 4px 8px;
  color: #800000;
}
#boardNav a { padding: 0 2px; }

/* ---- header ---- */
header.boardHead { text-align: center; margin: 10px 0 20px; }
.boardBanner {
  font-family: Tahoma, sans-serif;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -2px;
  color: #800000;
  margin-bottom: 4px;
}
.boardBanner .muse { color: #0000EE; }
.boardTitle {
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -2px;
  color: #800000;
  font-family: Tahoma, sans-serif;
}
.boardSubtitle { font-size: 9pt; }
hr.abovePostForm { width: 90%; }
hr.belowPostForm { width: 90%; }

/* ---- post form (classic 4chan table) ---- */
.postForm {
  margin: 0 auto;
  max-width: 720px;
}
.postForm table { margin: 0 auto; border-collapse: collapse; }
.postForm td {
  padding: 1px 4px;
  font-size: 10pt;
  font-weight: bold;
  color: #800000;
  background: #EEAA88;
  border: 1px solid #800000;
}
.postForm td:first-child {
  background: #EEAA88;
  text-align: left;
}
.postForm td:last-child { background: #F0E0D6; text-align: left; font-weight: normal; }
.postForm input[type="text"],
.postForm input[type="password"],
.postForm textarea {
  font-size: 10pt;
  font-family: Arial, Helvetica, sans-serif;
  border: 1px solid #AAA;
  padding: 2px 4px;
  width: 100%;
}
.postForm input[type="submit"] { font-size: 10pt; }
.postForm .rules { font-size: 9pt; text-align: center; margin-top: 6px; }
.postForm h3, .formTitle {
  text-align: center;
  font-size: 12pt;
  color: #800000;
  margin: 8px 0;
}

/* ---- threads ---- */
.thread { margin: 12px 8px; }
.thread + hr { border: none; border-top: 1px solid #D9BFB7; margin: 20px 0; }

/* ---- posts ---- */
.post {
  background: #F0E0D6;
  border: 1px solid #D9BFB7;
  border-left: none;
  border-top: none;
  display: table;
  padding: 2px;
  margin: 4px 0;
  min-width: 300px;
}
.post.op {
  background: transparent;
  border: none;
  display: block;
  padding: 2px 0;
}
.postinfo { font-size: 10pt; }
.postinfo .subject { color: #CC1105; font-weight: bold; }
.postinfo .name { color: #117743; font-weight: bold; }
.postinfo .trip { color: #117743; }
.postinfo .datetime, .postinfo .postno { color: #800000; }
.postinfo .postno a { color: #0000EE; }
.postinfo .sage { color: #0000EE; font-weight: bold; }
.fileinfo { font-size: 9pt; color: #800000; margin: 2px 0; }
.fileinfo a { color: #0000EE; }
.filethumb { float: left; margin: 4px 12px 4px 0; }
.filethumb img { max-width: 250px; max-height: 250px; border: none; }
.comment {
  color: #800000;
  font-size: 10pt;
  margin: 12px 20px 12px 8px;
  word-wrap: break-word;
  overflow: hidden;
}
.comment .quote, .greentext { color: #789922; }
.comment a { color: #0000EE; text-decoration: underline; }
.comment a.quotelink { color: #DD0000; text-decoration: underline; }
.comment a.quotelink:hover { color: #DD0000; }
.op .comment { margin-left: 4px; }

/* ---- board index bits ---- */
.boardlisthead { display: none; }
.cataloglink { text-align: center; font-size: 10pt; margin: 8px 0; }
.omitted { color: #707070; font-size: 9pt; margin: 4px 0 4px 20px; }
.counts { color: #707070; font-size: 9pt; }
.stickyflag, .lockflag, .blim { font-size: 9pt; }
.blim { color: #CC1105; font-weight: bold; }

/* ---- catalog ---- */
.catgrid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  padding: 10px;
}
.cell {
  width: 160px;
  text-align: center;
  font-size: 9pt;
}
.cell img { max-width: 150px; max-height: 150px; }
.cellsubj { font-weight: bold; }
.notext {
  width: 150px; height: 100px;
  display: flex; align-items: center; justify-content: center;
  background: #F0E0D6; border: 1px solid #D9BFB7; color: #800000;
}

/* ---- blotter ---- */
.blotter {
  max-width: 720px;
  margin: 8px auto;
  background: #F0E0D6;
  border: 1px solid #D9BFB7;
  padding: 6px 12px;
  font-size: 9pt;
}
.blotter h3 {
  color: #CC1105;
  font-size: 11pt;
  margin: 2px 0 4px;
  text-align: center;
}
.blotter ul { margin: 4px 0; padding-left: 20px; }
.blotter li { margin: 2px 0; }

/* ---- board banner image ---- */
.boardBannerImg { margin-bottom: 8px; }
.boardBannerImg img { border: 1px solid #800000; }

/* ---- (You) highlight ---- */
.post.you { border: 2px solid #CC1105 !important; }

/* ---- home: 4chan-style board boxes ---- */
.homewrap { max-width: 900px; margin: 0 auto; padding: 10px; }
.boardbox {
  background: #F0E0D6;
  border: 1px solid #D9BFB7;
  margin: 8px;
  padding: 6px 10px;
}
.boardbox h3 {
  color: #800000;
  font-size: 12pt;
  margin: 2px 0 6px;
  border-bottom: 1px solid #D9BFB7;
  padding-bottom: 4px;
}
.boardlinks { font-size: 10pt; line-height: 1.7; }
.boardlinks a { margin-right: 6px; }
.boardtable { margin: 10px auto; border-collapse: collapse; }
.boardtable td { border: 1px solid #800000; padding: 4px 12px; background: #F0E0D6; }
.recent { margin: 6px 0; font-size: 10pt; }
.rboard { font-weight: bold; }
.rsnip { color: #800000; font-size: 9pt; }

/* ---- misc ---- */
.errbox { text-align: center; margin: 40px auto; max-width: 500px; }
.errbox h2 { color: #CC1105; }
.notice {
  background: #F0E0D6;
  border: 1px solid #D9BFB7;
  padding: 6px 10px;
  margin: 8px auto;
  max-width: 720px;
  text-align: center;
  font-size: 10pt;
}
.deleteform {
  max-width: 720px;
  margin: 16px auto;
  font-size: 10pt;
  text-align: center;
}
.deleteform h3 { font-size: 11pt; color: #800000; }
.deleteform input { font-size: 10pt; margin: 0 2px; }

footer.sitefoot {
  text-align: center;
  font-size: 9pt;
  color: #800000;
  margin-top: 30px;
  padding: 10px;
}

/* mobile: don't be awful */
@media (max-width: 700px) {
  .filethumb img { max-width: 125px; max-height: 125px; }
  .post { min-width: 0; display: block; }
  .boardBanner, .boardTitle { font-size: 22px; }
}