:root { --bg:#f4f6f9; --card:#fff; --line:#d9dee6; --accent:#2b6cb0; --ok:#2f855a; --err:#c53030; }
[x-cloak] { display: none !important; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, "Segoe UI", Arial, sans-serif; background:var(--bg); color:#1a202c; }
header { display:flex; justify-content:space-between; align-items:center; padding:12px 20px;
  background:#1a365d; color:#fff; }
header h1 { font-size:17px; margin:0; font-weight:600; }
header small { opacity:.7; font-weight:400; }
header .user { font-size:13px; display:flex; gap:10px; align-items:center; }
main { max-width:980px; margin:18px auto; padding:0 16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:16px 18px; margin-bottom:16px; }
.card h2 { font-size:15px; margin:0 0 12px; }
.card h3 { font-size:13px; margin:16px 0 6px; color:#4a5568; }
.login { max-width:360px; margin:60px auto; }
label { display:block; font-size:13px; margin-bottom:10px; }
input, select { width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:5px; font-size:14px; }
.inline, .row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:8px 0; }
.inline input, .row select { width:auto; flex:1; min-width:120px; }
label.file { border:1px dashed var(--line); padding:10px; border-radius:6px; background:#fafbfc; }
label.chk { display:flex; gap:6px; align-items:center; white-space:nowrap; }
label.chk input { width:auto; }
button { background:var(--accent); color:#fff; border:0; padding:8px 14px; border-radius:5px;
  font-size:13px; cursor:pointer; }
button:disabled { opacity:.5; cursor:not-allowed; }
button:hover:not(:disabled) { background:#245a94; }
table { width:100%; border-collapse:collapse; font-size:13px; margin-top:8px; }
th, td { border:1px solid var(--line); padding:5px 8px; text-align:right; }
th { background:#eef2f7; text-align:center; }
td:first-child, th:first-child { text-align:left; }
.err { color:var(--err); font-size:13px; min-height:16px; }
.prog { height:8px; background:#e2e8f0; border-radius:4px; overflow:hidden; margin:8px 0; }
.prog div { height:100%; background:var(--ok); transition:width .2s; }
.jobstatus { font-size:13px; color:#4a5568; }
.gallery { display:flex; gap:10px; flex-wrap:wrap; }
.gallery figure { margin:0; width:47%; }
.gallery img { width:100%; border:1px solid var(--line); border-radius:4px; }
.gallery figcaption { font-size:11px; color:#718096; text-align:center; }