:root{
  --bg:#0f172a;
  --panel:#0b1224;
  --card:#0f1a33;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --primary:#3b82f6;
  --danger:#ef4444;
  --pill:#1e293b;
}
*{box-sizing:border-box}
html,body{height:100%;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
}

#app{display:grid;grid-template-columns:280px 1fr;min-height:100vh}
.sidebar{background:var(--panel);border-right:1px solid #13203c;padding:16px;display:flex;flex-direction:column;gap:12px}
.sidebar-top{display:flex;gap:8px}
input,select,textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid #1e2b4a;background:#0a142b;color:var(--text)}
.btn{padding:10px 12px;border-radius:10px;border:1px solid transparent;cursor:pointer}
.btn.primary{background:var(--primary);color:#fff}
.btn.secondary{background:#0a142b;color:var(--text);border-color:#1e2b4a}
.btn.danger{background:var(--danger);color:#fff}
.btn:disabled{opacity:.5;cursor:not-allowed}

.hint{font-size:12px;color:var(--muted)}
.dossier-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;overflow:auto}
.dossier-list li{background:var(--card);border:1px solid #1a2747;border-radius:12px;padding:10px;cursor:pointer}
.dossier-list li.active{outline:2px solid var(--primary)}

.main{padding:20px}
.placeholder{color:var(--muted);background:var(--card);border:1px dashed #1a2747;border-radius:12px;padding:24px;max-width:340px}
.hidden{display:none}

.dossier-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.dossier-header h2{margin:0}

.categories{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.category-pill{
  background:var(--pill); color:#fff;
  border:1px solid #213052; padding:8px 12px;border-radius:999px;cursor:pointer;
}
.category-pill.active{background:var(--primary)}
.upload-row{display:flex;gap:8px;align-items:center;margin:8px 0 6px}
.path{font-size:12px;color:var(--muted)}

.files table{width:100%;border-collapse:collapse;background:var(--card);border-radius:12px;overflow:hidden}
.files th, .files td{border-bottom:1px solid #1a2747;padding:10px}
.files th{background:#0a142b;color:#cbd5e1}
.files td.actions{text-align:right}

dialog{border:none;border-radius:12px;padding:16px;background:#0b1224;color:var(--text);max-width:520px;width:90%}
dialog::backdrop{background:rgba(0,0,0,.35)}
label{display:block;margin:10px 0}
.small{color:var(--muted);font-size:12px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}