:root { --bg:#12151a; --panel:#1a1f27; --line:#2c333f; --text:#dfe5ee; --muted:#8b97a8;
        --pending:#c9a227; --accepted:#3f9d58; --corrected:#3b7dd8; --rejected:#a4444a; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text);
       font:13px/1.45 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
header { padding:.6rem .9rem; border-bottom:1px solid var(--line); background:var(--panel); }
h1 { margin:0 0 .5rem; font-size:1.05rem; letter-spacing:.02em; }
h2 { margin:0 0 .4rem; font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
h3 { margin:.6rem 0 .3rem; font-size:.78rem; color:var(--muted); }
#project-bar { display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
input, button { font:inherit; background:#232a34; color:var(--text);
                border:1px solid var(--line); border-radius:4px; padding:.3rem .55rem; }
button { cursor:pointer; }
button:disabled { opacity:.4; cursor:not-allowed; }
button:not(:disabled):hover { border-color:#4a5566; background:#2b3541; }
#project-meta { color:var(--muted); font-variant-numeric:tabular-nums; }
main { display:grid; grid-template-columns:1fr 380px; height:calc(100vh - 108px); }
#plan-panel { display:flex; flex-direction:column; min-width:0; }
#plan-toolbar { display:flex; gap:.35rem; align-items:center; padding:.4rem .6rem;
                border-bottom:1px solid var(--line); flex-wrap:wrap; }
#viewer-hint { color:var(--muted); margin-left:auto; }
#plan-viewport { flex:1; overflow:hidden; background:#0d1014; }
#plan { width:100%; height:100%; touch-action:none; cursor:grab; }
#side-panel { border-left:1px solid var(--line); overflow-y:auto; background:var(--panel); }
.block { padding:.7rem .9rem; border-bottom:1px solid var(--line); }
#candidate-list { list-style:none; margin:0; padding:0; max-height:190px; overflow-y:auto; }
.candidate-item { padding:.25rem .4rem; border-radius:3px; cursor:pointer;
                  border-left:3px solid transparent; font-variant-numeric:tabular-nums; }
.candidate-item:hover { background:#232a34; }
.candidate-item.selected { background:#2b3541; }
.candidate-item.status-pending { border-left-color:var(--pending); }
.candidate-item.status-accepted { border-left-color:var(--accepted); }
.candidate-item.status-corrected { border-left-color:var(--corrected); }
.candidate-item.status-rejected { border-left-color:var(--rejected); }
.detail-row { display:flex; justify-content:space-between; gap:1rem; padding:.1rem 0; }
.detail-row .k { color:var(--muted); }
.detail-row .v { font-variant-numeric:tabular-nums; text-align:right; word-break:break-all; }
#candidate-actions, #classification-row { display:flex; gap:.3rem; flex-wrap:wrap; margin-top:.5rem; }
table { width:100%; border-collapse:collapse; margin-top:.5rem; font-variant-numeric:tabular-nums; }
th, td { text-align:left; padding:.2rem .3rem; border-bottom:1px solid var(--line); }
th { color:var(--muted); font-weight:600; font-size:.75rem; }
.released { color:var(--accepted); }
.blocked { color:var(--pending); }
#audit { margin:0; padding-left:1.1rem; max-height:170px; overflow-y:auto;
         font-variant-numeric:tabular-nums; }
#status-bar { padding:.35rem .9rem; border-top:1px solid var(--line);
              background:var(--panel); color:var(--muted); min-height:1.9rem; }
#status-bar.error { color:#e8828a; }
polygon.candidate { fill:rgba(120,160,220,.14); stroke:#7aa0dc; stroke-width:.6; cursor:pointer;
                    vector-effect:non-scaling-stroke; }
polygon.candidate.status-accepted { fill:rgba(63,157,88,.18); stroke:var(--accepted); }
polygon.candidate.status-corrected { fill:rgba(59,125,216,.18); stroke:var(--corrected); }
polygon.candidate.status-rejected { fill:rgba(164,68,74,.14); stroke:var(--rejected);
                                    stroke-dasharray:4 3; }
polygon.candidate.selected { stroke-width:2; fill:rgba(230,200,90,.22); stroke:#e6c85a; }
polygon.overlay-draft { fill:rgba(230,120,60,.2); stroke:#e6783c; stroke-width:1.4;
                        stroke-dasharray:5 3; vector-effect:non-scaling-stroke; }
circle.overlay-vertex { fill:#e6783c; }
