/* Futaba may/b palette and compact, table-like thread layout. */
html { background:#ffffee; color:#800000; }
body { margin:8px; font-family:Arial,Meiryo,"メイリオ","Hiragino Kaku Gothic ProN","Noto Sans CJK JP",sans-serif; font-size:16px; line-height:normal; }
a,a:visited { color:#0000ee; }
a:hover { color:#dd0000; }
button,input { font:13px Arial,sans-serif; }
button { cursor:pointer; }
.board-nav { text-align:right; font-size:small; }
.source-credit { clear:both; margin:16px 0 8px; font-size:small; overflow-wrap:anywhere; }
.board-title { text-align:center; font-size:24px; font-weight:bold; margin:12px 0 18px; }
.board-title small { font-size:12px; font-weight:normal; }
hr { border:0; border-top:1px solid #aaa; margin:8px 0; }
.mode-bar { text-align:center; background:#e04000; color:#fff; font-weight:bold; padding:2px; }
.thread-info { margin:8px 0 14px; font-size:small; }
.reader-form { margin:22px auto; width:530px; max-width:100%; }
.reader-form label { display:block; font-weight:bold; background:#eeaa88; padding:3px 6px; }
.reader-form input { box-sizing:border-box; width:100%; margin:5px 0; padding:3px; }
.reader-form p { font-size:small; }
.opening-post { display:flow-root; margin:0 0 12px; }
.opening-post img { float:left; border:0; margin:0 20px 8px; object-fit:contain; }
.csb { color:#cc1105; font-weight:bold; margin:0 5px; }
.cnm { color:#117743; font-weight:bold; margin:0 5px; }
.cnw { margin:0 5px; }
.cno { margin:0 15px 0 5px; }
.quote-count { margin-right:8px; font-size:small; white-space:nowrap; }
.x-preview-link { font-size:small; white-space:nowrap; }
.tweet-preview { max-width:700px; margin:16px auto; padding:12px; }
.tweet-preview h1 { font-size:18px; }
.tweet-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.5; }
.tweet-preview img,.tweet-preview video { display:block; max-width:100%; max-height:75vh; object-fit:contain; margin:8px 0; }
[data-quote-node] { cursor:pointer; text-decoration:underline; text-decoration-style:dotted; }
[data-quote-node]:hover { color:#dd0000; }
[data-quote-node]:focus-visible { outline:1px dotted #800000; }
.cntd,.rsc { font-size:small; }
.sod { color:#800000; margin:0 8px; white-space:nowrap; }
.reply { display:table; margin:2px 0 4px; max-width:100%; }
.reply::before { content:"…"; display:table-cell; vertical-align:top; width:18px; min-width:18px; }
.reply-content { display:table-cell; background:#f0e0d6; padding:1px 8px 1px 2px; min-width:460px; }
.post-meta { margin:0; line-height:normal; }
.image-link,.image-link:hover,.image-link:visited { color:inherit; text-decoration:none; background:none; }
.image-link img,.opening-post a img { border:0; }
.image-link:hover img,.opening-post a:hover img { opacity:1; filter:none; box-shadow:none; transform:none; }
blockquote { word-wrap:break-word; overflow-wrap:anywhere; max-width:800px; min-width:150px; margin:1em 40px; }
.post-image { float:left; margin:0 20px 8px; object-fit:contain; }
.file-info { margin:8px 0 4px; font-size:small; }
img,video { max-width:100%; height:auto; }
.reply-content::after { content:""; display:block; clear:both; }
.quote-line { color:#789922; cursor:pointer; }
.quote-line:hover { color:#dd0000; }
.quote-line:focus-visible { outline:1px dotted #800000; }
.quote-ambiguous { display:inline-flex; position:relative; justify-content:center; align-items:center; width:12px; height:12px; margin-left:5px; border:1px solid #ac9d87; border-radius:50%; color:#ac9d87; font:10px Arial,sans-serif; cursor:help; vertical-align:middle; }
.quote-ambiguity-tooltip { display:none; padding:6px; box-sizing:border-box; max-width:calc(100vw - 16px); max-height:min(40vh,calc(100dvh - 16px)); overflow:auto; white-space:nowrap; background:#ffffee; border:1px solid #b8a58e; color:#800000; font:12px Arial,Meiryo,sans-serif; box-shadow:1px 1px 3px #7775; }
.quote-ambiguity-tooltip.is-floating { display:block; position:fixed; z-index:1000; }
.quote-ambiguity-tooltip button { display:block; padding:4px 2px; border:0; background:transparent; color:#0000ee; text-decoration:underline; }
.quote-ambiguity-tooltip button:hover { color:#dd0000; }
body.quote-sidebar-open { margin-right:calc(40vw + 8px); }
.quote-sidebar[hidden] { display:none; }
.quote-sidebar { position:fixed; inset:0 0 0 auto; width:40vw; height:100dvh; overflow-y:auto; overscroll-behavior:contain; box-sizing:border-box; background:#ffffee; color:#800000; font:inherit; border:0; border-left:1px solid #880000; box-shadow:-2px 0 3px #7775; padding:8px; z-index:100; }
.quote-close { border:0; background:transparent; padding:6px; font-size:18px; line-height:1; }
.quote-bar { position:sticky; top:-8px; height:0; display:flex; justify-content:flex-end; align-items:flex-start; z-index:1; }
.quote-close { background:#ffffee; }
.quote-export,.quote-expand { background:#ffffee; color:#800000; border:1px solid #b8a58e; padding:3px 5px; margin:3px 4px 0 0; font-size:12px; white-space:nowrap; }
.quote-export:disabled { cursor:wait; }
.quote-sidebar > div:last-child { padding-top:2px; }
.quote-scroll-space { height:calc(100dvh - 24px); pointer-events:none; }
.quote-arrival { animation:quote-arrival-pulse 1s ease-in-out 3; outline:2px solid transparent; outline-offset:-2px; }
@keyframes quote-arrival-pulse {
  0%,100% { outline-color:transparent; box-shadow:inset 0 0 0 0 transparent; }
  50% { outline-color:#e00000; box-shadow:inset 0 0 8px #e0000033; }
}
@media(prefers-reduced-motion:reduce) {
  .quote-arrival { animation:none; outline-color:#e00000; }
}
.quote-sidebar details { margin:1px 0 3px; background:#f0e0d6; padding:1px 3px; display:flow-root; }
.quote-sidebar summary { cursor:pointer; }
.quote-sidebar summary:hover { color:#dd0000; }
.quote-sidebar summary { width:fit-content; min-width:1em; }
.quote-sidebar details[open] > summary { float:left; margin-right:4px; line-height:normal; }
.quote-serial { font-size:small; }
.quote-sidebar details[open] > summary .collapsed-number { display:none; }
.quote-sidebar article { margin:0; max-width:100%; }
.quote-sidebar .reply { display:block; }
.quote-sidebar .reply::before { display:none; }
.quote-sidebar .reply-content { display:block; min-width:0; padding:0; }
.quote-sidebar .opening-post { background:#ffffee; }
.quote-sidebar blockquote { margin:3px 4px; min-width:0; }
.quote-sidebar { line-height:1.35; }
.quote-sidebar .post-meta { overflow-wrap:anywhere; line-height:1.3; }
.quote-sidebar .csb,.quote-sidebar .cnm,.quote-sidebar .cnw { margin:0 2px; }
.quote-sidebar .cno { margin:0 4px 0 2px; }
.quote-sidebar .quote-count { margin-right:4px; }
.quote-sidebar .sod { margin:0 3px; }
.quote-sidebar .post-image { margin:3px 8px 3px 0; max-width:160px; max-height:120px; }
.quote-sidebar .opening-post img { margin:0 8px 3px 0; max-width:180px; max-height:150px; }
.quote-sidebar details { margin-left:0; }
.quote-sidebar img { max-width:100%; }
@media(max-width:600px) {
  .reply { width:100%; }
  .reply-content { min-width:0; width:100%; }
  .post-meta { line-height:1.5; }
  blockquote { margin:16px 12px; min-width:0; }
  .opening-post img,.post-image { margin:4px 12px 8px 0; max-width:45%; }
  .quote-sidebar .post-image,.quote-sidebar .opening-post img { margin:3px 6px 3px 0; max-width:min(40%,160px); }
  .cno { white-space:nowrap; }
  .quote-sidebar details { margin-left:0; }
}