:root {
    --bg:#fbfbfa; --fg:#1d1c1a; --mut:#6b6862; --line:#e2e0db;
    --card:#fff; --acc:#2f6f4f; --warn:#9a4b2f; --hi:#f4f1ea;
  }
  @media (prefers-color-scheme: dark) {
    :root { --bg:#191817; --fg:#e8e6e1; --mut:#9a968e; --line:#33312e;
            --card:#211f1e; --acc:#7fb79a; --warn:#d99b7e; --hi:#2a2826; }
  }
  * { box-sizing:border-box }
  body { margin:0; background:var(--bg); color:var(--fg); font:15px/1.5
         ui-sans-serif,system-ui,'Segoe UI',Roboto,sans-serif }
  .wrap { max-width:1180px; margin:0 auto; padding:24px 20px 64px }
  h1 { font-size:20px; margin:0 0 4px; font-weight:650 }
  .sub { color:var(--mut); font-size:13px; margin-bottom:22px }
  .card { background:var(--card); border:1px solid var(--line);
          border-radius:10px; padding:16px 18px; margin-bottom:16px }
  label { display:block; font-size:12px; text-transform:uppercase;
          letter-spacing:.04em; color:var(--mut); margin-bottom:6px }
  input, select, button { font:inherit; color:inherit }
  input[type=text], select { background:var(--bg); border:1px solid var(--line);
          border-radius:7px; padding:8px 10px; width:100% }
  input[type=text]:focus, select:focus { outline:2px solid var(--acc);
          outline-offset:-1px }
  .row { display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end }
  .row > div { flex:1 1 160px; min-width:120px }
  .srcs { display:flex; gap:14px; flex-wrap:wrap; margin-top:4px }
  .srcs label { display:flex; gap:6px; align-items:center; text-transform:none;
          font-size:14px; letter-spacing:0; color:var(--fg); margin:0;
          cursor:pointer }
  button { background:var(--acc); color:#fff; border:0; border-radius:7px;
          padding:9px 16px; cursor:pointer; font-weight:550 }
  button.ghost { background:transparent; color:var(--fg);
          border:1px solid var(--line) }
  button:disabled { opacity:.45; cursor:default }
  .hits { margin-top:10px; border:1px solid var(--line); border-radius:8px;
          max-height:270px; overflow:auto }
  .hit { display:grid; grid-template-columns:1fr auto; gap:10px;
         align-items:center; padding:8px 11px; cursor:pointer;
         border-bottom:1px solid var(--line); font-size:14px }
  .hit:last-child { border-bottom:0 }
  .hit:hover, .hit:focus { background:var(--hi); outline:0 }
  .names { margin:-4px 0 10px 4px }
  .nm { display:inline-flex; align-items:center; gap:4px; font-size:12.5px;
        color:var(--mut); border:1px dashed var(--line); border-radius:6px;
        padding:2px 4px 2px 8px; margin:0 6px 6px 0 }
  .nm button { background:none; color:var(--mut); padding:0 2px; font-size:13px }
  button.tiny { padding:2px 8px; font-size:12px; margin-left:6px }
  .hit .why { color:var(--mut); font-size:12px }
  .hit .lv { font-size:11px; color:var(--mut); text-transform:uppercase }
  .pill { display:inline-flex; align-items:center; gap:8px; background:var(--hi);
          border:1px solid var(--line); border-radius:999px; padding:5px 8px 5px 12px;
          margin:0 8px 8px 0; font-size:14px }
  .pill b { font-weight:600 }
  .pill small { color:var(--mut) }
  .pill button { background:none; color:var(--mut); padding:0 4px; font-size:16px;
          line-height:1 }
  table { border-collapse:collapse; width:100%; font-variant-numeric:tabular-nums }
  th, td { padding:6px 9px; text-align:right; border-bottom:1px solid var(--line);
           white-space:nowrap }
  th:first-child, td:first-child { text-align:left }
  thead th { font-size:12px; color:var(--mut); font-weight:600 }
  tfoot td { font-weight:650; border-top:2px solid var(--line); border-bottom:0 }
  .tblhead { display:flex; justify-content:space-between; align-items:baseline;
             margin-bottom:8px; gap:12px; flex-wrap:wrap }
  .tblhead h2 { font-size:15px; margin:0; font-weight:600 }
  .tblhead span { color:var(--mut); font-size:12px }
  .scroll { overflow-x:auto }
  .warn { color:var(--warn); font-size:13px; margin-top:8px }
  .empty { color:var(--mut); font-size:14px }
  .note { color:var(--mut); font-size:12px; margin-top:10px }
  .tabs { display:flex; gap:4px; margin:0 0 10px }
  .tab { background:transparent; color:var(--mut); border:1px solid var(--line);
         border-radius:7px 7px 0 0; padding:7px 14px; font-weight:500;
         border-bottom-color:transparent }
  .tab.on { background:var(--card); color:var(--fg); font-weight:600 }
  .tab:hover { color:var(--fg) }