/* DonationCoder.com static archive stylesheet */
:root {
  --bg: #f6f7f9; --panel: #fff; --text: #1f2328; --muted: #656d76; --line: #d8dee4;
  --accent: #0b6e99; --accent-2: #1a8fc4; --soft: #eaf4fa; --sticky: #fff7e0; --code: #f3f4f6;
}
* { box-sizing: border-box; }
html { font-size: 15px; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; line-height: 1.5;
       color: var(--text); background: var(--bg); }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; }
code, pre, tt { font-family: Consolas, "SFMono-Regular", Menlo, monospace; font-size: 0.92em; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.muted { color: var(--muted); }
.small { font-size: 0.85em; }
h1 { font-size: 1.7rem; margin: 0.6em 0 0.4em; line-height: 1.25; }
h2 { font-size: 1.25rem; margin: 1.2em 0 0.5em; }
h3 { font-size: 1.05rem; }

/* header / footer */
.site-header { background: #17323f; color: #fff; }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; min-height: 54px; }
.brand { color: #fff; font-weight: 700; font-size: 1.25rem; letter-spacing: 0.2px; }
.brand span { color: #8fd3f4; }
.brand small { font-weight: 400; color: #b9c7d0; font-size: 0.75rem; margin-left: 6px; text-transform: uppercase; letter-spacing: 1px; }
.site-nav a { color: #dfe9ef; margin-left: 18px; font-weight: 500; }
.site-nav a:hover { color: #fff; }
.archive-notice { background: #fdf3d7; border-bottom: 1px solid #efd58a; color: #5c4b0f; font-size: 0.9rem; padding: 6px 0; }
.site-footer { margin-top: 40px; padding: 20px 0 30px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.85rem; }
.crumbs { font-size: 0.9rem; margin: 12px 0 6px; color: var(--muted); }

/* home */
.hero { padding: 20px 0 8px; }
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin: 16px 0 30px; }
.tile { display: block; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 16px 18px; color: var(--text); }
.tile:hover { border-color: var(--accent-2); text-decoration: none; }
.tile h2 { margin: 0 0 6px; color: var(--accent); }
.tile p { margin: 0; color: var(--muted); }

/* tables */
table { border-collapse: collapse; width: 100%; background: var(--panel); }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { background: #eef1f4; font-weight: 600; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.3px; color: var(--muted); }
.col-num { text-align: right; white-space: nowrap; width: 70px; }
.board-table, .topic-table, .listing { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; margin-bottom: 18px; }
.board-title { font-weight: 600; font-size: 1.02rem; }
.board-desc { color: var(--muted); font-size: 0.9rem; }
.board-stats { white-space: nowrap; color: var(--muted); font-size: 0.85rem; width: 110px; }
.board-last { font-size: 0.9rem; width: 34%; }
.board-row.depth-1 .board-name { padding-left: 34px; }
.board-row.depth-2 .board-name { padding-left: 58px; }
.board-row.depth-3 .board-name { padding-left: 82px; }
.category h2 { margin-bottom: 6px; }
.topic-table .col-subject a { font-weight: 500; }
.topic-table tr.sticky { background: var(--sticky); }
.topic-table .col-by { width: 15%; }
.topic-table .col-last { width: 24%; font-size: 0.88rem; white-space: nowrap; }
.topic-pages { margin-left: 6px; font-size: 0.8rem; }
.topic-pages a { margin-right: 4px; color: var(--muted); }
.badge { display: inline-block; font-size: 0.7rem; padding: 1px 6px; border-radius: 3px; background: #d9a400; color: #fff; text-transform: uppercase; vertical-align: 1px; }
.badge.poll { background: #6c8ebf; }
.pager { margin: 10px 0; font-size: 0.95rem; }
.pager a, .pager strong { display: inline-block; padding: 2px 7px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); margin: 2px 1px; }
.pager strong { background: var(--accent); color: #fff; border-color: var(--accent); }

/* posts */
.topic-title { margin-bottom: 0.2em; }
.topic-meta { margin-top: 0; }
.post { display: flex; gap: 18px; background: var(--panel); border: 1px solid var(--line); border-radius: 6px; margin: 10px 0; padding: 14px 16px; }
.post:target { border-color: var(--accent-2); box-shadow: 0 0 0 3px var(--soft); }
.poster { flex: 0 0 150px; font-size: 0.85rem; color: var(--muted); word-wrap: break-word; }
.poster-name { font-weight: 700; font-size: 1rem; display: block; }
.avatar { display: block; margin: 8px 0; max-width: 100px; max-height: 100px; border-radius: 4px; }
.avatar.big { max-width: 130px; max-height: 130px; }
.post-main { flex: 1 1 auto; min-width: 0; }
.post-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding-bottom: 6px; margin-bottom: 10px; font-size: 0.9rem; }
.post-subject { font-weight: 600; color: var(--text); }
.post-info { color: var(--muted); white-space: nowrap; }
.post-body { overflow-wrap: break-word; word-wrap: break-word; }
.post-body img.bbc_img { max-width: 100%; height: auto; }
.post-body img.smiley { vertical-align: middle; }
.post-attachments { margin-top: 12px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 0.9rem; }
.attachment { margin: 6px 0; }
.attach-thumb { max-width: 220px; max-height: 220px; border: 1px solid var(--line); padding: 2px; background: #fff; }
.attach-size { color: var(--muted); font-size: 0.85em; }
.post-modified { margin-top: 10px; font-size: 0.8rem; font-style: italic; }
.attach-missing { color: #a33; font-size: 0.85em; }

/* bbcode */
.quoteheader { font-size: 0.82rem; font-weight: 600; color: var(--muted); margin: 10px 0 0; }
blockquote.bbc_quote { margin: 0 0 10px; padding: 8px 12px; border-left: 3px solid #c8d3dc; background: #f4f7f9; font-size: 0.95em; }
blockquote.bbc_quote blockquote.bbc_quote { background: #eaeff3; }
.codeheader { font-size: 0.8rem; font-weight: 600; color: var(--muted); margin: 10px 0 0; }
pre.bbc_code { margin: 0 0 10px; padding: 10px 12px; background: var(--code); border: 1px solid var(--line); border-radius: 4px; overflow-x: auto; max-height: 480px; white-space: pre-wrap; }
.bbc_list { margin: 6px 0 6px 24px; padding: 0; }
table.bbc_table { width: auto; margin: 8px 0; border: 1px solid var(--line); }
table.bbc_table td { border: 1px solid var(--line); padding: 4px 8px; }
.meaction { color: #b0399e; font-style: italic; }
details.spoiler { border: 1px solid var(--line); border-radius: 4px; margin: 8px 0; background: #fbfbfc; }
details.spoiler summary { padding: 6px 10px; cursor: pointer; font-weight: 600; font-size: 0.9rem; color: var(--muted); }
.spoiler-body { padding: 8px 12px; border-top: 1px solid var(--line); }
.video-embed { margin: 8px 0; max-width: 640px; }
.video-embed iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; }
.video-link { font-size: 0.8rem; }
.wiki_mark { font-size: 0.6em; color: #c00; }
.bbc_tt { background: var(--code); padding: 0 3px; border-radius: 3px; }
hr { border: 0; border-top: 1px solid var(--line); margin: 12px 0; }

/* poll */
.poll { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 12px 16px; margin: 12px 0; }
.poll h2 { margin-top: 0; }
.poll-table td { border: 0; padding: 4px 8px; }
.poll-bar { width: 45%; }
.poll-bar .bar { height: 12px; background: var(--accent-2); border-radius: 3px; min-width: 2px; }
.poll-votes { white-space: nowrap; color: var(--muted); }

/* member */
.member-head { display: flex; gap: 18px; align-items: center; margin-top: 12px; }
.member-facts { display: grid; grid-template-columns: 120px 1fr; gap: 4px 12px; background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 12px 16px; }
.member-facts dt { color: var(--muted); }
.member-facts dd { margin: 0; }
.signature-box { margin: 14px 0; font-size: 0.9rem; }
.signature { color: var(--muted); border-top: 1px solid var(--line); padding-top: 6px; }
.post-list li { margin: 3px 0; }
.letter-nav a { display: inline-block; margin: 2px 6px 2px 0; font-weight: 600; }
.member-list { columns: 3 220px; list-style: none; padding: 0; margin: 0 0 12px; }
.member-list li { margin: 2px 0; break-inside: avoid; }

/* search */
.search-form { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0; }
.search-form input { flex: 1 1 320px; font-size: 1.05rem; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; }
.search-form select { padding: 8px; border: 1px solid var(--line); border-radius: 6px; background: #fff; max-width: 320px; }
.search-results { padding-left: 1.4em; }
.search-results li { margin: 6px 0; }
.search-results .meta { color: var(--muted); font-size: 0.85em; }
/* Pagefind UI (full-text search page /search/) tuned to the archive palette */
.dcarchive-search .pagefind-ui { --pagefind-ui-scale: 0.9; --pagefind-ui-primary: var(--accent); --pagefind-ui-text: var(--text);
  --pagefind-ui-background: var(--panel); --pagefind-ui-border: var(--line); --pagefind-ui-tag: var(--soft); --pagefind-ui-border-width: 1px;
  --pagefind-ui-border-radius: 6px; --pagefind-ui-font: inherit; }
.dcarchive-search .pagefind-ui__result-title a { font-weight: 600; }
.dcarchive-search .pagefind-ui__result-excerpt .pf-meta { color: var(--muted); font-size: 0.85em; }
.dcarchive-search .pagefind-ui__result { border-top: 1px solid var(--line); }

/* directory listing */
.listing td { padding: 5px 10px; }

@media (max-width: 720px) {
  .post { flex-direction: column; gap: 8px; }
  .poster { flex-basis: auto; display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
  .avatar { max-width: 44px; max-height: 44px; margin: 0; }
  .board-last, .topic-table .col-by, .topic-table .col-last, .topic-table th.col-by, .topic-table th.col-last { display: none; }
  .site-nav a { margin-left: 10px; font-size: 0.9rem; }
}

/* site map page */
.sitemap-list { line-height: 1.5; }
.sitemap-list ul { margin: 2px 0 8px 0; }
.sitemap-list .muted, .muted { color: #6b7280; font-size: 0.9em; }
.sitemap-list.columns, .sitemap-list ul.columns { column-width: 22em; column-gap: 2em; }
.sitemap-list.columns li, .sitemap-list ul.columns li { break-inside: avoid; }
.sitemap-list details summary { cursor: pointer; color: #1d4ed8; }
.board-tree > li { margin-bottom: 6px; }
.board-tree ul ul { margin-left: 1.2em; }
