:root { --fg:#1d2330; --muted:#667085; --line:#e4e7ec; --accent:#1f6feb; --bg:#f7f8fa; --err:#b42318; --ok:#067647; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.45 system-ui, sans-serif; color:var(--fg); background:var(--bg); }
header { display:flex; justify-content:space-between; align-items:center; padding:12px 24px; background:#fff; border-bottom:1px solid var(--line); }
h1 { font-size:18px; margin:0; }
main { max-width:960px; margin:24px auto; padding:0 16px; }
.who { display:flex; gap:12px; align-items:center; margin:0; color:var(--muted); }
button { font:inherit; padding:6px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; cursor:pointer; }
button:hover { border-color:var(--accent); }
button.link { border:0; background:none; color:var(--accent); padding:0; }
button.danger { color:var(--err); }
.drop { display:block; padding:40px 16px; text-align:center; border:2px dashed #b8c0cc; border-radius:10px; background:#fff; cursor:pointer; }
.drop.over { border-color:var(--accent); background:#eef4ff; }
.result, .notice { margin:16px 0; padding:12px 16px; background:#fff; border:1px solid var(--line); border-radius:8px; }
.result ul { margin:4px 0 8px; padding-left:20px; }
.result .skipped { color:var(--err); }
.result .saved { color:var(--ok); }
.result .pending { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:6px 0; }
.notice { border-color:var(--err); color:var(--err); }
.notice a { color:inherit; }
#search { width:100%; margin:16px 0 8px; padding:8px 12px; font:inherit; border:1px solid var(--line); border-radius:6px; }
table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); }
th, td { text-align:left; padding:8px 12px; border-bottom:1px solid var(--line); vertical-align:middle; }
td.actions { white-space:nowrap; text-align:right; }
td img { width:48px; height:48px; object-fit:cover; border-radius:4px; background:#eee; display:block; }
.muted { color:var(--muted); }
.login { display:grid; place-items:center; min-height:100vh; }
.card { background:#fff; padding:24px 28px; border:1px solid var(--line); border-radius:10px; width:min(360px, 92vw); }
.card label { display:block; margin:12px 0; }
.card input { display:block; width:100%; margin-top:4px; padding:8px; font:inherit; border:1px solid var(--line); border-radius:6px; }
.error { color:var(--err); margin:8px 0 0; }