:root {
  color-scheme: light dark;
  --bg: #f5f5f3;
  --panel: #ffffff;
  --text: #191919;
  --muted: #6a6a6a;
  --border: #ddddda;
  --accent: #222222;
  --danger: #a11d1d;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#111; --panel:#181818; --text:#f1f1f1; --muted:#aaa; --border:#333; --accent:#f1f1f1; --danger:#ff7b7b; }
}
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:var(--bg); color:var(--text); }
a { color:inherit; }
.home { min-height:100vh; display:grid; place-items:center; }
.home a { text-decoration:none; font-size:clamp(2.2rem, 8vw, 5.5rem); font-weight:650; letter-spacing:-0.06em; }
.home a:hover { opacity:.7; }
.wrap { width:min(860px, calc(100% - 32px)); margin:64px auto; }
.panel { background:var(--panel); border:1px solid var(--border); border-radius:18px; padding:24px; box-shadow:0 10px 30px rgba(0,0,0,.04); }
.top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
h1 { margin:0; font-size:1.45rem; }
.small, .muted { color:var(--muted); font-size:.92rem; }
form { margin:0; }
label { display:block; margin:14px 0 6px; font-size:.95rem; }
input[type=text], input[type=password], input[type=file] { width:100%; padding:12px; border:1px solid var(--border); border-radius:10px; background:transparent; color:var(--text); }
button, .button { display:inline-block; border:0; border-radius:10px; padding:10px 14px; background:var(--accent); color:var(--bg); text-decoration:none; cursor:pointer; font:inherit; }
.button.secondary, button.secondary { background:transparent; color:var(--text); border:1px solid var(--border); }
button.danger { background:transparent; color:var(--danger); border:1px solid var(--border); }
.actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.error, .success { border-radius:10px; padding:10px 12px; margin:12px 0; }
.error { border:1px solid #c77; }
.success { border:1px solid #7a9; }
.files { margin-top:22px; border-top:1px solid var(--border); }
.file { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; padding:14px 0; border-bottom:1px solid var(--border); align-items:center; }
.filename { overflow-wrap:anywhere; }
.filemeta { color:var(--muted); font-size:.85rem; margin-top:3px; }
.login { width:min(420px, calc(100% - 32px)); margin:12vh auto; }
@media (max-width:600px) { .top, .file { grid-template-columns:1fr; display:grid; } .actions { justify-content:flex-start; } }
h2 { margin:0 0 14px; font-size:1.08rem; }
.section-gap { margin-top:18px; }
.users { display:grid; gap:12px; }
.user-card { border:1px solid var(--border); border-radius:12px; padding:14px; }
.user-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
details { margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
summary { cursor:pointer; color:var(--muted); }
@media (max-width:600px) { .user-head { align-items:flex-start; } }

.upload-box { padding-bottom:6px; }
.upload-queue { display:grid; gap:10px; margin-top:16px; }
.upload-row { border:1px solid var(--border); border-radius:10px; padding:10px 12px; }
.upload-head { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:7px; }
.upload-row progress { width:100%; height:10px; accent-color:var(--accent); }
.upload-done { opacity:.75; }
.upload-failed { border-color:#c77; }
button:disabled { opacity:.55; cursor:not-allowed; }
@media (max-width:600px) { .upload-head { align-items:flex-start; flex-direction:column; gap:4px; } }