/* Moderation layout only. Shared theme files supply its palette and typography. */
:root {
    --mod-bg: var(--page-bg);
    --mod-ink: var(--ink);
    --mod-link: var(--link);
    --mod-title: var(--subject);
    --mod-line: var(--line);
    --mod-label: var(--label-bg);
    --mod-fade: var(--page-fade);
    --mod-muted: var(--secondary-ink);
}
body.mod-page {
    background: var(--mod-bg) var(--mod-fade) repeat-x 50% 0;
    color: var(--mod-ink);
    font-family: var(--page-font);
    font-size: var(--page-font-size);
    margin: 0 4px;
    padding: 0 4px;
}
a, a:visited { color: var(--mod-link); text-decoration: underline; }
a:hover { color: #f00; }
header { margin: 1em 0; }
h1 {
    font-family: Tahoma, Arial, sans-serif;
    letter-spacing: -2px;
    font-size: 20pt;
    margin: 0;
}
h1, .subtitle { color: var(--mod-title); text-align: center; }
.subtitle { font-size: 8pt; }
.subtitle p { margin: 1em 0; }
fieldset {
    border: 2px groove var(--mod-line);
    margin: 0 2px 10px;
    min-width: 0;
    padding: .35em .75em .625em;
}
legend { padding: 0 2px; }
ul { margin: 1em 0; padding-left: 40px; }
li { overflow-wrap: anywhere; }
small { font-size: 10px; color: var(--mod-muted); }
.attention { font-weight: bold; }
.search { margin: 1em 0; }
fieldset .search { margin-left: 26px; }
input { max-width: 100%; box-sizing: border-box; }
.search input:not([type="checkbox"]) { width: 240px; }
.search label, .search button { margin-right: 4px; }
.login { margin: 2em auto 4em; }
.login table { margin: auto; }
.login th { background: var(--mod-label); text-align: left; padding: 4px; }
.login td { padding: 2px; }
.login tr:last-child td { text-align: center; }
.error { color: var(--mod-title); text-align: center; }
.logout { text-align: center; margin: 2em 0; }
.table-wrap { overflow-x: auto; }
.listing { width: 100%; border-collapse: collapse; text-align: left; }
.listing th { background: var(--mod-label); }
.listing td, .listing th { padding: 6px 10px; border: 1px solid var(--mod-line); vertical-align: top; overflow-wrap: anywhere; }
.listing td { max-width: 320px; }
.post-list { padding-left: 30px; }
.post-list li { padding: 6px 0; border-bottom: 1px solid var(--mod-line); }
.post-list p { margin: 4px 0; white-space: pre-wrap; }
.pages { margin: 14px 0; }
.empty { color: var(--mod-muted); }
hr { border: 0; border-top: 1px solid var(--mod-line); height: 0; }
footer { text-align: center; font-size: 10px; color: var(--mod-muted); margin: 10px 0; }
.compliance-tabs, .compliance-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 14px 0; }
.compliance-tabs [aria-current="page"] { font-weight: bold; }
.compliance-entry { overflow-wrap: anywhere; margin-top: 20px; }
.compliance-entry h2 { font-size: 14px; margin-top: 18px; }
.compliance-entry h3 { font-size: 13px; }
.compliance-meta { display: grid; grid-template-columns: minmax(80px, 140px) minmax(0, 1fr); gap: 6px 12px; }
.compliance-meta dt { color: var(--mod-muted); }
.compliance-meta dd { margin: 0; white-space: pre-wrap; }
.compliance-body { white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid var(--mod-line); padding: 12px; margin: 12px 0; }
.compliance-muted { color: var(--mod-muted); }
.compliance-button { display: inline-block; border: 1px solid var(--mod-line); border-radius: 3px; padding: 6px 9px; }
.compliance-files { padding-left: 22px; }
.compliance-files li { margin: 12px 0; }
.compliance-notice { max-width: 640px; margin: 2em auto; }
.compliance-notice .compliance-button { margin-right: 12px; }
.mod-editor { max-width: 660px; margin: 20px auto; }
.mod-editor label:not(.mod-check) { display: block; margin: 12px 0 4px; font-weight: bold; }
.mod-editor input:not([type="hidden"]):not([type="checkbox"]), .mod-editor textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
.mod-editor textarea { resize: vertical; }
.mod-appearance { display: block; text-align: right; margin: 6px 0; font-size: 10px; color: var(--mod-muted); }
.mod-counter { display: block; text-align: right; font-size: 11px; color: var(--mod-muted); margin-top: 3px; }
.mod-counter.attention { color: var(--mod-title); }
.mod-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 14px 0; }
.mod-filter input { width: 240px; }
.mod-filter output { color: var(--mod-muted); }
.mod-dialog { background: var(--mod-bg); color: var(--mod-ink); border: 1px solid var(--mod-line); width: 560px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); box-sizing: border-box; overflow: auto; padding: 16px; }
.mod-dialog::backdrop { background: rgb(0 0 0 / .5); }
.mod-dialog h2 { color: var(--mod-title); font-size: 16px; margin: 0; }
.mod-dialog .logout { margin: 16px 0; overflow-wrap: anywhere; }
.mod-dialog-close { display: block; margin-left: auto; }
[hidden] { display: none !important; }
.mod-check { display: block; margin: 12px 0; }
.mod-hint { color: var(--mod-muted); margin: 6px 0 12px; }
.mod-editor button { margin-top: 12px; }
.mod-blotter p { margin: 0; }
.mod-blotter pre { white-space: pre-wrap; }
@media (max-width: 540px) {
    fieldset .search { margin-left: 0; }
    .search input:not([type="checkbox"]) { width: 100%; margin: 5px 0; }
    .search label { display: inline-block; }
    .listing td, .listing th { min-width: 100px; }
}

.queue-preview { display:block; width:auto; max-width: min(100%, 360px); max-height:300px; object-fit:contain; }
.listing pre { max-width:40rem; white-space:pre-wrap; overflow-wrap:anywhere; }
