:root {
  --bg:#060a07;
  --panel:#0b120d;
  --line:#132116;
  --txt:#b9ffcc;
  --muted:#6fe39a;
  --accent:#00ff77;
}

* { box-sizing: border-box; }
body {
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  color: var(--txt);
  background: radial-gradient(1200px 600px at 20% 0%, #0b1a10 0%, var(--bg) 55%);
}

.wrap { max-width: 1000px; margin: 0 auto; padding: 18px; }
.top { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; padding: 10px 0 16px; }
.logo { font-weight: 900; letter-spacing: 2px; font-size: 26px; }
.logo span { color: var(--accent); }
.tag { color: var(--muted); font-size: 13px; }

.panel {
  background: linear-gradient(180deg, rgba(14,27,18,.8), rgba(8,14,10,.85));
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  margin: 12px 0;
  box-shadow: 0 0 0 1px rgba(0,255,119,.06), 0 12px 30px rgba(0,0,0,.35);
}

h2 { margin:0 0 10px; font-size: 16px; }
.hint { margin-top: 10px; color: var(--muted); font-size: 13px; }

.uploader input[type="file"] { width:100%; padding: 10px; border:1px dashed var(--line); border-radius: 10px; background:#061008; color:var(--txt); }
.row { display:flex; gap:10px; align-items:center; margin-top:10px; }
.row label { color: var(--muted); }
.row select, .row button {
  padding: 10px 12px; border-radius: 10px;
  border:1px solid var(--line); background:#061008; color:var(--txt);
}
.row button { cursor:pointer; border-color: rgba(0,255,119,.35); }
.row button:hover { filter: brightness(1.08); }

.log { margin-top: 10px; max-height: 220px; overflow:auto; border:1px solid var(--line); border-radius: 10px; padding: 10px; background:#050c06; }
.line { padding: 6px 0; border-bottom: 1px solid rgba(19,33,22,.6); }
.line.ok { color: #bfffe0; }
.line.warn { color: #ffe9a6; }
.line.bad { color: #ffb2b2; }

.searchbar { display:flex; gap:10px; flex-wrap: wrap; }
.searchbar input {
  flex: 1;
  min-width: 220px;
  padding: 10px 12px; border-radius: 10px;
  border:1px solid var(--line); background:#061008; color:var(--txt);
}
.searchbar button, .searchbar select {
  padding: 10px 12px; border-radius: 10px;
  border:1px solid var(--line); background:#061008; color:var(--txt);
  cursor:pointer;
}

.results { margin-top: 10px; display:flex; flex-direction: column; gap: 10px; }
.item {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  background: rgba(6,16,8,.7);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}
.name a { color: var(--accent); text-decoration: none; font-weight: 700; }
.meta { display:flex; gap:10px; color: var(--muted); font-size: 12px; flex-wrap: wrap; }
.actions { display:flex; gap:8px; align-items:center; }
.actions button, .actions .dl {
  padding: 8px 10px; border-radius: 10px;
  border:1px solid var(--line); background:#061008; color:var(--txt);
  cursor:pointer;
  text-decoration:none;
}
.actions .dl { border-color: rgba(0,255,119,.35); }
.pager { display:flex; justify-content:space-between; align-items:center; margin-top: 10px; gap: 10px; }
.pager button { padding: 10px 12px; border-radius: 10px; border:1px solid var(--line); background:#061008; color:var(--txt); cursor:pointer; }
.foot { color: var(--muted); text-align:center; padding: 16px 0 6px; font-size: 12px; }

@media (max-width: 760px) {
  .item { flex-direction: column; align-items:flex-start; }
  .actions { width: 100%; }
}