:root{--bg:#f6f7f9;--card:#fff;--ink:#1d2330;--mute:#667085;--accent:#2d6cdf;--ok:#1a7f4b;--bad:#c0392b;--line:#ccd2dc}
@media (prefers-color-scheme:dark){:root{--bg:#14171c;--card:#1d2129;--ink:#e8eaee;--mute:#98a2b3;--accent:#6b9bff;--ok:#4cc38a;--bad:#ff7b6b;--line:#3a4250}}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 -apple-system,Segoe UI,Arial,sans-serif}
main{max-width:620px;margin:0 auto;padding:32px 16px}
h1{font-size:24px;margin:0 0 4px}p.sub{color:var(--mute);margin:0 0 24px}
.card{background:var(--card);border-radius:14px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.08),0 6px 20px rgba(0,0,0,.05);margin-top:16px}
label{font-weight:600;display:block;margin-bottom:6px}
select,input[type=password]{font:inherit;padding:9px 11px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);margin-bottom:18px;box-sizing:border-box}
input[type=password]{width:100%}
button{font:inherit;padding:9px 18px;border-radius:8px;border:0;background:var(--accent);color:#fff;cursor:pointer}
button.link{background:none;color:var(--mute);padding:0;text-decoration:underline;font-size:14px}
.out{margin-top:18px;text-align:right}
#drop{border:2px dashed var(--line);border-radius:12px;padding:40px 16px;text-align:center;cursor:pointer;transition:.15s}
#drop.over{border-color:var(--accent);background:rgba(45,108,223,.06)}
#drop b{color:var(--accent)}
ul{list-style:none;padding:0;margin:18px 0 0}
li{padding:10px 0;border-top:1px solid rgba(128,128,128,.18)}
.name{font-weight:600;word-break:break-all}.st{color:var(--mute);font-size:14px}
.ok{color:var(--ok)}.bad{color:var(--bad)}
progress{width:100%;height:6px;margin-top:6px}