:root { --accent: #3a6; }
body { font-family: system-ui, sans-serif; margin: 0; color: #223; }
nav { display: flex; gap: 16px; align-items: center; background: #223; color: #fff;
      padding: 10px 16px; }
nav a { color: #fff; text-decoration: none; }
nav .right { margin-left: auto; }
main { max-width: 760px; margin: 24px auto; padding: 0 16px; }
h1 { margin-bottom: 8px; }
.card { border: 1px solid #ccd; border-radius: 8px; padding: 12px 16px; margin: 12px 0; }
.card .title { font-size: 1.1em; font-weight: 600; color: #223; text-decoration: none; }
.tags { margin: 6px 0; }
.tag { background: #eef; color: #335; border-radius: 12px; padding: 2px 8px;
       margin-right: 4px; font-size: .85em; }
.meta { color: #778; font-size: .85em; }
.body { white-space: pre-wrap; }
.status { padding: 2px 8px; border-radius: 10px; background: #eee; }
.status.new { background: #ffe; color: #963; }
.status.answered { background: #eef; color: #336; }
.status.published { background: #efe; color: #393; }
.err { color: #a33; }
.ok { color: #2a7; }
.banner { padding: 10px 16px; text-align: center; }
.banner.warn { background: #fff3cd; color: #856404; border-bottom: 1px solid #ffe08a; }
button { cursor: pointer; }
form label { display: block; margin: 10px 0; }
input, textarea { width: 100%; padding: 8px; box-sizing: border-box; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 8px; border-bottom: 1px solid #ccd; }
#filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
#filters button.active { background: #223; color: #fff; }
#search-input { width: 220px; }
#tag-filter { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; width: 100%; }
.tag-chip { border: 1px solid #99a; background: #f5f5fa; color: #335;
            border-radius: 12px; padding: 2px 10px; font-size: .85em; }
.tag-chip:hover { border-color: #223; }
.tag-chip.selected { background: #223; border-color: #223; color: #fff; }
.tag-chip .count { opacity: .6; font-size: .9em; }
#rb-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
#rb-search { width: 220px; }
.muted { color: #99a; font-size: .85em; }
.faq-badge { margin-left: 8px; padding: 2px 8px; border-radius: 10px; background: #fff2cc; color: #9c6500; font-size: .85em; }
.lang-badge { display: inline-block; padding: 1px 7px; border-radius: 10px; background: #e8f0fe; color: #1a4d8f; font-size: .85em; font-weight: 600; }
button.faq-on { background: #2e7d32; color: #fff; border: none; padding: 6px 12px; border-radius: 4px; }
button.faq-off { background: #b26a00; color: #fff; border: none; padding: 6px 12px; border-radius: 4px; }
#errata-filters { display: flex; gap: 16px; align-items: center; margin-bottom: 12px; flex-wrap: wrap; }
#errata-filters label { display: inline-flex; gap: 6px; align-items: center; }
#errata-form { padding: 14px; margin-bottom: 16px; border: 1px solid #ccd; border-radius: 6px; background: #fafafa; }
.ef-row { display: flex; gap: 12px; margin: 10px 0; flex-wrap: wrap; }
.ef-row label { display: inline-flex; gap: 6px; align-items: center; }
#errata-title { width: 100%; padding: 8px; box-sizing: border-box; }
#errata-body { width: 100%; padding: 8px; box-sizing: border-box; }
