:root{
  --bg:#0d1117;
  --panel:#11161d;
  --line:#242c37;
  --text:#c9d1d9;
  --dim:#7d8894;
  --accent:#58a6ff;
  --accent2:#56d364;
  --warn:#e3b341;
  --danger:#f85149;
  --mono:"SF Mono","JetBrains Mono","Fira Code",Consolas,monospace;
}
*{box-sizing:border-box;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:14px;
}
.wrap{max-width:980px;margin:0 auto;padding:40px 24px 70px;}
.wrap-narrow{max-width:460px;margin:0 auto;padding:80px 24px 70px;}

.filebar{
  display:flex;align-items:center;gap:8px;
  background:#161b22;border:1px solid var(--line);
  border-radius:8px 8px 0 0;padding:9px 14px;
  font-family:var(--mono);font-size:12px;color:var(--dim);
}
.filebar .dot{width:9px;height:9px;border-radius:50%;}
.dot.r{background:#ff5f56;} .dot.y{background:#ffbd2e;} .dot.g{background:#27c93f;}
.filebar-right{margin-left:auto;display:flex;align-items:center;gap:8px;}
.logout-link{color:var(--dim);text-decoration:none;}
.logout-link:hover{color:var(--danger);}

.doc{
  background:var(--panel);border:1px solid var(--line);border-top:none;
  border-radius:0 0 8px 8px;padding:34px 36px;
}

h1{font-size:20px;margin:0 0 4px;color:#fff;font-family:var(--mono);}
.sub{color:var(--dim);font-size:13px;margin:0 0 20px;}

.tag{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--mono);font-size:11px;color:var(--accent2);
  border:1px solid #2a3f2e;background:#132017;padding:3px 9px;
  border-radius:4px;margin-bottom:18px;
}

h2{
  font-size:14px;color:var(--accent);margin:34px 0 14px;
  font-family:var(--mono);display:flex;align-items:center;gap:8px;
  border-bottom:1px solid var(--line);padding-bottom:8px;
}
h2 i{width:18px;text-align:center;}
h2 .idx{color:var(--dim);}

p{color:var(--text);line-height:1.6;margin:0 0 12px;}
p.dim, .dim{color:var(--dim);}

label{
  display:block;font-family:var(--mono);font-size:11px;color:var(--dim);
  text-transform:uppercase;letter-spacing:.3px;margin:14px 0 6px;
}
label:first-of-type{margin-top:0;}
input[type=text], input[type=password]{
  width:100%;background:#0a0d12;border:1px solid var(--line);color:var(--text);
  padding:10px 12px;border-radius:6px;font-size:13.5px;font-family:inherit;
}
input[type=text]:focus, input[type=password]:focus{outline:none;border-color:var(--accent);}
.form-stack{display:flex;flex-direction:column;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  background:#1c222c;border:1px solid var(--line);color:var(--text);
  padding:10px 16px;border-radius:6px;font-size:13px;cursor:pointer;
  font-family:inherit;
}
.btn:hover{border-color:var(--accent);}
.btn-primary{background:#1a2d4d;border-color:#2c4a7c;color:#9cc4ff;}
.btn-primary:hover{border-color:var(--accent);}
.btn-primary:disabled{opacity:.4;cursor:not-allowed;}
.btn-ghost{background:transparent;}

.dropzone{
  border:1.5px dashed var(--line);border-radius:8px;
  padding:30px 20px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;
}
.dropzone:hover, .dropzone.drag{border-color:var(--accent);background:#0f1522;}
.dz-icon{font-size:26px;color:var(--dim);margin-bottom:8px;}
.dz-browse{color:var(--accent);text-decoration:underline;cursor:pointer;}
#dzInner p{margin:4px 0;}

.progress-wrap{margin-top:16px;}
.progress-label{
  display:flex;justify-content:space-between;font-family:var(--mono);
  font-size:11px;color:var(--dim);margin-bottom:6px;
}
.progress-track{height:8px;background:#0a0d12;border:1px solid var(--line);border-radius:4px;overflow:hidden;}
.progress-bar{height:100%;width:0%;background:var(--accent2);transition:width .1s;}

.search-row{display:flex;gap:8px;}
.search-row input{flex:1;}

table.file-table{width:100%;border-collapse:collapse;font-size:13px;margin:4px 0 8px;}
.file-table th{
  text-align:left;color:var(--dim);font-family:var(--mono);
  font-weight:500;font-size:11px;letter-spacing:.3px;text-transform:uppercase;
  padding:8px 10px;border-bottom:1px solid var(--line);
}
.file-table td{padding:10px 10px;border-bottom:1px solid var(--line);vertical-align:middle;}
.file-table td i{color:var(--accent);margin-right:8px;width:14px;text-align:center;}
.mono-cell{font-family:var(--mono);font-size:12px;color:var(--dim);}
.pill{
  display:inline-block;font-family:var(--mono);font-size:11px;color:var(--warn);
  border:1px solid #3a2f14;background:#1a1710;padding:2px 7px;border-radius:4px;
  margin:1px 3px 1px 0;
}
.actions-cell{white-space:nowrap;text-align:right;}
.icon-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:5px;border:1px solid var(--line);
  color:var(--dim);background:#0a0d12;margin-left:6px;cursor:pointer;text-decoration:none;
}
.icon-btn i{margin:0 !important;}
.icon-btn:hover{color:var(--accent);border-color:var(--accent);}
.icon-btn-danger:hover{color:var(--danger);border-color:var(--danger);}

.callout{
  border-left:3px solid var(--warn);background:#1a1710;
  padding:12px 16px;border-radius:0 6px 6px 0;font-size:12.5px;color:#d9c17a;
  margin-top:18px;display:flex;gap:10px;
}
.callout-err{border-left-color:var(--danger);background:#1a1010;color:#f0a8a4;}
.callout i{margin-top:2px;}

.foot{
  margin-top:34px;padding-top:16px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:11px;color:var(--dim);
  display:flex;justify-content:space-between;
}

@media (max-width: 720px){
  .grid2{grid-template-columns:1fr;}
  .file-table thead, .file-table th{display:none;}
  .file-table tr{display:block;border-bottom:1px solid var(--line);padding:10px 0;}
  .file-table td{display:flex;justify-content:space-between;border-bottom:none;padding:4px 10px;}
  .file-table td::before{content:attr(data-label);color:var(--dim);font-family:var(--mono);font-size:11px;}
  .file-table td.actions-cell{justify-content:flex-end;}
  .file-table td.actions-cell::before{content:none;}
}