/* global color palette */
:root {
  --bg:#0a0a0a;
  --fg:#ffffff;
  --muted:#2a2a2a;
  --accent:#ffffff;
}
html,body{height:100%;margin:0;background:var(--bg);color:var(--fg);font-family:ui-monospace,monospace}
.wrap{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
h1{font-size:3rem;letter-spacing:.18rem;margin:0;color:#ffffff}
.wip{opacity:.7;letter-spacing:.35rem}
@keyframes flicker{0%,100%{opacity:1}50%{opacity:.5}}
.flicker{animation:flicker .16s infinite}
.footer{position:absolute;bottom:20px;left:0;right:0;text-align:center;font-size:.9rem;opacity:.8;display:flex;flex-direction:column;gap:4px}
.socials{display:flex;justify-content:center;gap:20px}
.socials a{color:#ffffff;text-decoration:none;transition:.2s}
.socials a:hover{color:#ff0033}

/* unified button style */
button, .btn {
  appearance:none;
  border-radius:0;
  display:inline-block;
  padding:.65rem .8rem;
  border:1px solid var(--muted);
  background:transparent;
  color:var(--fg);
  text-decoration:none;
  text-align:center;
  letter-spacing:.02em;
  cursor:pointer;
}
button:hover, .btn:hover {
  border-color:var(--accent);
  color:var(--accent);
}

/* upload listing */
header{padding:20px;text-align:left}
.crumbs a{color:#ffffff;text-decoration:none}
table{border-collapse:collapse;width:100%;max-width:800px;margin:0 auto}
th,td{padding:4px 8px}
th{text-align:left}
.size{text-align:right}
tr.dir .name a{font-weight:bold}
.files{padding:20px}

.title-link,
.title-link:link,
.title-link:visited,
.title-link:hover,
.title-link:active {
  text-decoration: none;
  color: inherit;
}

.title-link h1 {
  margin: 0;
  text-decoration: none;
  color: #ffffff;
  cursor: pointer; /* чтобы было видно, что кликается */
}

.error{color:#ff4d4f}