/* Deliberately inspired by old Japanese text BBS aesthetics; original markup. */
:root{--bg:#efefef;--ink:#111;--line:#9da6a6;--link:#0000ee;--author:#008000;--title:#b11b27}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 "MS PGothic","ＭＳ Ｐゴシック","Hiragino Kaku Gothic ProN","Yu Gothic",monospace}
a{color:var(--link);text-decoration:underline}
a:visited{color:#551a8b}
button,input,textarea{font:inherit}
button{cursor:pointer}
button:disabled{opacity:.5;cursor:not-allowed}
[hidden]{display:none!important}
.lang-en{display:none}
body[data-lang="en"] .lang-ja{display:none}
body[data-lang="en"] .lang-en{display:inline}
.bbs-shell{max-width:1100px;padding:12px 22px 45px;margin:0 auto}
.bbs-head{padding:16px 0 9px}
.bbs-head h1{font-size:30px;font-weight:bold;color:var(--title);line-height:1.4;margin:0 0 5px}
.bbs-head p{margin:5px 0}
.bbs-head .bbs-note{color:#465250;font-size:13px}
hr{height:0;border:0;border-top:1px solid #9ca4a4;margin:16px 0}
.thread-titlebar{display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.thread-titlebar h2{color:var(--title);font-size:20px;margin:8px 0;font-weight:bold}
#connection-status{font-size:12px;color:#555}
.thread-links{padding:4px 0 12px;font-size:13px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.text-button{border:0;background:transparent;color:var(--link);font-size:13px;padding:0;text-decoration:underline}
#post-count{color:#555}
.post-list{padding:0 4px}
.post{margin:0;padding:15px 0 10px;border-bottom:1px dotted #c4c4c4}
.post:target{background:#ffffd6}
.post-head{font-size:14px;display:flex;gap:7px;align-items:baseline;flex-wrap:wrap}
.post-number{font-weight:normal}
.post-author{color:var(--author);font-weight:bold}
.post-date{font-size:12px;color:#555}
.post-body{margin:10px 0 4px 25px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.8}
.post-body a{font-weight:bold;color:var(--link)}
#feedback{color:#b11b27;font-size:13px;min-height:1.4em}
.reply{padding:6px 0 24px}
.reply h3{font-size:17px;color:#335d85;margin:0 0 18px}
#post-form{max-width:690px}
.form-field{display:grid;grid-template-columns:74px minmax(0,1fr);gap:8px;margin:12px 0}
.form-field label{font-size:14px}
.form-field input,.form-field textarea{width:100%;padding:5px 6px;background:#fff;border:1px solid #777;color:#111;border-radius:0;font-size:14px}
.form-field input{max-width:280px}
.form-field textarea{min-height:142px;resize:vertical}
.form-actions{margin:10px 0 10px 82px}
.form-actions button{background:#ddd;border:1px solid #666;border-radius:2px;color:#111;padding:5px 22px}
.form-actions button:not(:disabled):hover{background:#fff}
.counter{color:#666;font-size:12px;margin-left:12px}
#turnstile-container{margin-left:82px;min-height:65px}
.honeypot{position:absolute!important;left:-9999px!important;opacity:0!important;pointer-events:none!important}
.disclaimer{font-size:12px;color:#5c5c5c}
footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;font-size:12px;color:#555}
@media(max-width:600px){.bbs-shell{padding:12px 12px 35px}.bbs-head h1{font-size:26px}.thread-titlebar h2{font-size:18px}.post-body{margin-left:12px}.form-field{grid-template-columns:1fr;gap:4px}.form-actions,#turnstile-container{margin-left:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.empty{margin:14px 0;color:#555;font-size:13px}
.thread-links{justify-content:space-between}

/* Progressive reply controls: choose a post or click its compact reply button. */
.form-field select{
  width:min(100%,450px);
  min-height:34px;
  padding:5px 10px;
  border:1px solid #858f99;
  border-radius:5px;
  background:#fff;
  color:#1e3140;
  font-size:13px;
  cursor:pointer;
}
.form-field select:disabled{opacity:.6;cursor:not-allowed}
.form-field select:focus-visible,.post-quote:focus-visible{outline:2px solid #286ed6;outline-offset:2px}
.post-quote{
  margin-left:8px;
  padding:2px 9px;
  border:1px solid #bbc4cf;
  border-radius:5px;
  color:#305a7e;
  background:#fafcff;
  font-size:12px;
  line-height:1.5;
}
.post-quote:hover{background:#e8f1ff;border-color:#789bc0}
#reply{scroll-margin-top:84px}

/* Anchored posts are fetched asynchronously; account for the fixed header. */
.post{scroll-margin-top:92px}
.post.is-referenced,.post:target{background:#fffbd6;box-shadow:inset 3px 0 0 #c99a19}
.post:focus{outline:none}
.post-reference{cursor:pointer}
@media(max-width:640px){.post{scroll-margin-top:78px}}