:root { --bg:#f5f5f4; --card:#fff; --text:#1c1917; --muted:#78716c; --line:#e7e5e4; --accent:#2563eb; --ok:#15803d; --err:#b91c1c; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#1c1917; --card:#292524; --text:#f5f5f4; --muted:#a8a29e; --line:#44403c; --accent:#60a5fa; --ok:#4ade80; --err:#f87171; }
}
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center; padding:16px;
       background:var(--bg); color:var(--text); font:16px/1.5 system-ui, -apple-system, Segoe UI, sans-serif; }
.card { width:100%; max-width:480px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:28px; }
.card.wide { max-width:860px; align-self:flex-start; }
h1 { margin:0 0 4px; font-size:1.35rem; }
p.sub { margin:0 0 20px; color:var(--muted); font-size:.95rem; }
label { display:block; font-size:.9rem; margin:0 0 6px; }
input[type=password], textarea { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px;
       background:transparent; color:inherit; font:inherit; }
textarea { resize:vertical; min-height:70px; }
button, a.btn { display:inline-block; padding:10px 16px; border:0; border-radius:8px; background:var(--accent); color:#fff;
       font:inherit; font-weight:600; cursor:pointer; text-decoration:none; }
button:disabled { opacity:.5; cursor:default; }
button.link { background:none; color:var(--muted); padding:0; font-weight:400; text-decoration:underline; }
button.small, a.btn.small { padding:6px 12px; font-size:.85rem; }
button.danger { background:none; color:var(--err); border:1px solid var(--err); }
a { color:var(--accent); }
.row { margin-bottom:16px; }
.drop { border:2px dashed var(--line); border-radius:10px; padding:28px 16px; text-align:center; color:var(--muted); cursor:pointer; }
.drop.over { border-color:var(--accent); color:var(--text); }
.drop input { display:none; }
ul.files { list-style:none; padding:0; margin:10px 0 0; font-size:.9rem; }
ul.files li { display:flex; justify-content:space-between; gap:12px; padding:4px 0; border-bottom:1px solid var(--line); }
ul.files li > :first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
ul.files li > :last-child { flex-shrink:0; }
.muted { color:var(--muted); }
.ok { color:var(--ok); } .err { color:var(--err); }
.bar { height:8px; background:var(--line); border-radius:4px; overflow:hidden; display:none; margin-bottom:16px; }
.bar div { height:100%; width:0; background:var(--accent); transition:width .15s; }
.actions { display:flex; justify-content:space-between; align-items:center; }
.logout { margin-top:20px; }
.batch { border-top:1px solid var(--line); padding:18px 0; }
.batch-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; }
.batch-head form { display:inline; }
.batch-tools { display:flex; gap:8px; align-items:center; }
.note { margin:10px 0 0; padding:10px 12px; background:var(--bg); border-radius:8px; font-size:.9rem; white-space:pre-wrap; overflow-wrap:anywhere; }