:root{
  --bg:#13151a; --card:#1c1f27; --card2:#232733; --fg:#e6e8ee; --muted:#9aa3b2;
  --accent:#6ee7b7; --accent2:#38bdf8; --warn:#fbbf24; --err:#f87171; --border:#2c3240;
}
*{box-sizing:border-box}
body{
  margin:0; font-family:"Segoe UI",system-ui,sans-serif; background:var(--bg); color:var(--fg);
  line-height:1.6; padding:24px; max-width:960px; margin:0 auto;
}
h1{font-size:1.6rem; margin:0 0 4px}
h2{font-size:1.1rem; margin:0 0 12px; color:var(--accent)}
code{background:#0c0d11; padding:1px 5px; border-radius:4px; font-size:.9em; color:var(--accent2)}
.lead{color:var(--muted)}
.badge{font-size:.6em; background:var(--accent2); color:#08121a; padding:2px 8px; border-radius:10px; vertical-align:middle}
.card{background:var(--card); border:1px solid var(--border); border-radius:12px; padding:18px 20px; margin:16px 0}
.hidden{display:none}
.banner{padding:12px 16px; border-radius:8px; margin:12px 0}
.banner.info{background:#1b2a33; color:var(--accent2)}
.banner.warn{background:#332b13; color:var(--warn)}
.banner.err{background:#3a1c1c; color:var(--err)}
.banner.ok{background:#16291f; color:var(--accent)}
.dropzone{border:2px dashed var(--border); border-radius:12px; padding:28px; text-align:center; transition:.15s}
.dropzone.drag{border-color:var(--accent); background:#16291f}
.filebtn{color:var(--accent2); cursor:pointer; text-decoration:underline}
.hint{color:var(--muted); font-size:.85rem}
.warn{color:var(--warn); font-size:.9rem}
table{width:100%; border-collapse:collapse; font-size:.92rem}
th,td{text-align:left; padding:7px 10px; border-bottom:1px solid var(--border)}
th{color:var(--muted); font-weight:600}
td.num{font-variant-numeric:tabular-nums; color:var(--muted)}
tr.skill{background:#16291f}
tr.skill td:first-child{color:var(--accent); font-weight:700}
input[type=number]{
  width:120px; background:#0c0d11; border:1px solid var(--border); color:var(--fg);
  padding:5px 8px; border-radius:6px; font-variant-numeric:tabular-nums;
}
input.changed{border-color:var(--accent); background:#10231a}
.toolbar{display:flex; gap:10px; align-items:center; margin-bottom:12px; flex-wrap:wrap}
.btn{background:var(--card2); color:var(--fg); border:1px solid var(--border); padding:8px 14px;
  border-radius:8px; cursor:pointer; font-size:.92rem}
.btn:hover{border-color:var(--accent2)}
.btn.primary{background:var(--accent); color:#08121a; border:none; font-weight:700}
.btn.ghost{background:transparent}
.actions{display:flex; flex-direction:column; gap:6px}
.actions .btn{align-self:flex-start; margin-top:6px}
.eq{font-size:.78rem; color:var(--accent2)}
.tag{font-size:.7rem; color:var(--muted); margin-left:6px; border:1px solid var(--border); padding:0 6px; border-radius:6px}
tr.nontarget td{opacity:.5}
footer{color:var(--muted); font-size:.8rem; margin-top:24px; border-top:1px solid var(--border); padding-top:12px}
.kpi{display:flex; gap:24px; flex-wrap:wrap}
.kpi b{color:var(--fg)}