:root{
  --paper: #E7EBEA;
  --paper-raised: #F9FAF7;
  --ink: #16242E;
  --muted: #55625F;
  --line: #C7CCC3;
  --accent: #2B5C8A;
  --on-accent: #F9FAF7;
  --danger: #B23A2E;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper: #131E25;
    --paper-raised: #1B2A32;
    --ink: #E9EEEA;
    --muted: #9FB1AC;
    --line: #33454E;
    --accent: #7CB2D4;
    --on-accent: #10202A;
    --danger: #E2897B;
  }
}

*{ box-sizing: border-box; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
  line-height:1.55;
}
a{ color:var(--accent); }

.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:0.9rem 1.5rem; border-bottom:1px solid var(--line); background:var(--paper-raised);
}
.brand{ font-weight:700; letter-spacing:0.02em; text-decoration:none; color:var(--ink); display:flex; align-items:center; gap:0.5rem; }
.brand .dot{ width:8px; height:8px; background:var(--danger); display:inline-block; transform:rotate(45deg); }
.topnav{ display:flex; gap:1.3rem; font-size:0.88rem; }
.topnav a{ color:var(--muted); text-decoration:none; }
.topnav a:hover{ color:var(--ink); }

.wrap{ max-width:840px; margin:0 auto; padding: 2rem 1.5rem 4rem; }

.page-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1.4rem; flex-wrap:wrap; }
h1{ margin:0; font-size:1.7rem; }
.sub{ color:var(--muted); margin:0.3rem 0 0; font-size:0.92rem; }

.btn{
  display:inline-flex; align-items:center; padding:0.55em 1em; border-radius:4px;
  text-decoration:none; font-size:0.9rem; font-weight:600; border:1px solid transparent; cursor:pointer;
}
.btn-primary{ background:var(--accent); color:var(--on-accent); }
.btn-ghost{ border-color:var(--line); color:var(--ink); }

.catfilter{ display:flex; flex-wrap:wrap; gap:0.4rem; margin-bottom:1.6rem; }
.catfilter a{
  text-decoration:none; font-size:0.82rem; color:var(--muted); border:1px solid var(--line);
  padding:0.35em 0.7em; border-radius:99px;
}
.catfilter a.active{ background:var(--accent); color:var(--on-accent); border-color:var(--accent); }

.catgroup{ margin-bottom:2rem; }
.catgroup h2{ font-size:1.05rem; margin:0 0 0.7rem; display:flex; align-items:center; gap:0.5rem; }
.count{ font-family: ui-monospace, Menlo, monospace; font-size:0.75rem; color:var(--muted); font-weight:400; }

.entrylist{ display:flex; flex-direction:column; gap:0.7rem; }
.entry{ border:1px solid var(--line); background:var(--paper-raised); border-radius:6px; padding:0.9rem 1.1rem; }
.entry-q{ font-weight:600; margin-bottom:0.35rem; }
.entry-a{ color:var(--muted); font-size:0.92rem; white-space:pre-wrap; }
.entry-meta{ display:flex; align-items:center; gap:1rem; margin-top:0.7rem; font-size:0.78rem; color:var(--muted); }
.entry-meta a{ color:var(--muted); }
.entry-meta .spacer{ flex:1; }
.linklike{ background:none; border:none; padding:0; font:inherit; color:var(--muted); cursor:pointer; text-decoration:underline; }
.linklike.danger{ color:var(--danger); }

.empty{ color:var(--muted); }

.entryform{ display:flex; flex-direction:column; gap:1.1rem; max-width:600px; }
.entryform label{ display:flex; flex-direction:column; gap:0.4rem; font-size:0.85rem; color:var(--muted); font-weight:600; }
.entryform input, .entryform select, .entryform textarea{
  font: inherit; padding:0.6em 0.7em; border:1px solid var(--line); border-radius:4px;
  background:var(--paper-raised); color:var(--ink); resize:vertical;
}
.entryform label.inline{ flex-direction:row; align-items:center; gap:0.4em; font-weight:400; }
.current-evidence{ font-size:0.85rem; color:var(--muted); display:flex; align-items:center; gap:0.8em; flex-wrap:wrap; }
.form-actions{ display:flex; gap:0.8rem; margin-top:0.4rem; }
.grid3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.hint{ font-size:0.86rem; color:var(--muted); background:var(--paper-raised); border:1px solid var(--line); border-radius:6px; padding:0.8em 1em; margin-bottom:1.1rem; }
.form-error{ font-size:0.88rem; color:var(--danger); background:var(--paper-raised); border:1px solid var(--danger); border-radius:6px; padding:0.7em 1em; margin-bottom:1rem; }

.tbl-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:6px; }
.datatable{ border-collapse:collapse; width:100%; font-size:0.88rem; }
.datatable th, .datatable td{ text-align:left; padding:0.55em 0.8em; border-bottom:1px solid var(--line); }
.datatable thead th{ background:var(--paper-raised); font-size:0.76rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); }
.datatable tbody tr:last-child td{ border-bottom:none; }
.datatable code{ font-family: ui-monospace, Menlo, monospace; font-size:0.85em; }
.datatable .muted{ color:var(--muted); font-size:0.85em; }

.badge{ font-family: ui-monospace, Menlo, monospace; font-size:0.72rem; padding:0.2em 0.55em; border-radius:99px; border:1px solid var(--line); color:var(--muted); text-transform:uppercase; }
.badge-uploaded{ color:var(--danger); border-color:var(--danger); }
.badge-mapped, .badge-matched{ color:var(--accent); border-color:var(--accent); }
.badge-reviewed, .badge-exported{ color:#2B6A4F; border-color:#2B6A4F; }

.qa-list{ display:flex; flex-direction:column; gap:0.7rem; }
.qa-item{ border:1px solid var(--line); background:var(--paper-raised); border-radius:6px; padding:0.9rem 1.1rem; }
.qa-question{ font-weight:600; margin-bottom:0.5rem; }
.qa-question code{ font-family: ui-monospace, Menlo, monospace; font-weight:400; color:var(--muted); font-size:0.82em; margin-right:0.4em; }
.qa-answer{ font-size:0.9rem; }
.qa-answer .badge{ margin-right:0.6em; margin-bottom:0.4em; display:inline-block; }
.qa-answer.muted{ color:var(--muted); }
.alt-list{ margin:0.5rem 0 0; padding-left:1.2rem; font-size:0.87rem; color:var(--muted); }
.alt-list li{ margin-bottom:0.35rem; }
.alt-score{ font-family: ui-monospace, Menlo, monospace; font-size:0.85em; color:var(--accent); }
.alt-pick{
  font-size:0.76rem; margin-left:0.5em; border:1px solid var(--accent); color:var(--accent);
  background:none; border-radius:99px; padding:0.1em 0.7em; cursor:pointer;
}
.alt-pick:hover{ background:var(--accent); color:var(--on-accent); }

.qa-item textarea{
  width:100%; font: inherit; font-size:0.9rem; margin-top:0.6rem; padding:0.6em 0.7em;
  border:1px solid var(--line); border-radius:4px; background:var(--paper-raised);
  color:var(--ink); resize:vertical;
}
.qa-controls{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:0.6rem; font-size:0.82rem; color:var(--muted); }
.qa-controls label.inline{ display:flex; align-items:center; gap:0.4em; font-weight:400; }
.qa-controls select{ font: inherit; font-size:0.82rem; padding:0.3em 0.5em; border:1px solid var(--line); border-radius:4px; background:var(--paper-raised); color:var(--ink); }