:root { --blue:#155eef; --ink:#172033; --muted:#667085; --line:#d0d5dd; --bg:#f7f8fb; }
* { box-sizing:border-box; } body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.55 "Microsoft YaHei",Arial,sans-serif; }
header { background:#102a56; color:white; padding:18px max(24px, calc((100vw - 1040px)/2)); display:flex; align-items:baseline; gap:18px; } header a { color:white; text-decoration:none; font-size:21px; font-weight:700; } header span { font-size:12px; padding:2px 7px; background:#31578f; border-radius:10px; } header small { opacity:.75; }
main, footer { max-width:1040px; margin:auto; padding:30px 24px; } footer { color:var(--muted); font-size:13px; } .hero { padding:32px 0 18px; } h1 { margin-top:0; } .cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; } .card,.panel { background:#fff; border:1px solid #e6e8ec; border-radius:12px; padding:24px; box-shadow:0 2px 5px #10182808; } .card h2 { font-size:18px; } .card p,.hint { color:var(--muted); } .button { display:inline-block; background:var(--blue); border:0; border-radius:7px; color:#fff; padding:9px 16px; text-decoration:none; cursor:pointer; font:inherit; } .back { display:block; color:var(--blue); text-decoration:none; margin-bottom:14px; }
label { display:block; font-weight:600; margin:20px 0; } input[type=file] { display:block; width:100%; border:1px dashed var(--line); border-radius:7px; padding:12px; margin-top:7px; background:#fafafa; } .form-message { margin-top:15px; color:var(--muted); } .status { display:inline-block; padding:4px 10px; border-radius:999px; font-weight:700; background:#eef2f6; } .status-success { color:#067647; background:#ecfdf3; } .status-failed { color:#b42318; background:#fef3f2; } .status-processing,.status-queued { color:#175cd3; background:#eff8ff; } .downloads { margin-top:20px; display:grid; gap:9px; } .downloads a { color:var(--blue); } .summary { margin-top:14px; color:var(--muted); } code { font-size:12px; word-break:break-all; }