:root {
  --bg:#0f1115; --panel:#171a21; --panel2:#1e222b; --line:#2a2f3a; --txt:#e6e9ef; --muted:#9aa3b2;
  --accent:#2dd4bf; --pending:#e3b341; --approved:#43c98a; --x:#c08cff;
  --g-unverified:#f0606a; --g-single:#e3b341; --g-cross:#43c98a;
}
* { box-sizing:border-box; }
body { margin:0; font:14px/1.5 -apple-system,Segoe UI,Roboto,sans-serif; background:var(--bg); color:var(--txt);
  height:100vh; display:flex; flex-direction:column; }
header { display:flex; align-items:center; gap:14px; padding:10px 18px; border-bottom:1px solid var(--line);
  background:var(--panel); flex:0 0 auto; }
header .brand { font-weight:700; color:var(--accent); } header .sub { color:var(--muted); font-size:12px; }
header .identity { margin-left:auto; font-size:12px; color:var(--muted); }
header .identity b { color:var(--txt); }
header .identity .link { background:none; border:none; color:var(--accent); cursor:pointer; font:inherit; padding:0 2px; text-decoration:underline; }
header .identity .setbtn { background:var(--pending); color:#0b0d11; border:none; border-radius:6px; padding:4px 10px; font:inherit; font-weight:700; cursor:pointer; }
header .legend { font-size:11px; color:var(--muted); }
.badge { padding:1px 7px; border-radius:999px; font-size:10px; font-weight:700; color:#0b0d11; }
.badge.pending { background:var(--pending); } .badge.approved { background:var(--approved); }

.split { flex:1 1 auto; display:flex; min-height:0; }
.tree-pane { flex:0 0 auto; width:340px; min-width:200px; overflow:auto; padding:10px 6px; background:var(--panel); }
.divider { width:6px; cursor:col-resize; background:var(--line); flex:0 0 auto; }
.divider:hover { background:var(--accent); }
.editor-pane { flex:1 1 auto; overflow:auto; padding:18px 22px; }
.placeholder { color:var(--muted); margin-top:40px; text-align:center; }

/* tree */
.grp { margin:2px 0 6px; } .grp > .grp-h { cursor:pointer; padding:4px 8px; color:var(--muted);
  font-size:11px; text-transform:uppercase; letter-spacing:.05em; user-select:none; }
.grp > .grp-h:hover { color:var(--txt); }
.node { display:flex; align-items:center; gap:7px; padding:4px 8px 4px 22px; border-radius:6px; cursor:pointer; }
.node:hover { background:var(--panel2); } .node.sel { background:var(--panel2); outline:1px solid var(--accent); }
.node .nm { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.node .id { color:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; }
.node .cnt { color:var(--approved); font-size:10px; font-weight:700; flex:0 0 auto; }
.node .ncnt { color:var(--pending); font-size:10px; font-weight:700; flex:0 0 auto; }
.dot { width:8px; height:8px; border-radius:50%; flex:0 0 auto; }
.dot.pending { background:var(--pending); } .dot.approved { background:var(--approved); }

/* editor */
.ed-head { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.ed-head h2 { font-size:18px; margin:0; } .ed-head .type { color:var(--x); font-size:12px; font-weight:700; }
.meta { display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 14px; }
.chip { background:var(--panel2); border:1px solid var(--line); border-radius:999px; padding:3px 10px; font-size:11px; color:var(--muted); }
.chip b { color:var(--txt); } .chip.g-cross_checked b { color:var(--g-cross); }
.chip.g-single_source b { color:var(--g-single); } .chip.g-unverified b { color:var(--g-unverified); }
/* section headings */
.sec-h { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-right:8px; }
.sec-h2 { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:18px 0 8px; }

/* approvers */
.approvers { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:10px 12px; background:var(--panel);
  border:1px solid var(--line); border-radius:10px; }
.who { background:rgba(67,201,138,.15); color:var(--approved); border:1px solid var(--approved); border-radius:999px;
  padding:2px 10px; font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.who .wd { color:var(--muted); font-weight:400; font-size:10px; }
.acmt { color:var(--muted); font-size:12px; font-style:italic; flex-basis:100%; }   /* approver comment */
.when { color:var(--muted); font-size:11px; }
.muted { color:var(--muted); }

/* approval comment field */
textarea#noteText { width:100%; min-height:60px; resize:vertical; margin-top:8px;
  font:13px/1.45 -apple-system,Segoe UI,Roboto,sans-serif;
  background:var(--panel2); color:var(--txt); border:1px solid var(--line); border-radius:8px; padding:9px 11px; }
textarea#noteText:disabled { opacity:.5; }

/* read-only content card */
.card { background:var(--panel); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.field { display:grid; grid-template-columns:180px 1fr; gap:14px; padding:10px 14px; border-top:1px solid var(--line); }
.field:first-child { border-top:none; }
.fk { color:var(--muted); font-size:12px; font-weight:600; }
.fv { color:var(--txt); font-size:13px; min-width:0; word-break:break-word; }
.fv .vlist { margin:0; padding-left:24px; } .fv .vlist li { margin:2px 0; }
.fv .vlist li::marker { color:var(--muted); }
.fv .vobj { display:flex; flex-direction:column; gap:3px; }
.fv .vrow { display:flex; gap:8px; } .fv .vk { color:var(--muted); min-width:130px; font-size:12px; }
.fv .vv { color:var(--txt); }

/* concerns */
.notes { display:flex; flex-direction:column; gap:6px; }
.note { display:flex; gap:10px; align-items:baseline; padding:8px 12px; background:var(--panel); border:1px solid var(--line);
  border-left:3px solid var(--pending); border-radius:8px; }
.note .ntext { flex:1; color:var(--txt); font-size:13px; } .note .when { font-size:11px; }

/* actions */
.toolbar { display:flex; gap:10px; align-items:center; margin-top:16px; }
button.act { border:none; border-radius:8px; padding:9px 18px; font:inherit; font-weight:700; cursor:pointer; }
button.sign { background:var(--approved); color:#06121a; } button.flag { background:var(--panel2); color:var(--pending); border:1px solid var(--pending); }
button.act:hover { filter:brightness(1.08); } button.act:disabled { opacity:.5; cursor:default; filter:none; }
.status { font-size:12px; color:var(--muted); } .status.ok { color:var(--approved); } .status.err { color:var(--g-unverified); }
.cap-note { color:var(--muted); font-size:11px; margin-top:12px; line-height:1.5; }

/* raw (read-only, collapsed) */
.raw { margin-top:14px; } .raw summary { cursor:pointer; color:var(--muted); font-size:11px; }
.raw pre { background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:12px; overflow:auto;
  font:11px/1.45 ui-monospace,Consolas,monospace; color:var(--muted); max-height:340px; }

/* ── EE editor: proposals (propose → second-person merge) ── */
.node .pcnt { color:var(--x); font-size:10px; font-weight:700; flex:0 0 auto; }
.badge.rejected { background:var(--g-unverified); }
.badge.merged { background:var(--approved); }
.prop { border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin:8px 0; background:var(--panel); }
.prop.pending { border-color:var(--pending); }
.prop-h { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:6px; }
.prop-by { color:var(--muted); font-size:12px; }
.prop-note { color:var(--txt); font-size:12px; font-style:italic; }
.diff { margin:8px 0; }
.diff-cols { display:flex; gap:10px; }
.diff-col { flex:1 1 0; background:var(--panel2); border-radius:8px; padding:8px 10px; min-width:0; }
.diff-col.new { outline:1px solid var(--accent); }
.diff-h { font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:4px; }
.prop-cm { flex:1 1 auto; background:var(--panel2); border:1px solid var(--line); color:var(--txt);
  border-radius:8px; padding:8px 10px; font:inherit; }
.ed-form { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:12px 14px; }
.ed-form .fk { margin-top:10px; }
.ed-form textarea, .ed-form input { width:100%; background:var(--panel2); border:1px solid var(--line);
  color:var(--txt); border-radius:8px; padding:8px 10px; font:inherit; margin:4px 0; }
.frow { display:flex; gap:6px; align-items:flex-start; }
.frow .narrow { flex:0 0 230px; }
button.mini { background:var(--panel2); border:1px solid var(--line); color:var(--muted); border-radius:6px;
  cursor:pointer; padding:7px 10px; margin:4px 0; font:inherit; flex:0 0 auto; }
button.mini:hover { color:var(--txt); border-color:var(--accent); }
button.mini.add { color:var(--accent); }

/* qSet editor */
.optletter { flex:0 0 22px; text-align:center; font-weight:700; color:var(--muted); padding-top:12px; }
.optletter.correctL { color:var(--approved); }
.optletter.wrongL { color:var(--pending); }
.optradio { flex:0 0 auto; width:16px; height:16px; margin-top:14px; accent-color:var(--approved); }
.ed-form select.dxsel { flex:0 0 130px; background:var(--panel2); border:1px solid var(--line);
  color:var(--txt); border-radius:8px; padding:8px 6px; font:inherit; margin:4px 0; }

/* new-RC wizard */
button.mini.newrc { margin-left:8px; padding:2px 8px; font-size:10px; text-transform:none; letter-spacing:0; }
.ed-form select.wide { flex:1 1 auto; }
label.chk { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--txt); padding:2px 4px; cursor:pointer; }
label.chk input { width:auto; margin:0; accent-color:var(--accent); }
.refgroup-h { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:10px 0 2px; }
.refpick { max-height:150px; overflow:auto; background:var(--panel2); border:1px solid var(--line);
  border-radius:8px; padding:6px 8px; margin:4px 0; }

/* library-asset editing */
.chip.usedby b { color:var(--x); }
.cap-note.payload-note { background:var(--panel); border:1px solid var(--pending); border-radius:8px;
  padding:8px 12px; color:var(--txt); font-size:12px; }
